Merge pull request #175 from Vizzuality/increase-sidebar-width

[N/A] Increase the sidebar width slightly
Vizzuality · Feb 13, 2024 · a3ad107 · a3ad107
2 parents 879391e + ef6da88
commit a3ad107
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 4 deletions.
diff --git a/frontend/src/containers/map/sidebar/index.tsx b/frontend/src/containers/map/sidebar/index.tsx
@@ -45,7 +45,7 @@ const MapSidebar: React.FC = () => {
             {
               'hidden md:flex': true,
               'left-0': !isSidebarOpen,
-              'left-[430px] transition-[left] delay-500': isSidebarOpen,
+              'left-[460px] transition-[left] delay-500': isSidebarOpen,
             }
           )}
           onClick={onClickAnalysis}
@@ -61,14 +61,14 @@ const MapSidebar: React.FC = () => {
           className={cn('absolute bottom-0 z-10 h-12 border-l-0 px-1 !py-3', {
             'hidden md:flex': true,
             'left-0': !isSidebarOpen,
-            'left-[430px] transition-[left] delay-500': isSidebarOpen,
+            'left-[460px] transition-[left] delay-500': isSidebarOpen,
           })}
         >
           <LuChevronLeft className={cn('h-6 w-6', { 'rotate-180': !isSidebarOpen })} aria-hidden />
           <span className="sr-only">Toggle sidebar</span>
         </Button>
       </CollapsibleTrigger>
-      <CollapsibleContent className="relative top-0 left-0 z-20 h-full flex-shrink-0 bg-white fill-mode-none md:w-[430px]">
+      <CollapsibleContent className="relative top-0 left-0 z-20 h-full flex-shrink-0 bg-white fill-mode-none md:w-[460px]">
         {showAnalysisSidebar && <Analysis />}
         {showDetailsSidebar && <Details />}
       </CollapsibleContent>

diff --git a/frontend/src/styles/globals.css b/frontend/src/styles/globals.css
@@ -14,7 +14,7 @@
 }
 
 .mapboxgl-ctrl-attrib-inner {
-  @apply px-2 max-w-[100vw] md:max-w-[calc(100vw_-_430px_-_40px_-_16px)] py-1 overflow-hidden font-sans text-xs text-left whitespace-nowrap text-ellipsis;
+  @apply px-2 max-w-[100vw] md:max-w-[calc(100vw_-_460px_-_40px_-_16px)] py-1 overflow-hidden font-sans text-xs text-left whitespace-nowrap text-ellipsis;
 }
 
 .mapboxgl-popup-content {