feat: add script to copy generated themes to storybook theme folder (#…

…769) * feat: add script to copy generated themes to storybook theme folder * feat: regen themes * feat: run generate theme script * feat: update script to also regenerate colorTheme for storybook * lint: remove unused imports * fix: imports are necessary after all
opengovsg · Oct 8, 2024 · 46fa4ef · 46fa4ef
1 parent 15e9121
commit 46fa4ef
Show file tree

Hide file tree

Showing 358 changed files with 6,717 additions and 992 deletions.
diff --git a/react/.storybook/colorThemes/Armoury/colors.ts b/react/.storybook/colorThemes/Armoury/colors.ts
@@ -0,0 +1,282 @@
+/**
+ * Do not edit directly
+ * Generated on Tue, 08 Oct 2024 07:57:33 GMT
+ */
+
+export const colors = {
+  base: {
+    canvas: {
+      default: '#ffffff',
+      alt: '#f8f9f9',
+      backdrop: '#ededed',
+      'brand-subtle': '#f7fafe',
+      inverse: '#3a3e46',
+      overlay: 'rgba(58, 62, 70, 0.8)',
+    },
+    content: {
+      default: '#454953',
+      strong: '#2c2e34',
+      medium: '#666c7a',
+      brand: '#0071eb',
+      inverse: '#ffffff',
+    },
+    divider: {
+      subtle: '#f8f9f9',
+      medium: '#ededed',
+      strong: '#bfc2c8',
+      inverse: '#ffffff',
+      brand: '#0071eb',
+    },
+  },
+  interaction: {
+    support: {
+      disabled: '#ededed',
+      'disabled-content': '#a0a4ad',
+      placeholder: '#838894',
+      unselected: '#a0a4ad',
+      selected: '#666c7a',
+      'unselected-strong': '#666c7a',
+    },
+    links: {
+      default: '#0071eb',
+      hover: '#0651e2',
+      'neutral-default': '#454953',
+      'neutral-hover': '#2c2e34',
+      'inverse-default': '#ffffff',
+      'inverse-hover': '#ededed',
+    },
+    main: {
+      default: '#0071eb',
+      hover: '#0651e2',
+      active: '#0040dd',
+    },
+    'main-subtle': {
+      default: '#e7f2fc',
+      hover: '#bbd6ff',
+      active: '#409cff',
+    },
+    sub: {
+      default: '#5d6785',
+      hover: '#465173',
+      active: '#3c4764',
+    },
+    'sub-subtle': {
+      default: '#e9eaee',
+      hover: '#babecb',
+      active: '#9aa0b3',
+    },
+    critical: {
+      default: '#c03434',
+      hover: '#992a2a',
+      active: '#852424',
+    },
+    'critical-subtle': {
+      default: '#fbe9e9',
+      hover: '#f4acac',
+      active: '#ee8080',
+    },
+    warning: {
+      default: '#ffda68',
+      hover: '#ffc409',
+      active: '#ffad0d',
+    },
+    'warning-subtle': {
+      default: '#fffae1',
+      hover: '#ffda68',
+      active: '#ffc409',
+    },
+    success: {
+      default: '#00774e',
+      hover: '#005f3e',
+      active: '#005336',
+    },
+    'success-subtle': {
+      default: '#d6f0e7',
+      hover: '#7ccfb3',
+      active: '#33b488',
+    },
+    neutral: {
+      default: '#666c7a',
+      hover: '#505660',
+      active: '#454953',
+    },
+    'neutral-subtle': {
+      default: '#f8f9f9',
+      hover: '#ededed',
+      active: '#bfc2c8',
+    },
+    muted: {
+      main: {
+        hover: '#f7fafe',
+        active: '#e7f2fc',
+      },
+      sub: {
+        hover: '#f8f9fa',
+        active: '#e9eaee',
+      },
+      neutral: {
+        hover: '#f8f9f9',
+        active: '#ededed',
+      },
+      critical: {
+        hover: '#fff0f0',
+        active: '#fbe4e4',
+      },
+    },
+    tinted: {
+      main: {
+        hover: 'rgba(0, 113, 235, 0.04)',
+        active: 'rgba(231, 242, 252, 0.12)',
+      },
+      critical: {
+        hover: 'rgba(192, 52, 52, 0.04)',
+        active: 'rgba(192, 52, 52, 0.12)',
+      },
+      neutral: {
+        hover: 'rgba(0, 0, 0, 0.1)',
+        active: 'rgba(0, 0, 0, 0.2)',
+      },
+      inverse: {
+        hover: 'rgba(255, 255, 255, 0.1)',
+        active: 'rgba(255, 255, 255, 0.2)',
+      },
+      sub: {
+        hover: 'rgba(93, 103, 133, 0.04)',
+        active: 'rgba(93, 103, 133, 0.12)',
+      },
+    },
+  },
+  utility: {
+    'focus-default': '#0071eb',
+    'focus-inverse': '#ffffff',
+    'input-prefilled': '#fffae1',
+    ui: '#ffffff',
+    'ui-clear': 'rgba(255, 255, 255, 0)',
+    feedback: {
+      info: '#0071eb',
+      'info-subtle': '#f7fafe',
+      warning: '#ffda68',
+      'warning-subtle': '#fffae1',
+      success: '#00774e',
+      'success-subtle': '#e6f7f1',
+      critical: '#c03434',
+      'critical-subtle': '#fff0f0',
+    },
+  },
+  standard: {
+    white: '#ffffff',
+    black: '#000000',
+  },
+  brand: {
+    primary: {
+      '50': '#f7fafe',
+      '100': '#e7f2fc',
+      '200': '#bbd6ff',
+      '300': '#409cff',
+      '400': '#0a84ff',
+      '500': '#0071eb',
+      '600': '#0651e2',
+      '700': '#0040dd',
+      '800': '#093890',
+      '900': '#072a69',
+    },
+    secondary: {
+      '50': '#f8f9fa',
+      '100': '#e9eaee',
+      '200': '#babecb',
+      '300': '#9aa0b3',
+      '400': '#7b849c',
+      '500': '#5d6785',
+      '600': '#465173',
+      '700': '#3c4764',
+      '800': '#333c56',
+      '900': '#272d41',
+    },
+  },
+  blue: {
+    '50': '#f7fafe',
+    '100': '#e7f2fc',
+    '200': '#bbd6ff',
+    '300': '#409cff',
+    '400': '#0a84ff',
+    '500': '#0071eb',
+    '600': '#0651e2',
+    '700': '#0040dd',
+    '800': '#00359c',
+    '900': '#072a69',
+  },
+  red: {
+    '50': '#fff0f0',
+    '100': '#fbe4e4',
+    '200': '#f4acac',
+    '300': '#ee8080',
+    '400': '#e74f4f',
+    '500': '#c03434',
+    '600': '#992a2a',
+    '700': '#852424',
+    '800': '#721f1f',
+    '900': '#571717',
+  },
+  green: {
+    '50': '#e6f7f1',
+    '100': '#d6f0e7',
+    '200': '#7ccfb3',
+    '300': '#33b488',
+    '400': '#009762',
+    '500': '#00774e',
+    '600': '#005f3e',
+    '700': '#005336',
+    '800': '#00462e',
+    '900': '#003523',
+  },
+  yellow: {
+    '50': '#fffae1',
+    '100': '#ffda68',
+    '200': '#ffc409',
+    '300': '#ffad0d',
+    '400': '#e39807',
+    '500': '#8b6005',
+    '600': '#704c00',
+    '700': '#624200',
+    '800': '#533800',
+    '900': '#3f2b00',
+  },
+  slate: {
+    '50': '#f8f9fa',
+    '100': '#e9eaee',
+    '200': '#babecb',
+    '300': '#9aa0b3',
+    '400': '#7b849c',
+    '500': '#5d6785',
+    '600': '#465173',
+    '700': '#3c4764',
+    '800': '#333c56',
+    '900': '#272d41',
+  },
+  grey: {
+    '50': '#f8f9f9',
+    '100': '#ededed',
+    '200': '#bfc2c8',
+    '300': '#a0a4ad',
+    '400': '#838894',
+    '500': '#666c7a',
+    '600': '#505660',
+    '700': '#454953',
+    '800': '#3a3e46',
+    '900': '#2c2e34',
+  },
+  skin: {
+    '1base': '#ffcaa4',
+    '1shadow': '#f5b896',
+    '2base': '#eba687',
+    '2shadow': '#e29b7b',
+    '3base': '#d98f6f',
+    '3shadow': '#ce8361',
+    '4base': '#bf7657',
+    '4shadow': '#af6d53',
+    '5base': '#9f634f',
+    '5shadow': '#8b5544',
+    '6base': '#764738',
+    '6shadow': '#633d32',
+  },
+}
diff --git a/react/.storybook/colorThemes/Armoury/shadows.ts b/react/.storybook/colorThemes/Armoury/shadows.ts
@@ -0,0 +1,9 @@
+/**
+ * Do not edit directly
+ * Generated on Tue, 08 Oct 2024 07:57:33 GMT
+ */
+
+export const shadows = {
+  sm: '0px 0px 10px 0px rgba(191, 191, 191, 0.5)',
+  md: '0px 0px 20px 0px rgba(104, 104, 104, 0.3)',
+}
diff --git a/react/.storybook/colorThemes/Armoury/spacing.ts b/react/.storybook/colorThemes/Armoury/spacing.ts
@@ -0,0 +1,21 @@
+/**
+ * Do not edit directly
+ * Generated on Tue, 08 Oct 2024 07:57:33 GMT
+ */
+
+export const spacing = {
+  '1': '0.25rem',
+  '2': '0.5rem',
+  '3': '0.75rem',
+  '4': '1rem',
+  '5': '1.25rem',
+  '6': '1.5rem',
+  '7': '1.75rem',
+  '8': '2rem',
+  '9': '2.25rem',
+  '10': '2.5rem',
+  '11': '2.75rem',
+  '12': '3rem',
+  '13': '3.5rem',
+  '14': '4rem',
+}