fix: btn color theme (#69)

mnsinri · Oct 27, 2024 · b5bb7d0 · b5bb7d0
1 parent 852ee14
commit b5bb7d0
Show file tree

Hide file tree

Showing 5 changed files with 6 additions and 4 deletions.
diff --git a/src/components/displayHistoryButton/styles.tsx b/src/components/displayHistoryButton/styles.tsx
@@ -10,12 +10,12 @@ export const Button = styled.button<{ state: boolean }>`
     state
       ? theme.displayHistoryButton.iconActive
       : theme.displayHistoryButton.icon};
-  ${({ state }) =>
+  ${({ state, theme }) =>
     state &&
     css`
       box-shadow:
-        inset 3px 3px 5px #bbbbbb,
-        inset -3px -3px 5px #ffffff;
+        inset 3px 3px 5px ${theme.displayHistoryButton.shadow[0]},
+        inset -3px -3px 5px ${theme.displayHistoryButton.shadow[1]};
     `}
 
   &:hover {

diff --git a/src/components/mainContainer/index.tsx b/src/components/mainContainer/index.tsx
@@ -73,7 +73,6 @@ export const MainContainer: FC = () => {
       const resize = () => {
         const style = window.getComputedStyle(ref);
         const width = getPixel(style, "width") - 40;
-        console.log("onResize", width);
         setGridProperties(
           calcGridProperties(width, cardWidth, { gapRange: [x, x * 4] }),
         );

diff --git a/src/configs/theme/dark.ts b/src/configs/theme/dark.ts
@@ -69,5 +69,6 @@ export const darkTheme: DefaultTheme = {
       normal: "transparent",
       hover: colors.grey[700],
     },
+    shadow: [colors.grey[900], colors.grey[800]],
   },
 };
diff --git a/src/configs/theme/light.ts b/src/configs/theme/light.ts
@@ -69,5 +69,6 @@ export const lightTheme: DefaultTheme = {
       normal: "transparent",
       hover: colors.grey[200],
     },
+    shadow: [colors.grey[400], colors.grey[100]],
   },
 };
diff --git a/types/theme.ts b/types/theme.ts
@@ -50,6 +50,7 @@ export type DropdownTheme = {
 
 export type DisplayHistoryButtonTheme = ButtonTheme & {
   iconActive: string;
+  shadow: [string, string];
 };
 
 declare module "styled-components" {