fix: fix fullscreen css (#487)

yihong0618 · Sep 10, 2023 · a0ada4b · a0ada4b
1 parent 6a636f0
commit a0ada4b
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 6 deletions.
diff --git a/src/components/RunMap/index.tsx b/src/components/RunMap/index.tsx
@@ -1,6 +1,11 @@
 import MapboxLanguage from '@mapbox/mapbox-gl-language';
 import React, { useRef, useCallback } from 'react';
-import ReactMapGL, { Layer, Source, FullscreenControl, MapRef } from 'react-map-gl';
+import ReactMapGL, {
+  Layer,
+  Source,
+  FullscreenControl,
+  MapRef,
+} from 'react-map-gl';
 import useActivities from '@/hooks/useActivities';
 import {
   MAP_LAYER_LIST,
@@ -92,10 +97,7 @@ const RunMap = ({
       ref={mapRefCallback}
       mapboxApiAccessToken={MAPBOX_TOKEN}
     >
-      <RunMapButtons
-        changeYear={changeYear}
-        thisYear={thisYear}
-      />
+      <RunMapButtons changeYear={changeYear} thisYear={thisYear} />
       <FullscreenControl className={styles.fullscreenButton} />
       <Source id="data" type="geojson" data={geoData}>
         <Layer

diff --git a/src/components/RunMap/style.module.scss b/src/components/RunMap/style.module.scss
@@ -30,10 +30,12 @@
 }
 
 .fullscreenButton {
+  display: inline-block;
+  position: absolute;
   top: 0rem;
   right: 0rem;
   opacity: 0.3;
-  padding: 1.2rem;
+  padding: 0.8rem;
 }
 
 .runTitle {