sideBar Dark Color changes

actualbudget · Nov 9, 2023 · 955ad65 · 955ad65
1 parent a15f80e
commit 955ad65
Show file tree

Hide file tree

Showing 5 changed files with 7 additions and 17 deletions.
diff --git a/packages/desktop-client/src/components/Page.tsx b/packages/desktop-client/src/components/Page.tsx
@@ -20,7 +20,7 @@ function PageTitle({
       <View
         style={{
           alignItems: 'center',
-          backgroundColor: theme.sidebarItemBackground,
+          backgroundColor: theme.mobilePageBackground,
           color: theme.mobileModalText,
           flexDirection: 'row',
           flex: '1 0 auto',

diff --git a/packages/desktop-client/src/components/select/DateSelect.tsx b/packages/desktop-client/src/components/select/DateSelect.tsx
@@ -35,8 +35,8 @@ import DateSelectRight from './DateSelect.right.png';
 
 let pickerStyles = {
   '& .pika-single.actual-date-picker': {
-    color: theme.sidebarItemTextHover,
-    background: theme.sidebarBackground,
+    color: theme.menuAutoCompleteText,
+    background: theme.menuAutoCompleteBackground,
     border: 'none',
     boxShadow: '0 0px 4px rgba(0, 0, 0, .25)',
     borderRadius: 4,

diff --git a/packages/desktop-client/src/components/sidebar/Account.tsx b/packages/desktop-client/src/components/sidebar/Account.tsx
@@ -103,7 +103,7 @@ function Account({
               // ignores it if it's active
               fontWeight: (style && style.fontWeight) || 'normal',
               '& .dot': {
-                backgroundColor: theme.sidebarItemBackgroundSelected,
+                backgroundColor: theme.sidebarItemAccentSelected,
                 transform: 'translateX(-4.5px)',
               },
             }}

diff --git a/packages/desktop-client/src/style/themes/dark.ts b/packages/desktop-client/src/style/themes/dark.ts
@@ -44,18 +44,13 @@ export const tableRowBackgroundHighlightText = colorPalette.navy150;
 export const tableRowHeaderBackground = colorPalette.navy700;
 export const tableRowHeaderText = colorPalette.navy150;
 
-export const sidebarBackground = colorPalette.navy800;
-export const sidebarItemBackground = colorPalette.navy800;
+export const sidebarBackground = colorPalette.gray800;
 export const sidebarItemBackgroundPositive = colorPalette.green500;
 export const sidebarItemBackgroundFailed = colorPalette.red300;
-export const sidebarItemBackgroundSelected = colorPalette.navy800;
+export const sidebarItemAccnetSelected = colorPalette.purple200;
 export const sidebarItemBackgroundHover = colorPalette.navy700;
-export const sidebarItemAccent = colorPalette.navy800;
-export const sidebarItemAccentSelected = colorPalette.purple400;
-export const sidebarItemAccentHover = colorPalette.navy700;
 export const sidebarItemText = colorPalette.navy150;
-export const sidebarItemTextSelected = colorPalette.purple400;
-export const sidebarItemTextHover = colorPalette.navy150;
+export const sidebarItemTextSelected = colorPalette.purple200;
 
 export const menuBackground = colorPalette.navy600;
 export const menuItemBackground = colorPalette.navy600;

diff --git a/packages/desktop-client/src/style/themes/light.ts b/packages/desktop-client/src/style/themes/light.ts
@@ -44,17 +44,12 @@ export const tableRowBackgroundHighlightText = colorPalette.navy700;
 export const tableRowHeaderBackground = colorPalette.navy50;
 export const tableRowHeaderText = colorPalette.navy800;
 export const sidebarBackground = colorPalette.navy900;
-export const sidebarItemBackground = colorPalette.blue800;
 export const sidebarItemBackgroundPositive = colorPalette.green500;
 export const sidebarItemBackgroundFailed = colorPalette.red300;
-export const sidebarItemBackgroundSelected = colorPalette.purple200;
 export const sidebarItemBackgroundHover = colorPalette.navy800;
-export const sidebarItemAccent = colorPalette.blue800;
 export const sidebarItemAccentSelected = colorPalette.purple200;
-export const sidebarItemAccentHover = colorPalette.blue700;
 export const sidebarItemText = colorPalette.navy150;
 export const sidebarItemTextSelected = colorPalette.purple200;
-export const sidebarItemTextHover = colorPalette.navy50;
 
 export const menuBackground = colorPalette.white;
 export const menuItemBackground = colorPalette.navy50;