style: change antd theme config

valory-xyz · Jul 18, 2024 · a301e51 · a301e51
1 parent 401534e
commit a301e51
Showing 1 changed file with 57 additions and 24 deletions.
diff --git a/libs/ui-theme/src/lib/ThemeConfig.tsx b/libs/ui-theme/src/lib/ThemeConfig.tsx
@@ -5,37 +5,70 @@ import { COLOR } from './ui-theme';
 
 export const THEME_CONFIG: ThemeConfig = {
   token: {
-    colorPrimary: COLOR.PRIMARY,
-    colorBgBase: COLOR.WHITE,
-    colorLink: COLOR.PRIMARY,
-    colorTextPlaceholder: COLOR.GREY_2,
-    colorText: COLOR.TEXT_PRIMARY,
-    colorTextDescription: COLOR.TEXT_SECONDARY,
-    fontSize: 18,
-    borderRadius: 5,
-    controlHeight: 42,
+    wireframe: false,
+    colorPrimary: '#7e22ce',
+    colorInfo: '#7e22ce',
+    colorSuccessHover: '#73d13d',
+    colorWarning: '#fa8c16',
+    colorWarningHover: '#ffa940',
+    colorError: '#f5222d',
+    colorLink: '#7e22ce',
+    colorInfoHover: '#4096ff',
+    colorText: '#1f2229',
+    colorTextSecondary: '#4d596a',
+    colorTextTertiary: '#606f85',
+    colorTextQuaternary: '#a3aebb',
+    colorBorder: '#c2cbd7',
+    colorBorderSecondary: '#dfe5ee',
+    colorFill: '#0b1e4126',
+    colorFillSecondary: '#0b1e410f',
+    colorFillTertiary: '#0b1e410a',
+    colorFillQuaternary: '#f2f4f9',
+    colorBgLayout: '#f2f4f9',
+    colorBgSpotlight: '#132039d9',
+    colorBgMask: '#1b263233',
+    borderRadius: 8,
+    borderRadiusXS: 4,
+    borderRadiusLG: 12,
+    boxShadow:
+      '0px 1px 2px 0px rgba(0, 0, 0, 0.03), 0px 1px 6px -1px rgba(0, 0, 0, 0.02), 0px 2px 4px 0px rgba(0, 0, 0, 0.02)',
+    boxShadowSecondary:
+      '0px -4px 8px 2px rgba(24, 39, 75, 0.06), 0px 4px 8px 2px rgba(24, 39, 75, 0.12), 0px 1px 3px 0px rgba(24, 39, 75, 0.06)',
+    colorSuccessTextHover: '#237804',
+    colorSuccessText: '#135200',
+    colorSuccessTextActive: '#092b00',
+    colorWarningTextHover: '#ad4e00',
+    colorWarningText: '#873800',
+    colorWarningTextActive: '#612500',
+    colorErrorTextHover: '#cf1322',
+    colorErrorText: '#a8071a',
+    colorErrorTextActive: '#820014',
+    colorInfoTextHover: '#0958d9',
+    colorInfoText: '#003eb3',
+    colorInfoTextActive: '#002c8c',
+    colorTextBase: '#1f2229',
+    fontSize: 16,
   },
   components: {
-    Anchor: {
-      linkPaddingBlock: 8,
+    Table: {
+      headerFilterHoverBg: 'rgb(223, 229, 238)',
+      borderColor: 'rgb(223, 229, 238)',
+      bodySortBg: 'rgb(242, 244, 249)',
+      footerBg: 'rgb(242, 244, 249)',
+      headerColor: 'rgb(77, 89, 106)',
+      headerSortActiveBg: 'rgb(223, 229, 238)',
+      headerSortHoverBg: 'rgb(194, 203, 215)',
+      headerSplitColor: 'rgb(223, 229, 238)',
+      rowSelectedBg: 'rgb(250, 240, 255)',
+      rowSelectedHoverBg: 'rgb(239, 207, 255)',
+    },
+    Alert: {
+      borderRadiusLG: 8,
     },
     Layout: {
       headerBg: COLOR.WHITE,
       bodyBg: COLOR.WHITE,
     },
-    Tabs: {
-      motionDurationMid: '0.1s',
-      motionDurationSlow: '0.1s',
-    },
-    Table: {
-      padding: 12,
-      fontWeightStrong: 500,
-    },
-    Alert: {
-      colorInfoBg: COLOR.ANT_PRIMARY_BG,
-      colorInfoBorder: COLOR.ANT_PRIMARY_BORDER,
-      colorInfo: COLOR.PRIMARY /** info icon */,
-    },
   },
 };