From 56aade52225137ee9e8f6f86ca9b25fd0534f7a9 Mon Sep 17 00:00:00 2001
From: Sonny <sonnyasdev@gmail.com>
Date: Mon, 13 May 2024 00:16:53 +0200
Subject: [PATCH] fix: some styles

---
 inertia/components/dashboard/link/link_favicon.tsx    |  4 +++-
 .../components/dashboard/link_list/link_controls.tsx  |  2 +-
 inertia/components/dashboard/link_list/link_item.tsx  |  1 -
 inertia/components/dashboard/link_list/link_list.tsx  |  4 ++--
 inertia/pages/dashboard.tsx                           | 11 +++++------
 inertia/styles/theme.ts                               |  6 ++----
 6 files changed, 13 insertions(+), 15 deletions(-)

diff --git a/inertia/components/dashboard/link/link_favicon.tsx b/inertia/components/dashboard/link/link_favicon.tsx
index faa57af..805f26a 100644
--- a/inertia/components/dashboard/link/link_favicon.tsx
+++ b/inertia/components/dashboard/link/link_favicon.tsx
@@ -17,11 +17,13 @@ const Favicon = styled.div({
   alignItems: 'center',
   justifyContent: 'center',
 });
+
 const FaviconLoader = styled.div(({ theme }) => ({
   position: 'absolute',
   top: 0,
   left: 0,
-  backgroundColor: theme.colors.white,
+  color: theme.colors.font,
+  backgroundColor: theme.colors.secondary,
 
   '& > *': {
     animation: `${rotate} 1s both reverse infinite linear`,
diff --git a/inertia/components/dashboard/link_list/link_controls.tsx b/inertia/components/dashboard/link_list/link_controls.tsx
index 5d552b6..2be5887 100644
--- a/inertia/components/dashboard/link_list/link_controls.tsx
+++ b/inertia/components/dashboard/link_list/link_controls.tsx
@@ -69,7 +69,7 @@ export default function LinkControls({ link }: { link: Link }) {
   console.log(link.favorite, link.favorite ? 'oui' : 'non');
   return (
     <Dropdown
-      label={<BsThreeDotsVertical />}
+      label={<BsThreeDotsVertical css={{ color: theme.colors.grey }} />}
       css={{ backgroundColor: theme.colors.secondary }}
     >
       <StartItem onClick={onFavorite}>
diff --git a/inertia/components/dashboard/link_list/link_item.tsx b/inertia/components/dashboard/link_list/link_item.tsx
index 1d36c7c..6433537 100644
--- a/inertia/components/dashboard/link_list/link_item.tsx
+++ b/inertia/components/dashboard/link_list/link_item.tsx
@@ -13,7 +13,6 @@ const LinkWrapper = styled.li(({ theme }) => ({
   color: theme.colors.primary,
   backgroundColor: theme.colors.secondary,
   padding: '0.75em 1em',
-  border: `1px solid ${theme.colors.lightGrey}`,
   borderRadius: theme.border.radius,
 
   '&:hover': {
diff --git a/inertia/components/dashboard/link_list/link_list.tsx b/inertia/components/dashboard/link_list/link_list.tsx
index d8791a3..58ef0ab 100644
--- a/inertia/components/dashboard/link_list/link_list.tsx
+++ b/inertia/components/dashboard/link_list/link_list.tsx
@@ -20,8 +20,8 @@ const LinksWrapper = styled.div({
 
 const CollectionHeaderWrapper = styled.h2(({ theme }) => ({
   fontWeight: 400,
-  color: theme.colors.primary,
-  paddingInline: '1em',
+  color: theme.colors.font,
+  paddingInline: '0.8em 1.1em',
   display: 'flex',
   gap: '0.4em',
   alignItems: 'center',
diff --git a/inertia/pages/dashboard.tsx b/inertia/pages/dashboard.tsx
index 1ce3be8..abfb9b7 100644
--- a/inertia/pages/dashboard.tsx
+++ b/inertia/pages/dashboard.tsx
@@ -18,18 +18,17 @@ import GlobalHotkeysContext from '~/contexts/global_hotkeys_context';
 import { useMediaQuery } from '~/hooks/use_media_query';
 import useToggle from '~/hooks/use_modal';
 
-interface HomePageProps {
+interface DashboardPageProps {
   collections: Collection[];
   activeCollection: Collection;
 }
 
 const SideBar = styled.div(({ theme }) => ({
-  paddingRight: '0.75em',
   borderRight: `1px solid ${theme.colors.lightGrey}`,
   marginRight: '5px',
 }));
 
-export default function HomePage(props: Readonly<HomePageProps>) {
+export default function DashboardPage(props: Readonly<DashboardPageProps>) {
   const isMobile = useMediaQuery('(max-width: 768px)');
   const { isShowing, open, close } = useToggle();
   const handlers = useSwipeable({
@@ -45,7 +44,7 @@ export default function HomePage(props: Readonly<HomePageProps>) {
 
   return (
     <DashboardLayout>
-      <HomeProviders
+      <DashboardProviders
         collections={props.collections}
         activeCollection={props.activeCollection}
       >
@@ -57,11 +56,11 @@ export default function HomePage(props: Readonly<HomePageProps>) {
           )}
           <Links isMobile={isMobile} openSideMenu={open} />
         </SwiperHandler>
-      </HomeProviders>
+      </DashboardProviders>
     </DashboardLayout>
   );
 }
-function HomeProviders(
+function DashboardProviders(
   props: Readonly<{
     children: ReactNode;
     collections: Collection[];
diff --git a/inertia/styles/theme.ts b/inertia/styles/theme.ts
index 01d647d..b354e33 100644
--- a/inertia/styles/theme.ts
+++ b/inertia/styles/theme.ts
@@ -8,8 +8,6 @@ const darkBlue = primaryDarkColor;
 
 const lightRed = '#FF5A5A';
 
-const yellow = '#ffc107';
-
 const border: Theme['border'] = {
   radius: '3px',
 };
@@ -45,7 +43,7 @@ export const lightTheme: Theme = {
 
     lightRed,
 
-    yellow,
+    yellow: '#FF8A08',
 
     boxShadow: '0 0 1em 0 rgba(102, 102, 102, 0.25)',
   },
@@ -73,7 +71,7 @@ export const darkTheme: Theme = {
 
     lightRed,
 
-    yellow,
+    yellow: '#ffc107',
 
     boxShadow: '0 0 1em 0 rgb(40 40 40)',
   },