update theme

src/constants/theme.ts

@@ -10,10 +10,21 @@ export const darkTheme: DefaultTheme = {
   BLACK_SECONDARY: "#23272A",
   CRIMSON: "#DC143C",
   DARK_SALMON: "#E9967A",
-  DANGER: "#F26522",
+  DANGER: "#db662e",
   LIGHTGREEN: "#90EE90",
   SEAGREEN: "#3BA55D",
   ORANGE: "#FAA81A",
   SILVER: "#B9BBBE",
-  SILVER_DARK: "#4D4D4D"
+  SILVER_DARK: "#4D4D4D",
+
+  INTERACTIVE_NORMAL: "#b9bbbe",
+  INTERACTIVE_HOVER: "#dcddde",
+  INTERACTIVE_ACTIVE: "#fff",
+  BACKGROUND_TERTIARY: "#202225",
+  BACKGROUND_SECONDARY: "#2f3136",
+  BACKGROUND_PRIMARY: "#36393f",
+  BACKGROUND_MODIFIER_ACCENT: "rgba(79,84,92,0.48)",
+  TEXT_NORMAL: "#dcddde",
+  TEXT_POSITIVE: "hsl(139,calc(var(--saturation-factor, 1)*51.6%),52.2%)",
+  TEXT_DANGER: "hsl(359,calc(var(--saturation-factor, 1)*82%),73.9%)"
 } as const;

src/typings/styled.d.ts

@@ -24,5 +24,16 @@ declare module "styled-components" {
     ORANGE: string;
     SILVER: string;
     SILVER_DARK: string;
+
+    INTERACTIVE_NORMAL: string;
+    INTERACTIVE_HOVER: string;
+    INTERACTIVE_ACTIVE: string;
+    BACKGROUND_TERTIARY: string;
+    BACKGROUND_SECONDARY: string;
+    BACKGROUND_PRIMARY: string;
+    BACKGROUND_MODIFIER_ACCENT: string;
+    TEXT_NORMAL: string;
+    TEXT_POSITIVE: string;
+    TEXT_DANGER: string;
   }
 }