From ea928439e2610e430c3b2dd634633bde16e36f81 Mon Sep 17 00:00:00 2001
From: Jackson Harper <jacksonh@gmail.com>
Date: Thu, 13 Jun 2024 22:40:49 +0800
Subject: [PATCH] Dont show section if all items removed, better colours for
 load more button

---
 .../web/components/elements/Pagination.tsx    |  4 +--
 .../web/components/nav-containers/home.tsx    | 28 ++++++++++---------
 .../components/templates/navMenu/Footer.tsx   |  2 +-
 3 files changed, 18 insertions(+), 16 deletions(-)

diff --git a/packages/web/components/elements/Pagination.tsx b/packages/web/components/elements/Pagination.tsx
index 2d36cdb59..426c076fd 100644
--- a/packages/web/components/elements/Pagination.tsx
+++ b/packages/web/components/elements/Pagination.tsx
@@ -46,8 +46,8 @@ const Pagination = <T,>({
               fontFamily: '$inter',
               fontSize: '15px',
               fontWeight: '500',
-              color: '$thTextSubtle4',
-              bg: '#3D3D3D',
+              color: '$readerFont',
+              bg: '$thNavMenuFooter',
               py: '10px',
               px: '25px',
             }}
diff --git a/packages/web/components/nav-containers/home.tsx b/packages/web/components/nav-containers/home.tsx
index 09f435cc9..10bf604c9 100644
--- a/packages/web/components/nav-containers/home.tsx
+++ b/packages/web/components/nav-containers/home.tsx
@@ -244,19 +244,21 @@ const TopPicksHomeSection = (props: HomeSectionProps): JSX.Element => {
         },
       }}
     >
-      <SpanBox
-        css={{
-          fontFamily: '$inter',
-          fontSize: '16px',
-          fontWeight: '600',
-          color: '$homeTextTitle',
-          '@mdDown': {
-            px: '20px',
-          },
-        }}
-      >
-        {props.homeSection.title}
-      </SpanBox>
+      {items.length > 0 && (
+        <SpanBox
+          css={{
+            fontFamily: '$inter',
+            fontSize: '16px',
+            fontWeight: '600',
+            color: '$homeTextTitle',
+            '@mdDown': {
+              px: '20px',
+            },
+          }}
+        >
+          {props.homeSection.title}
+        </SpanBox>
+      )}
 
       <Pagination
         items={items}
diff --git a/packages/web/components/templates/navMenu/Footer.tsx b/packages/web/components/templates/navMenu/Footer.tsx
index 50ebf3a7c..4a9fb1561 100644
--- a/packages/web/components/templates/navMenu/Footer.tsx
+++ b/packages/web/components/templates/navMenu/Footer.tsx
@@ -17,7 +17,7 @@ export const NavMenuFooter = (props: NavMenuFooterProps): JSX.Element => {
         position: 'fixed',
         bottom: '0%',
         alignItems: 'center',
-        backgroundColor: '$thNavMenuFooter',
+        bg: '$thNavMenuFooter',
         width: LIBRARY_LEFT_MENU_WIDTH,
         overflowY: 'auto',
         overflowX: 'hidden',