clean a tiny bit

mongodb-forks · Jul 3, 2024 · 0038f1b · 0038f1b
1 parent 38c8d9a
commit 0038f1b
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 13 deletions.
diff --git a/src/components/SearchBox/styled.elements.tsx b/src/components/SearchBox/styled.elements.tsx
@@ -21,7 +21,7 @@ export const SearchInput = styled.input.attrs(() => ({
   font-family: ${({ theme }) => theme.typography.fontFamily};
   font-weight: bold;
   font-size: 13px;
-  color: ${props => props.theme.sidebar.textColor};
+  color: var(--sidebar-text-color);
   background-color: transparent;
   outline: none;
 `;
@@ -52,14 +52,14 @@ export const SearchIcon = styled((props: { className?: string }) => (
   width: 0.9em;
 
   path {
-    fill: ${props => props.theme.sidebar.textColor};
+    fill: var(--sidebar-text-color);
   }
 `;
 
 export const SearchResultsBox = styled.div`
   padding: ${props => props.theme.spacing.unit}px 0;
   background-color: var(--sidebar-bg-color);
-  color: ${props => props.theme.sidebar.textColor};
+  color: var(--sidebar-text-color);
   min-height: 150px;
   max-height: 250px;
   margin-top: 10px;

diff --git a/src/components/SideMenu/styled.elements.ts b/src/components/SideMenu/styled.elements.ts
@@ -166,13 +166,11 @@ export const RedocAttribution = styled.div`
     position: sticky;
     width: ${theme.sidebar.width};
     bottom: 0;
-    // background: ${theme.sidebar.backgroundColor};
     background: var(--sidebar-bg-color);
 
     a,
     a:visited,
     a:hover {
-      // /* color: ${theme.sidebar.textColor} !important; */
       color: var(--sidebar-text-color) !important;
       padding: ${theme.spacing.unit}px 0;
       text-decoration: none;

diff --git a/src/components/StickySidebar/StickyResponsiveSidebar.tsx b/src/components/StickySidebar/StickyResponsiveSidebar.tsx
@@ -27,7 +27,7 @@ const stickyfill = Stickyfill && Stickyfill();
 
 const StyledStickySidebar = styled.div<{ open?: boolean }>`
   width: ${props => props.theme.sidebar.width};
-  background-color: ${props => props.theme.sidebar.backgroundColor};
+  background-color: var(--sidebar-bg-color);
   overflow: hidden;
   display: flex;
   flex-direction: column;
@@ -44,7 +44,7 @@ const StyledStickySidebar = styled.div<{ open?: boolean }>`
     position: fixed;
     z-index: 20;
     width: 100%;
-    background: ${({ theme }) => theme.sidebar.backgroundColor};
+    background: var(--sidebar-bg-color);
     display: ${props => (props.open ? 'flex' : 'none')};
   `};
 

diff --git a/src/theme.ts b/src/theme.ts
@@ -1,4 +1,4 @@
-import { cssVar, darken, lighten, readableColor, transparentize } from 'polished';
+import { darken, lighten, readableColor, transparentize } from 'polished';
 import { palette } from '@leafygreen-ui/palette';
 
 const textFontFamily =
@@ -47,9 +47,8 @@ const defaultTheme: ThemeInterface = {
       100: '#F5F5F5',
     },
     text: {
-      primary: cssVar('--text-primary-color', '#1C2D38') as string,
-      // secondary: ({ colors }) => lighten(colors.tonalOffset, colors.text.primary),
-      secondary: lighten(0.2, cssVar('--text-primary-color', '#1C2D38') as string),
+      primary: palette.gray.dark3,
+      secondary: ({ colors }) => lighten(colors.tonalOffset, colors.text.primary),
     },
     border: {
       dark: 'rgba(0,0,0, 0.1)',
@@ -191,8 +190,6 @@ const defaultTheme: ThemeInterface = {
   },
   sidebar: {
     width: '268px',
-    backgroundColor: cssVar('--sidebar-bg-color', '#F9FBFA') as string,
-    textColor: cssVar('--sidebar-text-color', '#112733') as string,
     // backgroundColor: palette.gray.light3,
     // textColor: palette.black,
     activeTextColor: palette.green.dark3,
@@ -209,6 +206,7 @@ const defaultTheme: ThemeInterface = {
     arrow: {
       size: '1.5em',
       // color: theme => theme.sidebar.textColor,
+
       color: 'var(--sidebar-text-color)',
     },
   },