From 2cf41c9e0d17bef5592e8673b2b19d74b912b27e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Andr=C3=A9s=20Gonz=C3=A1lez=20Mu=C3=B1oz?=
 <andres.gonzalez@vizzuality.com>
Date: Mon, 11 Sep 2023 08:57:56 +0200
Subject: [PATCH] minor styling

---
 .../project/sidebar/project/scenarios-list/index.tsx  | 11 ++++++-----
 .../sidebar/scenario/solutions/overview/index.tsx     | 10 ++++------
 app/svgs/ui/table.svg                                 |  3 ---
 3 files changed, 10 insertions(+), 14 deletions(-)
 delete mode 100644 app/svgs/ui/table.svg

diff --git a/app/layout/project/sidebar/project/scenarios-list/index.tsx b/app/layout/project/sidebar/project/scenarios-list/index.tsx
index 8643780753..7febd4d3c0 100644
--- a/app/layout/project/sidebar/project/scenarios-list/index.tsx
+++ b/app/layout/project/sidebar/project/scenarios-list/index.tsx
@@ -29,6 +29,7 @@ import { ScrollArea } from 'components/scroll-area';
 import HelpBeacon from 'layout/help/beacon';
 import NoResults from 'layout/project/sidebar/project/inventory-panel/components/no-results';
 import ScenarioToolbar from 'layout/project/sidebar/project/scenarios-list/toolbar';
+import Section from 'layout/section';
 import { cn } from 'utils/cn';
 
 import bgScenariosDashboard from 'images/new-layout/bg-scenarios-dashboard.png';
@@ -350,12 +351,12 @@ export const ScenariosList: React.FC = () => {
           )}
 
           {(hasScenarios || search || hasFilters) && (
-            <div className="flex w-full flex-shrink-0 flex-col items-center justify-center rounded-[20px] bg-gray-700 p-6">
+            <Section className="flex w-full flex-col items-center justify-center space-y-5">
               {hasScenarios && (
                 <Button
                   theme="primary-alt"
                   size="base"
-                  className="mb-5 flex w-full overflow-hidden uppercase"
+                  className="flex w-full overflow-hidden uppercase"
                   disabled={solutionsReportLoader}
                   onClick={onDownloadSolutionsSummary}
                 >
@@ -364,20 +365,20 @@ export const ScenariosList: React.FC = () => {
                     className="absolute bottom-0 left-0 right-0 top-0 z-40 flex h-full w-full items-center justify-center bg-gray-800 bg-opacity-90"
                     iconClassName="w-10 h-10 text-primary-500"
                   />
-                  {scenariosData.length === 1 ? 'Export scenario data' : 'Export scenarios data'}
+                  {`Export scenario${scenariosData.length > 1 ? 's' : ''} data`}
                 </Button>
               )}
               <Button
                 theme="primary"
                 size="base"
-                className="!px-5"
+                className="px-5"
                 disabled={!editable}
                 onClick={() => setModal(true)}
               >
                 <span className="mr-5">Create scenario</span>
                 <Icon icon={PLUS_SVG} className="h-4 w-4" />
               </Button>
-            </div>
+            </Section>
           )}
         </div>
 
diff --git a/app/layout/project/sidebar/scenario/solutions/overview/index.tsx b/app/layout/project/sidebar/scenario/solutions/overview/index.tsx
index 9cd447dd05..131e500a1a 100644
--- a/app/layout/project/sidebar/scenario/solutions/overview/index.tsx
+++ b/app/layout/project/sidebar/scenario/solutions/overview/index.tsx
@@ -7,6 +7,7 @@ import { useRouter } from 'next/router';
 import { getScenarioEditSlice } from 'store/slices/scenarios/edit';
 
 import { motion } from 'framer-motion';
+import { HiOutlineTable } from 'react-icons/hi';
 
 import { useProject } from 'hooks/projects';
 import { useScenario, useDownloadScenarioReport } from 'hooks/scenarios';
@@ -14,15 +15,12 @@ import { useSolution, useBestSolution } from 'hooks/solutions';
 import { useToasts } from 'hooks/toast';
 
 import Button from 'components/button';
-import Icon from 'components/icon';
 import Loading from 'components/loading';
 import Modal from 'components/modal';
 import Section from 'layout/section';
 import SolutionSelected from 'layout/solutions/selected';
 import { formatFileName } from 'utils/units';
 
-import TABLE_SVG from 'svgs/ui/table.svg?sprite';
-
 import SolutionsTableForm from './table/table-form/component';
 
 export const SolutionsOverview = (): JSX.Element => {
@@ -179,7 +177,7 @@ export const SolutionsOverview = (): JSX.Element => {
               <Button
                 theme="primary-alt"
                 size="base"
-                className="mb-4 flex h-12 overflow-hidden uppercase"
+                className="relative overflow-hidden uppercase"
                 disabled={PDFLoader}
                 onClick={onDownloadReport}
               >
@@ -193,11 +191,11 @@ export const SolutionsOverview = (): JSX.Element => {
               <Button
                 theme="primary"
                 size="base"
-                className="mb-4 flex h-12 uppercase"
+                className="relative uppercase"
                 onClick={() => setShowTable(true)}
               >
                 View solutions table
-                <Icon icon={TABLE_SVG} className="absolute right-8 h-4 w-4" />
+                <HiOutlineTable className="absolute right-8 h-6 w-6" />
               </Button>
 
               <Modal
diff --git a/app/svgs/ui/table.svg b/app/svgs/ui/table.svg
deleted file mode 100644
index 3c6b3598ba..0000000000
--- a/app/svgs/ui/table.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M0 2C0 1.46957 0.210714 0.960859 0.585786 0.585786C0.960859 0.210714 1.46957 0 2 0L14 0C14.5304 0 15.0391 0.210714 15.4142 0.585786C15.7893 0.960859 16 1.46957 16 2V14C16 14.5304 15.7893 15.0391 15.4142 15.4142C15.0391 15.7893 14.5304 16 14 16H2C1.46957 16 0.960859 15.7893 0.585786 15.4142C0.210714 15.0391 0 14.5304 0 14V2ZM15 4H11V7H15V4ZM15 8H11V11H15V8ZM15 12H11V15H14C14.2652 15 14.5196 14.8946 14.7071 14.7071C14.8946 14.5196 15 14.2652 15 14V12ZM10 15V12H6V15H10ZM5 15V12H1V14C1 14.2652 1.10536 14.5196 1.29289 14.7071C1.48043 14.8946 1.73478 15 2 15H5ZM1 11H5V8H1V11ZM1 7H5V4H1V7ZM6 4V7H10V4H6ZM10 8H6V11H10V8Z" />
-</svg>