diff --git a/src/frontend/apps/impress/cunningham.ts b/src/frontend/apps/impress/cunningham.ts index c9a17ce0..f9b26046 100644 --- a/src/frontend/apps/impress/cunningham.ts +++ b/src/frontend/apps/impress/cunningham.ts @@ -1,58 +1,54 @@ -import { defaultTokens } from '@gouvfr-lasuite/cunningham-react'; -import { cunninghamConfig as tokens } from '@gouvfr-lasuite/ui-kit'; -import merge from 'lodash/merge'; +import { + dsfrGlobals, + getUIKitThemesFromGlobals, + whiteLabelGlobals, +} from '@gouvfr-lasuite/ui-kit'; -// Uikit does not provide the full list of tokens. -// To be able to override correctly, we need to merge with the default tokens. -let mergedColors = merge( - defaultTokens.globals.colors, - tokens.themes.default.globals.colors, -); - -mergedColors = { - ...mergedColors, - 'logo-1': '#2845C1', -}; - -tokens.themes.default.globals = { - ...tokens.themes.default.globals, - ...{ - colors: mergedColors, - font: { - ...tokens.themes.default.globals.font, - families: { - base: 'sans-serif', - accent: 'sans-serif', +const themeWhiteLabelLight = getUIKitThemesFromGlobals(whiteLabelGlobals, { + prefix: 'default', + variants: ['light'], + overrides: { + globals: { + spacing: { + '0': '0rem', + none: '0rem', + auto: 'auto', + bx: '2.2rem', + full: '100%', + '3xs': '0.25rem', + '2xs': '0.375rem', + }, + }, + components: { + logo: { + src: '', + alt: '', + widthHeader: '', + widthFooter: '', + }, + 'la-gaufre': false, + 'home-proconnect': false, + icon: { + src: '/assets/icon-docs.svg', + width: '32px', + height: 'auto', + }, + favicon: { + 'png-light': '/assets/favicon-light.png', + 'png-dark': '/assets/favicon-dark.png', }, }, }, +}); + +const themeDefault = { + default: themeWhiteLabelLight['default-light'], }; -tokens.themes.default.components = { - ...tokens.themes.default.components, - ...{ - logo: { - src: '', - alt: '', - widthHeader: '', - widthFooter: '', - }, - 'la-gaufre': false, - 'home-proconnect': false, - icon: { - src: '/assets/icon-docs.svg', - width: '32px', - height: 'auto', - }, - favicon: { - 'png-light': '/assets/favicon-light.png', - 'png-dark': '/assets/favicon-dark.png', - }, - }, -}; - -const dsfrTheme = { - dsfr: { +const themesDSFRLight = getUIKitThemesFromGlobals(dsfrGlobals, { + prefix: 'dsfr', + variants: ['light'], + overrides: { globals: { font: { families: { @@ -82,317 +78,16 @@ const dsfrTheme = { }, }, }, -}; +}); -const genericTheme = { - generic: { - globals: { - colors: { - 'brand-050': '#EEF1FA', - 'brand-100': '#DDE2F5', - 'brand-150': '#CED3F1', - 'brand-200': '#BEC5F0', - 'brand-250': '#AFB5F1', - 'brand-300': '#A0A5F6', - 'brand-350': '#8F94FD', - 'brand-400': '#8184FC', - 'brand-450': '#7576EE', - 'brand-500': '#6969DF', - 'brand-550': '#5E5CD0', - 'brand-600': '#534FC2', - 'brand-650': '#4844AD', - 'brand-700': '#3E3B98', - 'brand-750': '#36347D', - 'brand-800': '#2D2F5F', - 'brand-850': '#262848', - 'brand-900': '#1C1E32', - 'brand-950': '#11131F', - 'gray-000': '#FFFFFF', - 'gray-025': '#F8F8F9', - 'gray-050': '#F0F0F3', - 'gray-100': '#E2E2EA', - 'gray-150': '#D3D4E0', - 'gray-200': '#C5C6D5', - 'gray-250': '#B7B7CB', - 'gray-300': '#A9A9BF', - 'gray-350': '#9C9CB2', - 'gray-400': '#8F8FA4', - 'gray-450': '#828297', - 'gray-500': '#75758A', - 'gray-550': '#69697D', - 'gray-600': '#5D5D70', - 'gray-650': '#515164', - 'gray-700': '#454558', - 'gray-750': '#3A3A4C', - 'gray-800': '#2F303D', - 'gray-850': '#25252F', - 'gray-900': '#1B1B23', - 'gray-950': '#111114', - 'gray-1000': '#000000', - 'info-050': '#EAF2F9', - 'info-100': '#D5E4F3', - 'info-150': '#BFD7F0', - 'info-200': '#A7CAEE', - 'info-250': '#8DBDEF', - 'info-300': '#6EB0F2', - 'info-350': '#50A2F5', - 'info-400': '#3593F4', - 'info-450': '#1185ED', - 'info-500': '#0077DE', - 'info-550': '#0069CF', - 'info-600': '#005BC0', - 'info-650': '#0D4EAA', - 'info-700': '#124394', - 'info-750': '#163878', - 'info-800': '#192F5A', - 'info-850': '#192541', - 'info-900': '#141B2D', - 'info-950': '#0C111C', - 'success-050': '#E8F1EA', - 'success-100': '#CFE4D4', - 'success-150': '#BAD9C1', - 'success-200': '#A2CFAD', - 'success-250': '#86C597', - 'success-300': '#6CBA83', - 'success-350': '#4FB070', - 'success-400': '#40A363', - 'success-450': '#309556', - 'success-500': '#1E884A', - 'success-550': '#027B3E', - 'success-600': '#016D31', - 'success-650': '#006024', - 'success-700': '#005317', - 'success-750': '#0D4511', - 'success-800': '#11380E', - 'success-850': '#132A11', - 'success-900': '#101E0F', - 'success-950': '#091209', - 'warning-050': '#F8F0E9', - 'warning-100': '#F1E0D3', - 'warning-150': '#ECD0BC', - 'warning-200': '#E8C0A4', - 'warning-250': '#E8AE8A', - 'warning-300': '#EB9970', - 'warning-350': '#E98456', - 'warning-400': '#E57036', - 'warning-450': '#DA5E18', - 'warning-500': '#CB5000', - 'warning-550': '#BC4200', - 'warning-600': '#AD3300', - 'warning-650': '#9E2300', - 'warning-700': '#882011', - 'warning-750': '#731E16', - 'warning-800': '#58201A', - 'warning-850': '#401D18', - 'warning-900': '#2E1714', - 'warning-950': '#1D0F0D', - 'error-050': '#F9EFEC', - 'error-100': '#F4DFD9', - 'error-150': '#F0CEC6', - 'error-200': '#EEBCB2', - 'error-250': '#EEA99D', - 'error-300': '#EF9486', - 'error-350': '#F37C6E', - 'error-400': '#F65F53', - 'error-450': '#F0463D', - 'error-500': '#E82322', - 'error-550': '#D7010E', - 'error-600': '#C00100', - 'error-650': '#AA0000', - 'error-700': '#910C06', - 'error-750': '#731E16', - 'error-800': '#58201A', - 'error-850': '#401D18', - 'error-900': '#2E1714', - 'error-950': '#1D0F0D', - 'red-050': '#FAEFEE', - 'red-100': '#F4DEDD', - 'red-150': '#F1CDCB', - 'red-200': '#EFBBBA', - 'red-250': '#EEA8A8', - 'red-300': '#F09394', - 'red-350': '#F37B7E', - 'red-400': '#EF6569', - 'red-450': '#E94A55', - 'red-500': '#DA3B49', - 'red-550': '#CA2A3C', - 'red-600': '#BB1330', - 'red-650': '#A90021', - 'red-700': '#910A13', - 'red-750': '#731E16', - 'red-800': '#58201A', - 'red-850': '#411D18', - 'red-900': '#2E1714', - 'red-950': '#1D0F0D', - 'orange-050': '#F8F0E9', - 'orange-100': '#F1E0D3', - 'orange-150': '#ECD0BD', - 'orange-200': '#EABFA6', - 'orange-250': '#EBAC90', - 'orange-300': '#EC9772', - 'orange-350': '#E5845A', - 'orange-400': '#D6774D', - 'orange-450': '#C86A40', - 'orange-500': '#B95D33', - 'orange-550': '#AB5025', - 'orange-600': '#9D4315', - 'orange-650': '#8F3600', - 'orange-700': '#812900', - 'orange-750': '#6C2511', - 'orange-800': '#572017', - 'orange-850': '#401D18', - 'orange-900': '#2E1714', - 'orange-950': '#1D0F0D', - 'brown-050': '#F6F0E8', - 'brown-100': '#F1E0D3', - 'brown-150': '#EBD0BA', - 'brown-200': '#E2C0A6', - 'brown-250': '#D4B398', - 'brown-300': '#C6A58B', - 'brown-350': '#B8987E', - 'brown-400': '#AA8B71', - 'brown-450': '#9D7E65', - 'brown-500': '#8F7158', - 'brown-550': '#82654C', - 'brown-600': '#765841', - 'brown-650': '#694C35', - 'brown-700': '#5D412A', - 'brown-750': '#51361E', - 'brown-800': '#452A13', - 'brown-850': '#392008', - 'brown-900': '#29180A', - 'brown-950': '#1B0F08', - 'yellow-050': '#F3F0E7', - 'yellow-100': '#E9E2CF', - 'yellow-150': '#E1D4B7', - 'yellow-200': '#D9C599', - 'yellow-250': '#D2B677', - 'yellow-300': '#CAA756', - 'yellow-350': '#C2972E', - 'yellow-400': '#B98900', - 'yellow-450': '#AB7B00', - 'yellow-500': '#9D6E00', - 'yellow-550': '#916100', - 'yellow-600': '#855400', - 'yellow-650': '#784700', - 'yellow-700': '#6C3A00', - 'yellow-750': '#5F2E00', - 'yellow-800': '#512302', - 'yellow-850': '#3E1D10', - 'yellow-900': '#2D1711', - 'yellow-950': '#1D0F0D', - 'green-050': '#E6F1E9', - 'green-100': '#CFE4D5', - 'green-150': '#B8D8C1', - 'green-200': '#A0CFAE', - 'green-250': '#84C59A', - 'green-300': '#65BA86', - 'green-350': '#45B173', - 'green-400': '#23A562', - 'green-450': '#029755', - 'green-500': '#008948', - 'green-550': '#017B3B', - 'green-600': '#006E2E', - 'green-650': '#006022', - 'green-700': '#005314', - 'green-750': '#0D4510', - 'green-800': '#11380E', - 'green-850': '#132A11', - 'green-900': '#101E0F', - 'green-950': '#091209', - 'blue1-050': '#EBF1F9', - 'blue1-100': '#D6E4F4', - 'blue1-150': '#C1D7F0', - 'blue1-200': '#AACAEF', - 'blue1-250': '#8FBCEF', - 'blue1-300': '#7CAFEB', - 'blue1-350': '#68A1E4', - 'blue1-400': '#5B94D6', - 'blue1-450': '#4E86C7', - 'blue1-500': '#4279B9', - 'blue1-550': '#356CAC', - 'blue1-600': '#28609E', - 'blue1-650': '#1B5390', - 'blue1-700': '#0B4783', - 'blue1-750': '#0F3C6E', - 'blue1-800': '#133059', - 'blue1-850': '#152641', - 'blue1-900': '#121C2D', - 'blue1-950': '#0B111C', - 'blue2-050': '#E7F3F4', - 'blue2-100': '#CEE7E9', - 'blue2-150': '#B2DCE0', - 'blue2-200': '#91D1D7', - 'blue2-250': '#68C7D0', - 'blue2-300': '#43BBC5', - 'blue2-350': '#00AFBA', - 'blue2-400': '#01A0AA', - 'blue2-450': '#00929D', - 'blue2-500': '#00848F', - 'blue2-550': '#007682', - 'blue2-600': '#016874', - 'blue2-650': '#005B67', - 'blue2-700': '#004E5A', - 'blue2-750': '#00424E', - 'blue2-800': '#003642', - 'blue2-850': '#002A38', - 'blue2-900': '#061E28', - 'blue2-950': '#071219', - 'purple-050': '#F7F0F6', - 'purple-100': '#EEE0EE', - 'purple-150': '#E7D1E7', - 'purple-200': '#DBBFE4', - 'purple-250': '#D3AEE2', - 'purple-300': '#CB99E1', - 'purple-350': '#C188D9', - 'purple-400': '#B47BCB', - 'purple-450': '#A66EBD', - 'purple-500': '#9961AF', - 'purple-550': '#8B55A1', - 'purple-600': '#7E4894', - 'purple-650': '#723C87', - 'purple-700': '#633376', - 'purple-750': '#552A65', - 'purple-800': '#452551', - 'purple-850': '#35213D', - 'purple-900': '#261A2C', - 'purple-950': '#17111C', - 'pink-050': '#F8EFF4', - 'pink-100': '#F0DFEA', - 'pink-150': '#EACEDF', - 'pink-200': '#E9BBD1', - 'pink-250': '#E9A7C2', - 'pink-300': '#E095B4', - 'pink-350': '#D685A8', - 'pink-400': '#C7799B', - 'pink-450': '#B86C8D', - 'pink-500': '#AA5F80', - 'pink-550': '#9C5374', - 'pink-600': '#8E4767', - 'pink-650': '#813B5B', - 'pink-700': '#732E4F', - 'pink-750': '#632643', - 'pink-800': '#521F38', - 'pink-850': '#3E1C2B', - 'pink-900': '#2D171F', - 'pink-950': '#1C0E12', - }, - font: { - families: { - base: 'Inter, Roboto Flex Variable, sans-serif', - accent: 'Inter, Roboto Flex Variable, sans-serif', - }, - }, - }, - }, +const themesDSFR = { + dsfr: themesDSFRLight['dsfr-light'], }; const docsTokens = { - ...tokens, themes: { - ...tokens.themes, - ...dsfrTheme, - ...genericTheme, + ...themeDefault, + ...themesDSFR, }, }; diff --git a/src/frontend/apps/impress/src/cunningham/__tests__/useCunninghamTheme.spec.tsx b/src/frontend/apps/impress/src/cunningham/__tests__/useCunninghamTheme.spec.tsx index 709f6d73..20c99e23 100644 --- a/src/frontend/apps/impress/src/cunningham/__tests__/useCunninghamTheme.spec.tsx +++ b/src/frontend/apps/impress/src/cunningham/__tests__/useCunninghamTheme.spec.tsx @@ -5,7 +5,7 @@ describe('', () => { expect(useCunninghamTheme.getState().componentTokens.logo?.src).toBe(''); // Change theme - useCunninghamTheme.getState().setTheme('dsfr'); + useCunninghamTheme.getState().setTheme('dsfr-light'); const { componentTokens } = useCunninghamTheme.getState(); const logo = componentTokens.logo; diff --git a/src/frontend/apps/impress/src/cunningham/cunningham-tokens.css b/src/frontend/apps/impress/src/cunningham/cunningham-tokens.css index 8bac9c77..77241e67 100644 --- a/src/frontend/apps/impress/src/cunningham/cunningham-tokens.css +++ b/src/frontend/apps/impress/src/cunningham/cunningham-tokens.css @@ -1,374 +1,337 @@ :root { - --c--globals--colors--logo-1: #2845c1; - --c--globals--colors--logo-2: #377fdb; - --c--globals--colors--logo-1-dark: #95abff; - --c--globals--colors--logo-2-dark: #95abff; - --c--globals--colors--brand-050: #edf0ff; - --c--globals--colors--brand-100: #dae2ff; - --c--globals--colors--brand-150: #c8d3ff; - --c--globals--colors--brand-200: #b5c4ff; - --c--globals--colors--brand-250: #a2b6ff; - --c--globals--colors--brand-300: #90a7ff; - --c--globals--colors--brand-350: #7e98ff; - --c--globals--colors--brand-400: #6c89fe; - --c--globals--colors--brand-450: #5c7af7; - --c--globals--colors--brand-500: #4c6cef; - --c--globals--colors--brand-550: #3e5de7; - --c--globals--colors--brand-600: #304ddf; - --c--globals--colors--brand-650: #2845c1; - --c--globals--colors--brand-700: #223e9e; - --c--globals--colors--brand-750: #1f367d; - --c--globals--colors--brand-800: #1b2e5f; - --c--globals--colors--brand-850: #172446; - --c--globals--colors--brand-900: #121b30; - --c--globals--colors--brand-950: #0c111a; + --c--globals--colors--logo-1-light: #4844ad; + --c--globals--colors--logo-2-light: #4844ad; + --c--globals--colors--logo-1-dark: #bec5f0; + --c--globals--colors--logo-2-dark: #bec5f0; + --c--globals--colors--brand-050: #eef1fa; + --c--globals--colors--brand-100: #dde2f5; + --c--globals--colors--brand-150: #ced3f1; + --c--globals--colors--brand-200: #bec5f0; + --c--globals--colors--brand-250: #afb5f1; + --c--globals--colors--brand-300: #a0a5f6; + --c--globals--colors--brand-350: #8f94fd; + --c--globals--colors--brand-400: #8184fc; + --c--globals--colors--brand-450: #7576ee; + --c--globals--colors--brand-500: #6969df; + --c--globals--colors--brand-550: #5e5cd0; + --c--globals--colors--brand-600: #534fc2; + --c--globals--colors--brand-650: #4844ad; + --c--globals--colors--brand-700: #3e3b98; + --c--globals--colors--brand-750: #36347d; + --c--globals--colors--brand-800: #2d2f5f; + --c--globals--colors--brand-850: #262848; + --c--globals--colors--brand-900: #1c1e32; + --c--globals--colors--brand-950: #11131f; --c--globals--colors--gray-000: #fff; - --c--globals--colors--gray-025: #f6f8f9; - --c--globals--colors--gray-050: #eef1f4; - --c--globals--colors--gray-100: #dfe2ea; - --c--globals--colors--gray-150: #cfd5de; - --c--globals--colors--gray-200: #c1c7d3; - --c--globals--colors--gray-250: #b2b9c7; - --c--globals--colors--gray-300: #a4abbc; - --c--globals--colors--gray-350: #969eb0; - --c--globals--colors--gray-400: #8891a4; - --c--globals--colors--gray-450: #7b8498; - --c--globals--colors--gray-500: #6d778c; - --c--globals--colors--gray-550: #626a80; - --c--globals--colors--gray-600: #555e74; - --c--globals--colors--gray-650: #4a5267; - --c--globals--colors--gray-700: #3f4759; - --c--globals--colors--gray-750: #363b4c; - --c--globals--colors--gray-800: #2b303d; - --c--globals--colors--gray-850: #222631; - --c--globals--colors--gray-900: #181b24; - --c--globals--colors--gray-950: #0f1117; + --c--globals--colors--gray-025: #f8f8f9; + --c--globals--colors--gray-050: #f0f0f3; + --c--globals--colors--gray-100: #e2e2ea; + --c--globals--colors--gray-150: #d3d4e0; + --c--globals--colors--gray-200: #c5c6d5; + --c--globals--colors--gray-250: #b7b7cb; + --c--globals--colors--gray-300: #a9a9bf; + --c--globals--colors--gray-350: #9c9cb2; + --c--globals--colors--gray-400: #8f8fa4; + --c--globals--colors--gray-450: #828297; + --c--globals--colors--gray-500: #75758a; + --c--globals--colors--gray-550: #69697d; + --c--globals--colors--gray-600: #5d5d70; + --c--globals--colors--gray-650: #515164; + --c--globals--colors--gray-700: #454558; + --c--globals--colors--gray-750: #3a3a4c; + --c--globals--colors--gray-800: #2f303d; + --c--globals--colors--gray-850: #25252f; + --c--globals--colors--gray-900: #1b1b23; + --c--globals--colors--gray-950: #111114; --c--globals--colors--gray-1000: #000; - --c--globals--colors--info-050: #e7f2ff; - --c--globals--colors--info-100: #cfe5ff; - --c--globals--colors--info-150: #b7d7ff; - --c--globals--colors--info-200: #a0cafe; - --c--globals--colors--info-250: #8cbcf9; - --c--globals--colors--info-300: #77aef4; - --c--globals--colors--info-350: #63a0ee; - --c--globals--colors--info-400: #5092e7; - --c--globals--colors--info-450: #4185dc; - --c--globals--colors--info-500: #3677cc; - --c--globals--colors--info-550: #2f6abb; - --c--globals--colors--info-600: #265eaa; - --c--globals--colors--info-650: #28528f; - --c--globals--colors--info-700: #274775; - --c--globals--colors--info-750: #243c5e; - --c--globals--colors--info-800: #20314a; - --c--globals--colors--info-850: #1b2637; - --c--globals--colors--info-900: #141c27; - --c--globals--colors--info-950: #0d1118; - --c--globals--colors--success-050: #def7e6; - --c--globals--colors--success-100: #baeecf; - --c--globals--colors--success-150: #a5e2c0; - --c--globals--colors--success-200: #95d4b3; - --c--globals--colors--success-250: #85c6a7; - --c--globals--colors--success-300: #74b99b; - --c--globals--colors--success-350: #65ab8f; - --c--globals--colors--success-400: #579e84; - --c--globals--colors--success-450: #4b9079; - --c--globals--colors--success-500: #40836f; - --c--globals--colors--success-550: #367664; - --c--globals--colors--success-600: #2b695a; - --c--globals--colors--success-650: #2c5a50; - --c--globals--colors--success-700: #2a4d45; - --c--globals--colors--success-750: #26403c; - --c--globals--colors--success-800: #213430; - --c--globals--colors--success-850: #1b2826; - --c--globals--colors--success-900: #151d1c; - --c--globals--colors--success-950: #0d1212; - --c--globals--colors--warning-050: #ffeedf; - --c--globals--colors--warning-100: #ffdcbe; - --c--globals--colors--warning-150: #ffca9c; - --c--globals--colors--warning-200: #ffb778; - --c--globals--colors--warning-250: #fda54f; - --c--globals--colors--warning-300: #f59425; - --c--globals--colors--warning-350: #e78613; - --c--globals--colors--warning-400: #d7790c; - --c--globals--colors--warning-450: #c86c08; - --c--globals--colors--warning-500: #b85f03; - --c--globals--colors--warning-550: #a75400; - --c--globals--colors--warning-600: #984800; - --c--globals--colors--warning-650: #814112; - --c--globals--colors--warning-700: #6c3a19; - --c--globals--colors--warning-750: #58321c; - --c--globals--colors--warning-800: #452a1a; - --c--globals--colors--warning-850: #352117; - --c--globals--colors--warning-900: #261813; - --c--globals--colors--warning-950: #170f0c; - --c--globals--colors--error-050: #ffedeb; - --c--globals--colors--error-100: #ffdad7; - --c--globals--colors--error-150: #ffc7c2; - --c--globals--colors--error-200: #ffb3ad; - --c--globals--colors--error-250: #ff9f99; - --c--globals--colors--error-300: #ff8984; - --c--globals--colors--error-350: #ff706e; - --c--globals--colors--error-400: #fb5759; - --c--globals--colors--error-450: #f63a45; - --c--globals--colors--error-500: #e32c39; - --c--globals--colors--error-550: #cf202d; - --c--globals--colors--error-600: #bd0f23; - --c--globals--colors--error-650: #9d2227; - --c--globals--colors--error-700: #812727; - --c--globals--colors--error-750: #672624; - --c--globals--colors--error-800: #512220; - --c--globals--colors--error-850: #3d1c1b; - --c--globals--colors--error-900: #2a1614; - --c--globals--colors--error-950: #190e0d; - --c--globals--colors--red-050: #ffedeb; - --c--globals--colors--red-100: #ffdad7; - --c--globals--colors--red-150: #ffc7c2; - --c--globals--colors--red-200: #ffb3ad; - --c--globals--colors--red-250: #ff9f99; - --c--globals--colors--red-300: #ff8984; - --c--globals--colors--red-350: #ff706e; - --c--globals--colors--red-400: #fb5759; - --c--globals--colors--red-450: #f63a45; - --c--globals--colors--red-500: #e32c39; - --c--globals--colors--red-550: #cf202d; - --c--globals--colors--red-600: #bd0f23; - --c--globals--colors--red-650: #9d2227; - --c--globals--colors--red-700: #812727; - --c--globals--colors--red-750: #672624; - --c--globals--colors--red-800: #512220; - --c--globals--colors--red-850: #3d1c1b; - --c--globals--colors--red-900: #2a1614; - --c--globals--colors--red-950: #190e0d; - --c--globals--colors--orange-050: #fcedeb; - --c--globals--colors--orange-100: #f8dcd7; - --c--globals--colors--orange-150: #f1ccc5; - --c--globals--colors--orange-200: #eabcb4; - --c--globals--colors--orange-250: #e2aca2; - --c--globals--colors--orange-300: #da9c92; - --c--globals--colors--orange-350: #d28c81; - --c--globals--colors--orange-400: #ca7c70; - --c--globals--colors--orange-450: #be6e62; - --c--globals--colors--orange-500: #ae6257; - --c--globals--colors--orange-550: #9e564d; - --c--globals--colors--orange-600: #8f4b42; - --c--globals--colors--orange-650: #79443d; - --c--globals--colors--orange-700: #643c37; - --c--globals--colors--orange-750: #513430; - --c--globals--colors--orange-800: #412b28; - --c--globals--colors--orange-850: #312220; - --c--globals--colors--orange-900: #231918; - --c--globals--colors--orange-950: #150f0f; - --c--globals--colors--brown-050: #f9efea; - --c--globals--colors--brown-100: #f3dfd3; - --c--globals--colors--brown-150: #eacfc1; - --c--globals--colors--brown-200: #e2bfae; - --c--globals--colors--brown-250: #d8b19c; - --c--globals--colors--brown-300: #d0a189; - --c--globals--colors--brown-350: #c3937b; - --c--globals--colors--brown-400: #b5866d; - --c--globals--colors--brown-450: #a77a62; - --c--globals--colors--brown-500: #996d57; - --c--globals--colors--brown-550: #8b614d; - --c--globals--colors--brown-600: #7c5542; - --c--globals--colors--brown-650: #6a4c3c; - --c--globals--colors--brown-700: #594236; - --c--globals--colors--brown-750: #49382f; - --c--globals--colors--brown-800: #3b2e28; - --c--globals--colors--brown-850: #2d2420; - --c--globals--colors--brown-900: #201a18; - --c--globals--colors--brown-950: #13100f; - --c--globals--colors--yellow-050: #fdf1c5; - --c--globals--colors--yellow-100: #fbe18e; - --c--globals--colors--yellow-150: #f4d261; - --c--globals--colors--yellow-200: #eac244; - --c--globals--colors--yellow-250: #dfb41b; - --c--globals--colors--yellow-300: #d1a516; - --c--globals--colors--yellow-350: #c49711; - --c--globals--colors--yellow-400: #b78a0c; - --c--globals--colors--yellow-450: #a87d07; - --c--globals--colors--yellow-500: #9b6f02; - --c--globals--colors--yellow-550: #8d6300; - --c--globals--colors--yellow-600: #7f5600; - --c--globals--colors--yellow-650: #6e4c11; - --c--globals--colors--yellow-700: #5d4219; - --c--globals--colors--yellow-750: #4d371b; - --c--globals--colors--yellow-800: #3d2e1a; - --c--globals--colors--yellow-850: #2f2417; - --c--globals--colors--yellow-900: #221a12; - --c--globals--colors--yellow-950: #14100c; - --c--globals--colors--green-050: #e7f9b3; - --c--globals--colors--green-100: #d5ec98; - --c--globals--colors--green-150: #c5de86; - --c--globals--colors--green-200: #b5d174; - --c--globals--colors--green-250: #a5c464; - --c--globals--colors--green-300: #95b755; - --c--globals--colors--green-350: #85aa45; - --c--globals--colors--green-400: #769d39; - --c--globals--colors--green-450: #688f30; - --c--globals--colors--green-500: #5a8228; - --c--globals--colors--green-550: #4d7621; - --c--globals--colors--green-600: #416919; - --c--globals--colors--green-650: #3a5b20; - --c--globals--colors--green-700: #324e22; - --c--globals--colors--green-750: #2c4122; - --c--globals--colors--green-800: #24351d; - --c--globals--colors--green-850: #1d2919; - --c--globals--colors--green-900: #161e13; - --c--globals--colors--green-950: #0e120c; - --c--globals--colors--blue-1-050: #ebf1ff; - --c--globals--colors--blue-1-100: #d6e3fe; - --c--globals--colors--blue-1-150: #c2d5fe; - --c--globals--colors--blue-1-200: #adc7fe; - --c--globals--colors--blue-1-250: #99b8fd; - --c--globals--colors--blue-1-300: #84aafd; - --c--globals--colors--blue-1-350: #6f9bfd; - --c--globals--colors--blue-1-400: #5a8dfb; - --c--globals--colors--blue-1-450: #437dfc; - --c--globals--colors--blue-1-500: #3d71e4; - --c--globals--colors--blue-1-550: #3665cc; - --c--globals--colors--blue-1-600: #305ab5; - --c--globals--colors--blue-1-650: #315093; - --c--globals--colors--blue-1-700: #2e4675; - --c--globals--colors--blue-1-750: #293b5e; - --c--globals--colors--blue-1-800: #243048; - --c--globals--colors--blue-1-850: #1e2635; - --c--globals--colors--blue-1-900: #171c25; - --c--globals--colors--blue-1-950: #0e1116; - --c--globals--colors--blue-2-050: #e2f4f9; - --c--globals--colors--blue-2-100: #c5e9f3; - --c--globals--colors--blue-2-150: #a7dded; - --c--globals--colors--blue-2-200: #88d1e6; - --c--globals--colors--blue-2-250: #68c5e0; - --c--globals--colors--blue-2-300: #48b8d9; - --c--globals--colors--blue-2-350: #3baaca; - --c--globals--colors--blue-2-400: #359cb9; - --c--globals--colors--blue-2-450: #318ea9; - --c--globals--colors--blue-2-500: #2c8199; - --c--globals--colors--blue-2-550: #277389; - --c--globals--colors--blue-2-600: #236679; - --c--globals--colors--blue-2-650: #2a5866; - --c--globals--colors--blue-2-700: #2a4b55; - --c--globals--colors--blue-2-750: #283f47; - --c--globals--colors--blue-2-800: #233337; - --c--globals--colors--blue-2-850: #1d272a; - --c--globals--colors--blue-2-900: #161c1e; - --c--globals--colors--blue-2-950: #0e1112; - --c--globals--colors--purple-050: #f5eeff; - --c--globals--colors--purple-100: #ecdcff; - --c--globals--colors--purple-150: #e2cbff; - --c--globals--colors--purple-200: #d9b9ff; - --c--globals--colors--purple-250: #d0a7ff; - --c--globals--colors--purple-300: #c894fe; - --c--globals--colors--purple-350: #be83fa; - --c--globals--colors--purple-400: #b570f5; - --c--globals--colors--purple-450: #ab5ef0; - --c--globals--colors--purple-500: #a04be8; - --c--globals--colors--purple-550: #933cdb; - --c--globals--colors--purple-600: #8530c8; - --c--globals--colors--purple-650: #7033a5; - --c--globals--colors--purple-700: #5d3185; - --c--globals--colors--purple-750: #4c2c6a; - --c--globals--colors--purple-800: #3c2652; - --c--globals--colors--purple-850: #2d203c; - --c--globals--colors--purple-900: #21182a; - --c--globals--colors--purple-950: #130f19; - --c--globals--colors--pink-050: #ffebf6; - --c--globals--colors--pink-100: #ffd8ed; - --c--globals--colors--pink-150: #fcc4e3; - --c--globals--colors--pink-200: #f7b2d9; - --c--globals--colors--pink-250: #f29fce; - --c--globals--colors--pink-300: #ed8cc3; - --c--globals--colors--pink-350: #e779b8; - --c--globals--colors--pink-400: #e264ad; - --c--globals--colors--pink-450: #d2579e; - --c--globals--colors--pink-500: #c24b8e; - --c--globals--colors--pink-550: #b0417f; - --c--globals--colors--pink-600: #9f3670; - --c--globals--colors--pink-650: #873560; - --c--globals--colors--pink-700: #6f3250; - --c--globals--colors--pink-750: #5a2c43; - --c--globals--colors--pink-800: #472635; - --c--globals--colors--pink-850: #351f29; - --c--globals--colors--pink-900: #26171d; - --c--globals--colors--pink-950: #170f12; - --c--globals--colors--black-000: #0000; - --c--globals--colors--black-050: #0000000d; - --c--globals--colors--black-100: #0000001a; - --c--globals--colors--black-150: #00000026; - --c--globals--colors--black-200: #0003; - --c--globals--colors--black-250: #00000040; - --c--globals--colors--black-300: #0000004d; - --c--globals--colors--black-350: #00000059; - --c--globals--colors--black-400: #0006; - --c--globals--colors--black-450: #00000073; - --c--globals--colors--black-500: #00000080; - --c--globals--colors--black-550: #0000008c; - --c--globals--colors--black-600: #0009; - --c--globals--colors--black-650: #000000a6; - --c--globals--colors--black-700: #000000b3; - --c--globals--colors--black-750: #000000bf; - --c--globals--colors--black-800: #000c; - --c--globals--colors--black-850: #000000d9; - --c--globals--colors--black-900: #000000e6; - --c--globals--colors--black-950: #000000f2; - --c--globals--colors--white-000: #fff; - --c--globals--colors--white-050: #ffffff0d; - --c--globals--colors--white-100: #ffffff1a; - --c--globals--colors--white-150: #ffffff26; - --c--globals--colors--white-200: #fff3; - --c--globals--colors--white-250: #ffffff40; - --c--globals--colors--white-300: #ffffff4d; - --c--globals--colors--white-350: #ffffff59; - --c--globals--colors--white-400: #fff6; - --c--globals--colors--white-450: #ffffff73; - --c--globals--colors--white-500: #ffffff80; - --c--globals--colors--white-550: #ffffff8c; - --c--globals--colors--white-600: #fff9; - --c--globals--colors--white-650: #ffffffa6; - --c--globals--colors--white-700: #ffffffb3; - --c--globals--colors--white-750: #ffffffbf; - --c--globals--colors--white-800: #fffc; - --c--globals--colors--white-850: #ffffffd9; - --c--globals--colors--white-900: #ffffffe6; - --c--globals--colors--white-950: #fffffff2; - --c--globals--colors--blue1-050: #e7f2ff; - --c--globals--colors--blue1-100: #cfe5ff; - --c--globals--colors--blue1-150: #b7d7ff; - --c--globals--colors--blue1-200: #a0cafe; - --c--globals--colors--blue1-250: #8cbcf9; - --c--globals--colors--blue1-300: #77aef4; - --c--globals--colors--blue1-350: #63a0ee; - --c--globals--colors--blue1-400: #5092e7; - --c--globals--colors--blue1-450: #4185dc; - --c--globals--colors--blue1-500: #3677cc; - --c--globals--colors--blue1-550: #2f6abb; - --c--globals--colors--blue1-600: #265eaa; - --c--globals--colors--blue1-650: #28528f; - --c--globals--colors--blue1-700: #274775; - --c--globals--colors--blue1-750: #243c5e; - --c--globals--colors--blue1-800: #20314a; - --c--globals--colors--blue1-850: #1b2637; - --c--globals--colors--blue1-900: #141c27; - --c--globals--colors--blue1-950: #0d1118; - --c--globals--colors--blue2-050: #e2f4fd; - --c--globals--colors--blue2-100: #c4e8f8; - --c--globals--colors--blue2-150: #aadcf2; - --c--globals--colors--blue2-200: #93cfeb; - --c--globals--colors--blue2-250: #7cc2e2; - --c--globals--colors--blue2-300: #6cb4d6; - --c--globals--colors--blue2-350: #5ca7c9; - --c--globals--colors--blue2-400: #5099bc; - --c--globals--colors--blue2-450: #458bae; - --c--globals--colors--blue2-500: #3a7ea0; - --c--globals--colors--blue2-550: #327191; - --c--globals--colors--blue2-600: #286483; - --c--globals--colors--blue2-650: #2b5770; - --c--globals--colors--blue2-700: #294a5e; - --c--globals--colors--blue2-750: #263e4d; - --c--globals--colors--blue2-800: #22323d; - --c--globals--colors--blue2-850: #1c272e; - --c--globals--colors--blue2-900: #151d21; - --c--globals--colors--blue2-950: #0e1114; + --c--globals--colors--info-050: #eaf2f9; + --c--globals--colors--info-100: #d5e4f3; + --c--globals--colors--info-150: #bfd7f0; + --c--globals--colors--info-200: #a7caee; + --c--globals--colors--info-250: #8dbdef; + --c--globals--colors--info-300: #6eb0f2; + --c--globals--colors--info-350: #50a2f5; + --c--globals--colors--info-400: #3593f4; + --c--globals--colors--info-450: #1185ed; + --c--globals--colors--info-500: #0077de; + --c--globals--colors--info-550: #0069cf; + --c--globals--colors--info-600: #005bc0; + --c--globals--colors--info-650: #0d4eaa; + --c--globals--colors--info-700: #124394; + --c--globals--colors--info-750: #163878; + --c--globals--colors--info-800: #192f5a; + --c--globals--colors--info-850: #192541; + --c--globals--colors--info-900: #141b2d; + --c--globals--colors--info-950: #0c111c; + --c--globals--colors--success-050: #e8f1ea; + --c--globals--colors--success-100: #cfe4d4; + --c--globals--colors--success-150: #bad9c1; + --c--globals--colors--success-200: #a2cfad; + --c--globals--colors--success-250: #86c597; + --c--globals--colors--success-300: #6cba83; + --c--globals--colors--success-350: #4fb070; + --c--globals--colors--success-400: #40a363; + --c--globals--colors--success-450: #309556; + --c--globals--colors--success-500: #1e884a; + --c--globals--colors--success-550: #027b3e; + --c--globals--colors--success-600: #016d31; + --c--globals--colors--success-650: #006024; + --c--globals--colors--success-700: #005317; + --c--globals--colors--success-750: #0d4511; + --c--globals--colors--success-800: #11380e; + --c--globals--colors--success-850: #132a11; + --c--globals--colors--success-900: #101e0f; + --c--globals--colors--success-950: #091209; + --c--globals--colors--warning-050: #f8f0e9; + --c--globals--colors--warning-100: #f1e0d3; + --c--globals--colors--warning-150: #ecd0bc; + --c--globals--colors--warning-200: #e8c0a4; + --c--globals--colors--warning-250: #e8ae8a; + --c--globals--colors--warning-300: #eb9970; + --c--globals--colors--warning-350: #e98456; + --c--globals--colors--warning-400: #e57036; + --c--globals--colors--warning-450: #da5e18; + --c--globals--colors--warning-500: #cb5000; + --c--globals--colors--warning-550: #bc4200; + --c--globals--colors--warning-600: #ad3300; + --c--globals--colors--warning-650: #9e2300; + --c--globals--colors--warning-700: #882011; + --c--globals--colors--warning-750: #731e16; + --c--globals--colors--warning-800: #58201a; + --c--globals--colors--warning-850: #401d18; + --c--globals--colors--warning-900: #2e1714; + --c--globals--colors--warning-950: #1d0f0d; + --c--globals--colors--error-050: #f9efec; + --c--globals--colors--error-100: #f4dfd9; + --c--globals--colors--error-150: #f0cec6; + --c--globals--colors--error-200: #eebcb2; + --c--globals--colors--error-250: #eea99d; + --c--globals--colors--error-300: #ef9486; + --c--globals--colors--error-350: #f37c6e; + --c--globals--colors--error-400: #f65f53; + --c--globals--colors--error-450: #f0463d; + --c--globals--colors--error-500: #e82322; + --c--globals--colors--error-550: #d7010e; + --c--globals--colors--error-600: #c00100; + --c--globals--colors--error-650: #a00; + --c--globals--colors--error-700: #910c06; + --c--globals--colors--error-750: #731e16; + --c--globals--colors--error-800: #58201a; + --c--globals--colors--error-850: #401d18; + --c--globals--colors--error-900: #2e1714; + --c--globals--colors--error-950: #1d0f0d; + --c--globals--colors--red-050: #faefee; + --c--globals--colors--red-100: #f4dedd; + --c--globals--colors--red-150: #f1cdcb; + --c--globals--colors--red-200: #efbbba; + --c--globals--colors--red-250: #eea8a8; + --c--globals--colors--red-300: #f09394; + --c--globals--colors--red-350: #f37b7e; + --c--globals--colors--red-400: #ef6569; + --c--globals--colors--red-450: #e94a55; + --c--globals--colors--red-500: #da3b49; + --c--globals--colors--red-550: #ca2a3c; + --c--globals--colors--red-600: #bb1330; + --c--globals--colors--red-650: #a90021; + --c--globals--colors--red-700: #910a13; + --c--globals--colors--red-750: #731e16; + --c--globals--colors--red-800: #58201a; + --c--globals--colors--red-850: #411d18; + --c--globals--colors--red-900: #2e1714; + --c--globals--colors--red-950: #1d0f0d; + --c--globals--colors--orange-050: #f8f0e9; + --c--globals--colors--orange-100: #f1e0d3; + --c--globals--colors--orange-150: #ecd0bd; + --c--globals--colors--orange-200: #eabfa6; + --c--globals--colors--orange-250: #ebac90; + --c--globals--colors--orange-300: #ec9772; + --c--globals--colors--orange-350: #e5845a; + --c--globals--colors--orange-400: #d6774d; + --c--globals--colors--orange-450: #c86a40; + --c--globals--colors--orange-500: #b95d33; + --c--globals--colors--orange-550: #ab5025; + --c--globals--colors--orange-600: #9d4315; + --c--globals--colors--orange-650: #8f3600; + --c--globals--colors--orange-700: #812900; + --c--globals--colors--orange-750: #6c2511; + --c--globals--colors--orange-800: #572017; + --c--globals--colors--orange-850: #401d18; + --c--globals--colors--orange-900: #2e1714; + --c--globals--colors--orange-950: #1d0f0d; + --c--globals--colors--brown-050: #f6f0e8; + --c--globals--colors--brown-100: #f1e0d3; + --c--globals--colors--brown-150: #ebd0ba; + --c--globals--colors--brown-200: #e2c0a6; + --c--globals--colors--brown-250: #d4b398; + --c--globals--colors--brown-300: #c6a58b; + --c--globals--colors--brown-350: #b8987e; + --c--globals--colors--brown-400: #aa8b71; + --c--globals--colors--brown-450: #9d7e65; + --c--globals--colors--brown-500: #8f7158; + --c--globals--colors--brown-550: #82654c; + --c--globals--colors--brown-600: #765841; + --c--globals--colors--brown-650: #694c35; + --c--globals--colors--brown-700: #5d412a; + --c--globals--colors--brown-750: #51361e; + --c--globals--colors--brown-800: #452a13; + --c--globals--colors--brown-850: #392008; + --c--globals--colors--brown-900: #29180a; + --c--globals--colors--brown-950: #1b0f08; + --c--globals--colors--yellow-050: #f3f0e7; + --c--globals--colors--yellow-100: #e9e2cf; + --c--globals--colors--yellow-150: #e1d4b7; + --c--globals--colors--yellow-200: #d9c599; + --c--globals--colors--yellow-250: #d2b677; + --c--globals--colors--yellow-300: #caa756; + --c--globals--colors--yellow-350: #c2972e; + --c--globals--colors--yellow-400: #b98900; + --c--globals--colors--yellow-450: #ab7b00; + --c--globals--colors--yellow-500: #9d6e00; + --c--globals--colors--yellow-550: #916100; + --c--globals--colors--yellow-600: #855400; + --c--globals--colors--yellow-650: #784700; + --c--globals--colors--yellow-700: #6c3a00; + --c--globals--colors--yellow-750: #5f2e00; + --c--globals--colors--yellow-800: #512302; + --c--globals--colors--yellow-850: #3e1d10; + --c--globals--colors--yellow-900: #2d1711; + --c--globals--colors--yellow-950: #1d0f0d; + --c--globals--colors--green-050: #e6f1e9; + --c--globals--colors--green-100: #cfe4d5; + --c--globals--colors--green-150: #b8d8c1; + --c--globals--colors--green-200: #a0cfae; + --c--globals--colors--green-250: #84c59a; + --c--globals--colors--green-300: #65ba86; + --c--globals--colors--green-350: #45b173; + --c--globals--colors--green-400: #23a562; + --c--globals--colors--green-450: #029755; + --c--globals--colors--green-500: #008948; + --c--globals--colors--green-550: #017b3b; + --c--globals--colors--green-600: #006e2e; + --c--globals--colors--green-650: #006022; + --c--globals--colors--green-700: #005314; + --c--globals--colors--green-750: #0d4510; + --c--globals--colors--green-800: #11380e; + --c--globals--colors--green-850: #132a11; + --c--globals--colors--green-900: #101e0f; + --c--globals--colors--green-950: #091209; + --c--globals--colors--blue-1-050: #ebf1f9; + --c--globals--colors--blue-1-100: #d6e4f4; + --c--globals--colors--blue-1-150: #c1d7f0; + --c--globals--colors--blue-1-200: #aacaef; + --c--globals--colors--blue-1-250: #8fbcef; + --c--globals--colors--blue-1-300: #7cafeb; + --c--globals--colors--blue-1-350: #68a1e4; + --c--globals--colors--blue-1-400: #5b94d6; + --c--globals--colors--blue-1-450: #4e86c7; + --c--globals--colors--blue-1-500: #4279b9; + --c--globals--colors--blue-1-550: #356cac; + --c--globals--colors--blue-1-600: #28609e; + --c--globals--colors--blue-1-650: #1b5390; + --c--globals--colors--blue-1-700: #0b4783; + --c--globals--colors--blue-1-750: #0f3c6e; + --c--globals--colors--blue-1-800: #133059; + --c--globals--colors--blue-1-850: #152641; + --c--globals--colors--blue-1-900: #121c2d; + --c--globals--colors--blue-1-950: #0b111c; + --c--globals--colors--blue-2-050: #e7f3f4; + --c--globals--colors--blue-2-100: #cee7e9; + --c--globals--colors--blue-2-150: #b2dce0; + --c--globals--colors--blue-2-200: #91d1d7; + --c--globals--colors--blue-2-250: #68c7d0; + --c--globals--colors--blue-2-300: #43bbc5; + --c--globals--colors--blue-2-350: #00afba; + --c--globals--colors--blue-2-400: #01a0aa; + --c--globals--colors--blue-2-450: #00929d; + --c--globals--colors--blue-2-500: #00848f; + --c--globals--colors--blue-2-550: #007682; + --c--globals--colors--blue-2-600: #016874; + --c--globals--colors--blue-2-650: #005b67; + --c--globals--colors--blue-2-700: #004e5a; + --c--globals--colors--blue-2-750: #00424e; + --c--globals--colors--blue-2-800: #003642; + --c--globals--colors--blue-2-850: #002a38; + --c--globals--colors--blue-2-900: #061e28; + --c--globals--colors--blue-2-950: #071219; + --c--globals--colors--purple-050: #f7f0f6; + --c--globals--colors--purple-100: #eee0ee; + --c--globals--colors--purple-150: #e7d1e7; + --c--globals--colors--purple-200: #dbbfe4; + --c--globals--colors--purple-250: #d3aee2; + --c--globals--colors--purple-300: #cb99e1; + --c--globals--colors--purple-350: #c188d9; + --c--globals--colors--purple-400: #b47bcb; + --c--globals--colors--purple-450: #a66ebd; + --c--globals--colors--purple-500: #9961af; + --c--globals--colors--purple-550: #8b55a1; + --c--globals--colors--purple-600: #7e4894; + --c--globals--colors--purple-650: #723c87; + --c--globals--colors--purple-700: #633376; + --c--globals--colors--purple-750: #552a65; + --c--globals--colors--purple-800: #452551; + --c--globals--colors--purple-850: #35213d; + --c--globals--colors--purple-900: #261a2c; + --c--globals--colors--purple-950: #17111c; + --c--globals--colors--pink-050: #f8eff4; + --c--globals--colors--pink-100: #f0dfea; + --c--globals--colors--pink-150: #eacedf; + --c--globals--colors--pink-200: #e9bbd1; + --c--globals--colors--pink-250: #e9a7c2; + --c--globals--colors--pink-300: #e095b4; + --c--globals--colors--pink-350: #d685a8; + --c--globals--colors--pink-400: #c7799b; + --c--globals--colors--pink-450: #b86c8d; + --c--globals--colors--pink-500: #aa5f80; + --c--globals--colors--pink-550: #9c5374; + --c--globals--colors--pink-600: #8e4767; + --c--globals--colors--pink-650: #813b5b; + --c--globals--colors--pink-700: #732e4f; + --c--globals--colors--pink-750: #632643; + --c--globals--colors--pink-800: #521f38; + --c--globals--colors--pink-850: #3e1c2b; + --c--globals--colors--pink-900: #2d171f; + --c--globals--colors--pink-950: #1c0e12; + --c--globals--colors--black-000: #1b1b2300; + --c--globals--colors--black-050: #1b1b230d; + --c--globals--colors--black-100: #1b1b231a; + --c--globals--colors--black-150: #1b1b2326; + --c--globals--colors--black-200: #1b1b2333; + --c--globals--colors--black-250: #1b1b2340; + --c--globals--colors--black-300: #1b1b234d; + --c--globals--colors--black-350: #1b1b2359; + --c--globals--colors--black-400: #1b1b2366; + --c--globals--colors--black-450: #1b1b2373; + --c--globals--colors--black-500: #1b1b2380; + --c--globals--colors--black-550: #1b1b238c; + --c--globals--colors--black-600: #1b1b2399; + --c--globals--colors--black-650: #1b1b23a6; + --c--globals--colors--black-700: #1b1b23b2; + --c--globals--colors--black-750: #1b1b23bf; + --c--globals--colors--black-800: #1b1b23cc; + --c--globals--colors--black-850: #1b1b23d9; + --c--globals--colors--black-900: #1b1b23e5; + --c--globals--colors--black-950: #111114f2; + --c--globals--colors--white-000: #f8f8f900; + --c--globals--colors--white-050: #f8f8f90d; + --c--globals--colors--white-100: #f8f8f91a; + --c--globals--colors--white-150: #f8f8f926; + --c--globals--colors--white-200: #f8f8f933; + --c--globals--colors--white-250: #f8f8f940; + --c--globals--colors--white-300: #f8f8f94d; + --c--globals--colors--white-350: #f8f8f959; + --c--globals--colors--white-400: #f8f8f966; + --c--globals--colors--white-450: #f8f8f973; + --c--globals--colors--white-500: #f8f8f980; + --c--globals--colors--white-550: #f8f8f98c; + --c--globals--colors--white-600: #f8f8f999; + --c--globals--colors--white-650: #f8f8f9a6; + --c--globals--colors--white-700: #f8f8f9b2; + --c--globals--colors--white-750: #f8f8f9bf; + --c--globals--colors--white-800: #f8f8f9cc; + --c--globals--colors--white-850: #f8f8f9d9; + --c--globals--colors--white-900: #f8f8f9e5; + --c--globals--colors--white-950: #f8f8f9f2; + --c--globals--colors--white-975: #f8f8f9f9; --c--globals--transitions--ease-in: cubic-bezier(0.32, 0, 0.67, 0); --c--globals--transitions--ease-out: cubic-bezier(0.33, 1, 0.68, 1); --c--globals--transitions--ease-in-out: cubic-bezier(0.65, 0, 0.35, 1); @@ -399,8 +362,10 @@ --c--globals--font--weights--bold: 600; --c--globals--font--weights--extrabold: 800; --c--globals--font--weights--black: 900; - --c--globals--font--families--base: sans-serif; - --c--globals--font--families--accent: sans-serif; + --c--globals--font--families--base: + hanken grotesk, inter, roboto flex variable, sans-serif; + --c--globals--font--families--accent: + hanken grotesk, inter, roboto flex variable, sans-serif; --c--globals--spacings--0: 0; --c--globals--spacings--l: 3rem; --c--globals--spacings--b: 1.625rem; @@ -409,6 +374,8 @@ --c--globals--spacings--t: 0.5rem; --c--globals--spacings--st: 0.25rem; --c--globals--spacings--4xs: 0.125rem; + --c--globals--spacings--3xs: 0.25rem; + --c--globals--spacings--2xs: 0.375rem; --c--globals--spacings--xxxs: 0.25rem; --c--globals--spacings--xxs: 0.375rem; --c--globals--spacings--xs: 0.5rem; @@ -419,6 +386,8 @@ --c--globals--spacings--xl: 2.5rem; --c--globals--spacings--xxl: 3rem; --c--globals--spacings--xxxl: 3.5rem; + --c--globals--spacings--2xl: 3rem; + --c--globals--spacings--3xl: 3.5rem; --c--globals--spacings--4xl: 4rem; --c--globals--spacings--5xl: 4.5rem; --c--globals--spacings--6xl: 6rem; @@ -427,8 +396,6 @@ --c--globals--spacings--auto: auto; --c--globals--spacings--bx: 2.2rem; --c--globals--spacings--full: 100%; - --c--globals--spacings--3xs: 0.25rem; - --c--globals--spacings--2xs: 0.375rem; --c--globals--breakpoints--xs: 480px; --c--globals--breakpoints--sm: 576px; --c--globals--breakpoints--md: 768px; @@ -438,6 +405,13 @@ --c--globals--breakpoints--xxs: 320px; --c--globals--breakpoints--mobile: 768px; --c--globals--breakpoints--tablet: 1024px; + --c--globals--spacing--0: 0rem; + --c--globals--spacing--none: 0rem; + --c--globals--spacing--auto: auto; + --c--globals--spacing--bx: 2.2rem; + --c--globals--spacing--full: 100%; + --c--globals--spacing--3xs: 0.25rem; + --c--globals--spacing--2xs: 0.375rem; --c--contextuals--background--surface--primary: var( --c--globals--colors--gray-000 ); @@ -447,6 +421,18 @@ --c--contextuals--background--surface--tertiary: var( --c--globals--colors--gray-025 ); + --c--contextuals--background--semantic--overlay--primary: var( + --c--globals--colors--black-050 + ); + --c--contextuals--background--semantic--overlay--primary-hover: var( + --c--globals--colors--black-100 + ); + --c--contextuals--background--semantic--contextual--primary: var( + --c--globals--colors--black-050 + ); + --c--contextuals--background--semantic--contextual--primary-hover: var( + --c--globals--colors--black-100 + ); --c--contextuals--background--semantic--brand--primary: var( --c--globals--colors--brand-550 ); @@ -483,12 +469,6 @@ --c--contextuals--background--semantic--neutral--tertiary-hover: var( --c--globals--colors--gray-100 ); - --c--contextuals--background--semantic--contextual--primary: var( - --c--globals--colors--black-050 - ); - --c--contextuals--background--semantic--contextual--primary-hover: var( - --c--globals--colors--black-100 - ); --c--contextuals--background--semantic--info--primary: var( --c--globals--colors--info-550 ); @@ -666,11 +646,14 @@ --c--contextuals--background--palette--gray--tertiary: var( --c--globals--colors--gray-150 ); - --c--contextuals--background--text--primary: var( - --c--globals--colors--black-050 + --c--contextuals--content--logo1: var(--c--globals--colors--logo-1-light); + --c--contextuals--content--logo2: var(--c--globals--colors--logo-2-light); + --c--contextuals--content--semantic--contextual--primary: var( + --c--globals--colors--white-950 + ); + --c--contextuals--content--semantic--overlay--primary: var( + --c--globals--colors--white-950 ); - --c--contextuals--content--logo1: var(--c--globals--colors--logo-1); - --c--contextuals--content--logo2: var(--c--globals--colors--logo-2); --c--contextuals--content--semantic--brand--primary: var( --c--globals--colors--brand-700 ); @@ -678,7 +661,7 @@ --c--globals--colors--brand-600 ); --c--contextuals--content--semantic--brand--tertiary: var( - --c--globals--colors--brand-500 + --c--globals--colors--brand-550 ); --c--contextuals--content--semantic--brand--on-brand: var( --c--globals--colors--brand-050 @@ -690,14 +673,11 @@ --c--globals--colors--gray-600 ); --c--contextuals--content--semantic--neutral--tertiary: var( - --c--globals--colors--gray-500 + --c--globals--colors--gray-550 ); --c--contextuals--content--semantic--neutral--on-neutral: var( --c--globals--colors--gray-050 ); - --c--contextuals--content--semantic--contextual--primary: var( - --c--globals--colors--white-950 - ); --c--contextuals--content--semantic--info--primary: var( --c--globals--colors--info-700 ); @@ -705,7 +685,7 @@ --c--globals--colors--info-600 ); --c--contextuals--content--semantic--info--tertiary: var( - --c--globals--colors--info-500 + --c--globals--colors--info-550 ); --c--contextuals--content--semantic--info--on-info: var( --c--globals--colors--info-050 @@ -717,7 +697,7 @@ --c--globals--colors--success-600 ); --c--contextuals--content--semantic--success--tertiary: var( - --c--globals--colors--success-500 + --c--globals--colors--success-550 ); --c--contextuals--content--semantic--success--on-success: var( --c--globals--colors--success-050 @@ -729,7 +709,7 @@ --c--globals--colors--warning-600 ); --c--contextuals--content--semantic--warning--tertiary: var( - --c--globals--colors--warning-500 + --c--globals--colors--warning-550 ); --c--contextuals--content--semantic--warning--on-warning: var( --c--globals--colors--warning-050 @@ -741,7 +721,7 @@ --c--globals--colors--error-600 ); --c--contextuals--content--semantic--error--tertiary: var( - --c--globals--colors--error-500 + --c--globals--colors--error-550 ); --c--contextuals--content--semantic--error--on-error: var( --c--globals--colors--error-050 @@ -755,105 +735,45 @@ --c--contextuals--content--palette--brand--primary: var( --c--globals--colors--brand-500 ); - --c--contextuals--content--palette--brand--secondary: var( - --c--globals--colors--brand-350 - ); - --c--contextuals--content--palette--brand--tertiary: var( - --c--globals--colors--brand-150 - ); --c--contextuals--content--palette--red--primary: var( --c--globals--colors--red-500 ); - --c--contextuals--content--palette--red--secondary: var( - --c--globals--colors--red-350 - ); - --c--contextuals--content--palette--red--tertiary: var( - --c--globals--colors--red-150 - ); --c--contextuals--content--palette--orange--primary: var( --c--globals--colors--orange-500 ); - --c--contextuals--content--palette--orange--secondary: var( - --c--globals--colors--orange-350 - ); - --c--contextuals--content--palette--orange--tertiary: var( - --c--globals--colors--orange-150 - ); --c--contextuals--content--palette--brown--primary: var( --c--globals--colors--brown-500 ); - --c--contextuals--content--palette--brown--secondary: var( - --c--globals--colors--brown-350 - ); - --c--contextuals--content--palette--brown--tertiary: var( - --c--globals--colors--brown-150 - ); --c--contextuals--content--palette--yellow--primary: var( --c--globals--colors--yellow-500 ); - --c--contextuals--content--palette--yellow--secondary: var( - --c--globals--colors--yellow-350 - ); - --c--contextuals--content--palette--yellow--tertiary: var( - --c--globals--colors--yellow-150 - ); --c--contextuals--content--palette--green--primary: var( --c--globals--colors--green-500 ); - --c--contextuals--content--palette--green--secondary: var( - --c--globals--colors--green-350 - ); - --c--contextuals--content--palette--green--tertiary: var( - --c--globals--colors--green-150 - ); --c--contextuals--content--palette--blue-1--primary: var( --c--globals--colors--blue-1-500 ); - --c--contextuals--content--palette--blue-1--secondary: var( - --c--globals--colors--blue-1-350 - ); - --c--contextuals--content--palette--blue-1--tertiary: var( - --c--globals--colors--blue-1-150 - ); --c--contextuals--content--palette--blue-2--primary: var( --c--globals--colors--blue-2-500 ); - --c--contextuals--content--palette--blue-2--secondary: var( - --c--globals--colors--blue-2-350 - ); - --c--contextuals--content--palette--blue-2--tertiary: var( - --c--globals--colors--blue-2-150 - ); --c--contextuals--content--palette--purple--primary: var( --c--globals--colors--purple-500 ); - --c--contextuals--content--palette--purple--secondary: var( - --c--globals--colors--purple-350 - ); - --c--contextuals--content--palette--purple--tertiary: var( - --c--globals--colors--purple-150 - ); --c--contextuals--content--palette--pink--primary: var( --c--globals--colors--pink-500 ); - --c--contextuals--content--palette--pink--secondary: var( - --c--globals--colors--pink-350 - ); - --c--contextuals--content--palette--pink--tertiary: var( - --c--globals--colors--pink-150 - ); --c--contextuals--content--palette--gray--primary: var( --c--globals--colors--gray-500 ); - --c--contextuals--content--palette--gray--secondary: var( - --c--globals--colors--gray-350 - ); - --c--contextuals--content--palette--gray--tertiary: var( - --c--globals--colors--gray-150 - ); --c--contextuals--border--surface--primary: var( --c--globals--colors--gray-100 ); + --c--contextuals--border--semantic--contextual--primary: var( + --c--globals--colors--white-200 + ); + --c--contextuals--border--semantic--overlay--primary: var( + --c--globals--colors--white-200 + ); --c--contextuals--border--semantic--brand--primary: var( --c--globals--colors--brand-550 ); @@ -863,9 +783,6 @@ --c--contextuals--border--semantic--brand--tertiary: var( --c--globals--colors--brand-150 ); - --c--contextuals--border--semantic--contextual--primary: var( - --c--globals--colors--white-200 - ); --c--contextuals--border--semantic--neutral--primary: var( --c--globals--colors--gray-550 ); @@ -914,110 +831,8 @@ --c--contextuals--border--semantic--disabled--primary: var( --c--globals--colors--gray-100 ); - --c--contextuals--border--palette--brand--primary: var( - --c--globals--colors--brand-500 - ); - --c--contextuals--border--palette--brand--secondary: var( - --c--globals--colors--brand-350 - ); - --c--contextuals--border--palette--brand--tertiary: var( - --c--globals--colors--brand-150 - ); - --c--contextuals--border--palette--red--primary: var( - --c--globals--colors--red-500 - ); - --c--contextuals--border--palette--red--secondary: var( - --c--globals--colors--red-350 - ); - --c--contextuals--border--palette--red--tertiary: var( - --c--globals--colors--red-150 - ); - --c--contextuals--border--palette--orange--primary: var( - --c--globals--colors--orange-500 - ); - --c--contextuals--border--palette--orange--secondary: var( - --c--globals--colors--orange-350 - ); - --c--contextuals--border--palette--orange--tertiary: var( - --c--globals--colors--orange-150 - ); - --c--contextuals--border--palette--brown--primary: var( - --c--globals--colors--brown-500 - ); - --c--contextuals--border--palette--brown--secondary: var( - --c--globals--colors--brown-350 - ); - --c--contextuals--border--palette--brown--tertiary: var( - --c--globals--colors--brown-150 - ); - --c--contextuals--border--palette--yellow--primary: var( - --c--globals--colors--yellow-500 - ); - --c--contextuals--border--palette--yellow--secondary: var( - --c--globals--colors--yellow-350 - ); - --c--contextuals--border--palette--yellow--tertiary: var( - --c--globals--colors--yellow-150 - ); - --c--contextuals--border--palette--green--primary: var( - --c--globals--colors--green-500 - ); - --c--contextuals--border--palette--green--secondary: var( - --c--globals--colors--green-350 - ); - --c--contextuals--border--palette--green--tertiary: var( - --c--globals--colors--green-150 - ); - --c--contextuals--border--palette--blue-1--primary: var( - --c--globals--colors--blue-1-500 - ); - --c--contextuals--border--palette--blue-1--secondary: var( - --c--globals--colors--blue-1-350 - ); - --c--contextuals--border--palette--blue-1--tertiary: var( - --c--globals--colors--blue-1-150 - ); - --c--contextuals--border--palette--blue-2--primary: var( - --c--globals--colors--blue-2-500 - ); - --c--contextuals--border--palette--blue-2--secondary: var( - --c--globals--colors--blue-2-350 - ); - --c--contextuals--border--palette--blue-2--tertiary: var( - --c--globals--colors--blue-2-150 - ); - --c--contextuals--border--palette--purple--primary: var( - --c--globals--colors--purple-500 - ); - --c--contextuals--border--palette--purple--secondary: var( - --c--globals--colors--purple-350 - ); - --c--contextuals--border--palette--purple--tertiary: var( - --c--globals--colors--purple-150 - ); - --c--contextuals--border--palette--pink--primary: var( - --c--globals--colors--pink-500 - ); - --c--contextuals--border--palette--pink--secondary: var( - --c--globals--colors--pink-350 - ); - --c--contextuals--border--palette--pink--tertiary: var( - --c--globals--colors--pink-150 - ); - --c--contextuals--border--palette--gray--primary: var( - --c--globals--colors--gray-500 - ); - --c--contextuals--border--palette--gray--secondary: var( - --c--globals--colors--gray-350 - ); - --c--contextuals--border--palette--gray--tertiary: var( - --c--globals--colors--gray-150 - ); --c--components--modal--width-small: 342px; --c--components--tooltip--padding: 4px 8px; - --c--components--tooltip--background-color: var( - --c--contextuals--background--semantic--neutral--tertiary - ); --c--components--button--medium-height: 40px; --c--components--button--medium-text-height: 40px; --c--components--button--border-radius: 4px; @@ -1088,10 +903,10 @@ } .cunningham-theme--dark { - --c--globals--colors--logo-1: #377fdb; - --c--globals--colors--logo-2: #377fdb; - --c--globals--colors--logo-1-dark: #95abff; - --c--globals--colors--logo-2-dark: #95abff; + --c--globals--colors--logo-1-light: #377fdb; + --c--globals--colors--logo-2-light: #377fdb; + --c--globals--colors--logo-1-dark: #c1d6f2; + --c--globals--colors--logo-2-dark: #c1d6f2; --c--globals--colors--brand-050: #eaf1fb; --c--globals--colors--brand-100: #d5e4f7; --c--globals--colors--brand-150: #c0d6f4; @@ -1380,46 +1195,47 @@ --c--globals--colors--pink-850: #332028; --c--globals--colors--pink-900: #24181d; --c--globals--colors--pink-950: #160f12; - --c--globals--colors--black-000: #0000; - --c--globals--colors--black-050: #0000000d; - --c--globals--colors--black-100: #0000001a; - --c--globals--colors--black-150: #00000026; - --c--globals--colors--black-200: #0003; - --c--globals--colors--black-250: #00000040; - --c--globals--colors--black-300: #0000004d; - --c--globals--colors--black-350: #00000059; - --c--globals--colors--black-400: #0006; - --c--globals--colors--black-450: #00000073; - --c--globals--colors--black-500: #00000080; - --c--globals--colors--black-550: #0000008c; - --c--globals--colors--black-600: #0009; - --c--globals--colors--black-650: #000000a6; - --c--globals--colors--black-700: #000000b3; - --c--globals--colors--black-750: #000000bf; - --c--globals--colors--black-800: #000c; - --c--globals--colors--black-850: #000000d9; - --c--globals--colors--black-900: #000000e6; - --c--globals--colors--black-950: #000000f2; - --c--globals--colors--white-000: #fff; - --c--globals--colors--white-050: #ffffff0d; - --c--globals--colors--white-100: #ffffff1a; - --c--globals--colors--white-150: #ffffff26; - --c--globals--colors--white-200: #fff3; - --c--globals--colors--white-250: #ffffff40; - --c--globals--colors--white-300: #ffffff4d; - --c--globals--colors--white-350: #ffffff59; - --c--globals--colors--white-400: #fff6; - --c--globals--colors--white-450: #ffffff73; - --c--globals--colors--white-500: #ffffff80; - --c--globals--colors--white-550: #ffffff8c; - --c--globals--colors--white-600: #fff9; - --c--globals--colors--white-650: #ffffffa6; - --c--globals--colors--white-700: #ffffffb3; - --c--globals--colors--white-750: #ffffffbf; - --c--globals--colors--white-800: #fffc; - --c--globals--colors--white-850: #ffffffd9; - --c--globals--colors--white-900: #ffffffe6; - --c--globals--colors--white-950: #fffffff2; + --c--globals--colors--black-000: #1b1c1d00; + --c--globals--colors--black-050: #1b1c1d0d; + --c--globals--colors--black-100: #1b1c1d1a; + --c--globals--colors--black-150: #1b1c1d26; + --c--globals--colors--black-200: #1b1c1d33; + --c--globals--colors--black-250: #1b1c1d40; + --c--globals--colors--black-300: #1b1c1d4d; + --c--globals--colors--black-350: #1b1c1d59; + --c--globals--colors--black-400: #1b1c1d66; + --c--globals--colors--black-450: #1b1c1d73; + --c--globals--colors--black-500: #1b1c1d80; + --c--globals--colors--black-550: #1b1c1d8c; + --c--globals--colors--black-600: #1b1c1d99; + --c--globals--colors--black-650: #1b1c1da6; + --c--globals--colors--black-700: #1b1c1db2; + --c--globals--colors--black-750: #1b1c1dbf; + --c--globals--colors--black-800: #1b1c1dcc; + --c--globals--colors--black-850: #1b1c1dd9; + --c--globals--colors--black-900: #1b1c1de5; + --c--globals--colors--black-950: #101112f2; + --c--globals--colors--white-000: #f7f8f800; + --c--globals--colors--white-050: #f7f8f80d; + --c--globals--colors--white-100: #f7f8f81a; + --c--globals--colors--white-150: #f7f8f826; + --c--globals--colors--white-200: #f7f8f833; + --c--globals--colors--white-250: #f7f8f840; + --c--globals--colors--white-300: #f7f8f84d; + --c--globals--colors--white-350: #f7f8f859; + --c--globals--colors--white-400: #f7f8f866; + --c--globals--colors--white-450: #f7f8f873; + --c--globals--colors--white-500: #f7f8f880; + --c--globals--colors--white-550: #f7f8f88c; + --c--globals--colors--white-600: #f7f8f899; + --c--globals--colors--white-650: #f7f8f8a6; + --c--globals--colors--white-700: #f7f8f8b2; + --c--globals--colors--white-750: #f7f8f8bf; + --c--globals--colors--white-800: #f7f8f8cc; + --c--globals--colors--white-850: #f7f8f8d9; + --c--globals--colors--white-900: #f7f8f8e5; + --c--globals--colors--white-950: #f7f8f8f2; + --c--globals--colors--white-975: #f7f8f8f9; --c--globals--transitions--ease-in: cubic-bezier(0.32, 0, 0.67, 0); --c--globals--transitions--ease-out: cubic-bezier(0.33, 1, 0.68, 1); --c--globals--transitions--ease-in-out: cubic-bezier(0.65, 0, 0.35, 1); @@ -1459,6 +1275,8 @@ --c--globals--spacings--t: 0.5rem; --c--globals--spacings--st: 0.25rem; --c--globals--spacings--4xs: 0.125rem; + --c--globals--spacings--3xs: 0.25rem; + --c--globals--spacings--2xs: 0.375rem; --c--globals--spacings--xxxs: 0.25rem; --c--globals--spacings--xxs: 0.375rem; --c--globals--spacings--xs: 0.5rem; @@ -1469,11 +1287,13 @@ --c--globals--spacings--xl: 2.5rem; --c--globals--spacings--xxl: 3rem; --c--globals--spacings--xxxl: 3.5rem; + --c--globals--spacings--2xl: 3rem; + --c--globals--spacings--3xl: 3.5rem; --c--globals--spacings--4xl: 4rem; --c--globals--spacings--5xl: 4.5rem; --c--globals--spacings--6xl: 6rem; --c--globals--spacings--7xl: 7.5rem; - --c--globals--breakpoints--xs: 0; + --c--globals--breakpoints--xs: 0px; --c--globals--breakpoints--sm: 576px; --c--globals--breakpoints--md: 768px; --c--globals--breakpoints--lg: 992px; @@ -1488,6 +1308,18 @@ --c--contextuals--background--surface--tertiary: var( --c--globals--colors--gray-900 ); + --c--contextuals--background--semantic--contextual--primary: var( + --c--globals--colors--white-050 + ); + --c--contextuals--background--semantic--contextual--primary-hover: var( + --c--globals--colors--white-100 + ); + --c--contextuals--background--semantic--overlay--primary: var( + --c--globals--colors--white-050 + ); + --c--contextuals--background--semantic--overlay--primary-hover: var( + --c--globals--colors--white-100 + ); --c--contextuals--background--semantic--brand--primary: var( --c--globals--colors--brand-550 ); @@ -1524,12 +1356,6 @@ --c--contextuals--background--semantic--neutral--tertiary-hover: var( --c--globals--colors--gray-800 ); - --c--contextuals--background--semantic--contextual--primary: var( - --c--globals--colors--white-050 - ); - --c--contextuals--background--semantic--contextual--primary-hover: var( - --c--globals--colors--white-100 - ); --c--contextuals--background--semantic--info--primary: var( --c--globals--colors--info-550 ); @@ -1709,6 +1535,12 @@ ); --c--contextuals--content--logo1: var(--c--globals--colors--logo-1-dark); --c--contextuals--content--logo2: var(--c--globals--colors--logo-2-dark); + --c--contextuals--content--semantic--contextual--primary: var( + --c--globals--colors--black-850 + ); + --c--contextuals--content--semantic--overlay--primary: var( + --c--globals--colors--black-850 + ); --c--contextuals--content--semantic--brand--primary: var( --c--globals--colors--brand-050 ); @@ -1733,9 +1565,6 @@ --c--contextuals--content--semantic--neutral--on-neutral: var( --c--globals--colors--gray-050 ); - --c--contextuals--content--semantic--contextual--primary: var( - --c--globals--colors--black-850 - ); --c--contextuals--content--semantic--info--primary: var( --c--globals--colors--info-050 ); @@ -1791,107 +1620,47 @@ --c--globals--colors--black-300 ); --c--contextuals--content--palette--brand--primary: var( - --c--globals--colors--brand-350 - ); - --c--contextuals--content--palette--brand--secondary: var( - --c--globals--colors--brand-450 - ); - --c--contextuals--content--palette--brand--tertiary: var( - --c--globals--colors--brand-550 + --c--globals--colors--brand-500 ); --c--contextuals--content--palette--red--primary: var( - --c--globals--colors--red-350 - ); - --c--contextuals--content--palette--red--secondary: var( - --c--globals--colors--red-450 - ); - --c--contextuals--content--palette--red--tertiary: var( - --c--globals--colors--red-550 + --c--globals--colors--red-500 ); --c--contextuals--content--palette--orange--primary: var( - --c--globals--colors--orange-350 - ); - --c--contextuals--content--palette--orange--secondary: var( - --c--globals--colors--orange-450 - ); - --c--contextuals--content--palette--orange--tertiary: var( - --c--globals--colors--orange-550 + --c--globals--colors--orange-500 ); --c--contextuals--content--palette--brown--primary: var( - --c--globals--colors--brown-350 - ); - --c--contextuals--content--palette--brown--secondary: var( - --c--globals--colors--brown-450 - ); - --c--contextuals--content--palette--brown--tertiary: var( - --c--globals--colors--brown-550 + --c--globals--colors--brown-500 ); --c--contextuals--content--palette--yellow--primary: var( - --c--globals--colors--yellow-350 - ); - --c--contextuals--content--palette--yellow--secondary: var( - --c--globals--colors--yellow-450 - ); - --c--contextuals--content--palette--yellow--tertiary: var( - --c--globals--colors--yellow-550 + --c--globals--colors--yellow-500 ); --c--contextuals--content--palette--green--primary: var( - --c--globals--colors--green-350 - ); - --c--contextuals--content--palette--green--secondary: var( - --c--globals--colors--green-450 - ); - --c--contextuals--content--palette--green--tertiary: var( - --c--globals--colors--green-550 + --c--globals--colors--green-500 ); --c--contextuals--content--palette--blue-1--primary: var( - --c--globals--colors--blue-1-350 - ); - --c--contextuals--content--palette--blue-1--secondary: var( - --c--globals--colors--blue-1-450 - ); - --c--contextuals--content--palette--blue-1--tertiary: var( - --c--globals--colors--blue-1-550 + --c--globals--colors--blue-1-500 ); --c--contextuals--content--palette--blue-2--primary: var( - --c--globals--colors--blue-2-350 - ); - --c--contextuals--content--palette--blue-2--secondary: var( - --c--globals--colors--blue-2-450 - ); - --c--contextuals--content--palette--blue-2--tertiary: var( - --c--globals--colors--blue-2-550 + --c--globals--colors--blue-2-500 ); --c--contextuals--content--palette--purple--primary: var( - --c--globals--colors--purple-350 - ); - --c--contextuals--content--palette--purple--secondary: var( - --c--globals--colors--purple-450 - ); - --c--contextuals--content--palette--purple--tertiary: var( - --c--globals--colors--purple-550 + --c--globals--colors--purple-500 ); --c--contextuals--content--palette--pink--primary: var( - --c--globals--colors--pink-350 - ); - --c--contextuals--content--palette--pink--secondary: var( - --c--globals--colors--pink-450 - ); - --c--contextuals--content--palette--pink--tertiary: var( - --c--globals--colors--pink-550 + --c--globals--colors--pink-500 ); --c--contextuals--content--palette--gray--primary: var( - --c--globals--colors--gray-350 - ); - --c--contextuals--content--palette--gray--secondary: var( - --c--globals--colors--gray-450 - ); - --c--contextuals--content--palette--gray--tertiary: var( - --c--globals--colors--gray-550 + --c--globals--colors--gray-500 ); --c--contextuals--border--surface--primary: var( --c--globals--colors--gray-750 ); + --c--contextuals--border--semantic--contextual--primary: var( + --c--globals--colors--black-200 + ); + --c--contextuals--border--semantic--overlay--primary: var( + --c--globals--colors--black-200 + ); --c--contextuals--border--semantic--brand--primary: var( --c--globals--colors--brand-450 ); @@ -1901,9 +1670,6 @@ --c--contextuals--border--semantic--brand--tertiary: var( --c--globals--colors--brand-700 ); - --c--contextuals--border--semantic--contextual--primary: var( - --c--globals--colors--black-200 - ); --c--contextuals--border--semantic--neutral--primary: var( --c--globals--colors--gray-450 ); @@ -1952,425 +1718,898 @@ --c--contextuals--border--semantic--disabled--primary: var( --c--globals--colors--gray-800 ); - --c--contextuals--border--palette--brand--primary: var( - --c--globals--colors--brand-350 - ); - --c--contextuals--border--palette--brand--secondary: var( - --c--globals--colors--brand-450 - ); - --c--contextuals--border--palette--brand--tertiary: var( - --c--globals--colors--brand-550 - ); - --c--contextuals--border--palette--red--primary: var( - --c--globals--colors--red-350 - ); - --c--contextuals--border--palette--red--secondary: var( - --c--globals--colors--red-450 - ); - --c--contextuals--border--palette--red--tertiary: var( - --c--globals--colors--red-550 - ); - --c--contextuals--border--palette--orange--primary: var( - --c--globals--colors--orange-350 - ); - --c--contextuals--border--palette--orange--secondary: var( - --c--globals--colors--orange-450 - ); - --c--contextuals--border--palette--orange--tertiary: var( - --c--globals--colors--orange-550 - ); - --c--contextuals--border--palette--brown--primary: var( - --c--globals--colors--brown-350 - ); - --c--contextuals--border--palette--brown--secondary: var( - --c--globals--colors--brown-450 - ); - --c--contextuals--border--palette--brown--tertiary: var( - --c--globals--colors--brown-550 - ); - --c--contextuals--border--palette--yellow--primary: var( - --c--globals--colors--yellow-350 - ); - --c--contextuals--border--palette--yellow--secondary: var( - --c--globals--colors--yellow-450 - ); - --c--contextuals--border--palette--yellow--tertiary: var( - --c--globals--colors--yellow-550 - ); - --c--contextuals--border--palette--green--primary: var( - --c--globals--colors--green-350 - ); - --c--contextuals--border--palette--green--secondary: var( - --c--globals--colors--green-450 - ); - --c--contextuals--border--palette--green--tertiary: var( - --c--globals--colors--green-550 - ); - --c--contextuals--border--palette--blue-1--primary: var( - --c--globals--colors--blue-1-350 - ); - --c--contextuals--border--palette--blue-1--secondary: var( - --c--globals--colors--blue-1-450 - ); - --c--contextuals--border--palette--blue-1--tertiary: var( - --c--globals--colors--blue-1-550 - ); - --c--contextuals--border--palette--blue-2--primary: var( - --c--globals--colors--blue-2-350 - ); - --c--contextuals--border--palette--blue-2--secondary: var( - --c--globals--colors--blue-2-450 - ); - --c--contextuals--border--palette--blue-2--tertiary: var( - --c--globals--colors--blue-2-550 - ); - --c--contextuals--border--palette--purple--primary: var( - --c--globals--colors--purple-350 - ); - --c--contextuals--border--palette--purple--secondary: var( - --c--globals--colors--purple-450 - ); - --c--contextuals--border--palette--purple--tertiary: var( - --c--globals--colors--purple-550 - ); - --c--contextuals--border--palette--pink--primary: var( - --c--globals--colors--pink-350 - ); - --c--contextuals--border--palette--pink--secondary: var( - --c--globals--colors--pink-450 - ); - --c--contextuals--border--palette--pink--tertiary: var( - --c--globals--colors--pink-550 - ); - --c--contextuals--border--palette--gray--primary: var( - --c--globals--colors--gray-350 - ); - --c--contextuals--border--palette--gray--secondary: var( - --c--globals--colors--gray-450 - ); - --c--contextuals--border--palette--gray--tertiary: var( - --c--globals--colors--gray-550 - ); } .cunningham-theme--dsfr { - --c--globals--font--families--base: - marianne, inter, roboto flex variable, sans-serif; + --c--globals--font--sizes--xs: 0.75rem; + --c--globals--font--sizes--sm: 0.875rem; + --c--globals--font--sizes--md: 1rem; + --c--globals--font--sizes--lg: 1.125rem; + --c--globals--font--sizes--ml: 0.938rem; + --c--globals--font--sizes--xl: 1.25rem; + --c--globals--font--sizes--t: 0.6875rem; + --c--globals--font--sizes--s: 0.75rem; + --c--globals--font--sizes--h1: 2rem; + --c--globals--font--sizes--h2: 1.75rem; + --c--globals--font--sizes--h3: 1.5rem; + --c--globals--font--sizes--h4: 1.375rem; + --c--globals--font--sizes--h5: 1.25rem; + --c--globals--font--sizes--h6: 1.125rem; + --c--globals--font--sizes--xl-alt: 5rem; + --c--globals--font--sizes--lg-alt: 4.5rem; + --c--globals--font--sizes--md-alt: 4rem; + --c--globals--font--sizes--sm-alt: 3.5rem; + --c--globals--font--sizes--xs-alt: 3rem; + --c--globals--font--weights--thin: 100; + --c--globals--font--weights--extrabold: 800; + --c--globals--font--weights--black: 900; --c--globals--font--families--accent: marianne, inter, roboto flex variable, sans-serif; + --c--globals--font--families--base: + marianne, inter, roboto flex variable, sans-serif; + --c--globals--spacings--0: 0; + --c--globals--spacings--none: 0; + --c--globals--spacings--auto: auto; + --c--globals--spacings--bx: 2.2rem; + --c--globals--spacings--full: 100%; + --c--globals--spacings--4xs: 0.125rem; + --c--globals--spacings--3xs: 0.25rem; + --c--globals--spacings--2xs: 0.375rem; + --c--globals--spacings--xs: 0.5rem; + --c--globals--spacings--sm: 0.75rem; + --c--globals--spacings--base: 1rem; + --c--globals--spacings--md: 1.5rem; + --c--globals--spacings--lg: 2rem; + --c--globals--spacings--xl: 2.5rem; + --c--globals--spacings--xxl: 3rem; + --c--globals--spacings--2xl: 3rem; + --c--globals--spacings--xxxl: 3.5rem; + --c--globals--spacings--3xl: 3.5rem; + --c--globals--spacings--4xl: 4rem; + --c--globals--spacings--5xl: 4.5rem; + --c--globals--spacings--6xl: 6rem; + --c--globals--spacings--7xl: 7.5rem; + --c--globals--breakpoints--xxs: 320px; + --c--globals--breakpoints--xs: 480px; + --c--globals--breakpoints--mobile: 768px; + --c--globals--breakpoints--tablet: 1024px; + --c--globals--colors--logo-1-light: #2845c1; + --c--globals--colors--logo-2-light: #c83f49; + --c--globals--colors--logo-1-dark: #95abff; + --c--globals--colors--logo-2-dark: #e78087; + --c--globals--colors--brand-050: #edf0ff; + --c--globals--colors--brand-100: #dae2ff; + --c--globals--colors--brand-150: #c8d3ff; + --c--globals--colors--brand-200: #b5c4ff; + --c--globals--colors--brand-250: #a2b6ff; + --c--globals--colors--brand-300: #90a7ff; + --c--globals--colors--brand-350: #7e98ff; + --c--globals--colors--brand-400: #6c89fe; + --c--globals--colors--brand-450: #5c7af7; + --c--globals--colors--brand-500: #4c6cef; + --c--globals--colors--brand-550: #3e5de7; + --c--globals--colors--brand-600: #304ddf; + --c--globals--colors--brand-650: #2845c1; + --c--globals--colors--brand-700: #223e9e; + --c--globals--colors--brand-750: #1f367d; + --c--globals--colors--brand-800: #1b2e5f; + --c--globals--colors--brand-850: #172446; + --c--globals--colors--brand-900: #121b30; + --c--globals--colors--brand-950: #0c111a; + --c--globals--colors--gray-000: #fff; + --c--globals--colors--gray-025: #f8f8f9; + --c--globals--colors--gray-050: #f0f0f3; + --c--globals--colors--gray-100: #dfe2ea; + --c--globals--colors--gray-150: #cfd5de; + --c--globals--colors--gray-200: #c1c7d3; + --c--globals--colors--gray-250: #b2b9c7; + --c--globals--colors--gray-300: #a4abbc; + --c--globals--colors--gray-350: #969eb0; + --c--globals--colors--gray-400: #8891a4; + --c--globals--colors--gray-450: #7b8498; + --c--globals--colors--gray-500: #6d778c; + --c--globals--colors--gray-550: #626a80; + --c--globals--colors--gray-600: #555e74; + --c--globals--colors--gray-650: #4a5267; + --c--globals--colors--gray-700: #3f4759; + --c--globals--colors--gray-750: #363b4c; + --c--globals--colors--gray-800: #2b303d; + --c--globals--colors--gray-850: #222631; + --c--globals--colors--gray-900: #181b24; + --c--globals--colors--gray-950: #0f1117; + --c--globals--colors--gray-1000: #000; + --c--globals--colors--info-050: #e7f2ff; + --c--globals--colors--info-100: #cfe5ff; + --c--globals--colors--info-150: #b7d7ff; + --c--globals--colors--info-200: #a0cafe; + --c--globals--colors--info-250: #8cbcf9; + --c--globals--colors--info-300: #77aef4; + --c--globals--colors--info-350: #63a0ee; + --c--globals--colors--info-400: #5092e7; + --c--globals--colors--info-450: #4185dc; + --c--globals--colors--info-500: #3677cc; + --c--globals--colors--info-550: #2f6abb; + --c--globals--colors--info-600: #265eaa; + --c--globals--colors--info-650: #28528f; + --c--globals--colors--info-700: #274775; + --c--globals--colors--info-750: #243c5e; + --c--globals--colors--info-800: #20314a; + --c--globals--colors--info-850: #1b2637; + --c--globals--colors--info-900: #141c27; + --c--globals--colors--info-950: #0d1118; + --c--globals--colors--success-050: #def7e6; + --c--globals--colors--success-100: #baeecf; + --c--globals--colors--success-150: #a5e2c0; + --c--globals--colors--success-200: #95d4b3; + --c--globals--colors--success-250: #85c6a7; + --c--globals--colors--success-300: #74b99b; + --c--globals--colors--success-350: #65ab8f; + --c--globals--colors--success-400: #579e84; + --c--globals--colors--success-450: #4b9079; + --c--globals--colors--success-500: #40836f; + --c--globals--colors--success-550: #367664; + --c--globals--colors--success-600: #2b695a; + --c--globals--colors--success-650: #2c5a50; + --c--globals--colors--success-700: #2a4d45; + --c--globals--colors--success-750: #26403c; + --c--globals--colors--success-800: #213430; + --c--globals--colors--success-850: #1b2826; + --c--globals--colors--success-900: #151d1c; + --c--globals--colors--success-950: #0d1212; + --c--globals--colors--warning-050: #ffeedf; + --c--globals--colors--warning-100: #ffdcbe; + --c--globals--colors--warning-150: #ffca9c; + --c--globals--colors--warning-200: #ffb778; + --c--globals--colors--warning-250: #fda54f; + --c--globals--colors--warning-300: #f59425; + --c--globals--colors--warning-350: #e78613; + --c--globals--colors--warning-400: #d7790c; + --c--globals--colors--warning-450: #c86c08; + --c--globals--colors--warning-500: #b85f03; + --c--globals--colors--warning-550: #a75400; + --c--globals--colors--warning-600: #984800; + --c--globals--colors--warning-650: #814112; + --c--globals--colors--warning-700: #6c3a19; + --c--globals--colors--warning-750: #58321c; + --c--globals--colors--warning-800: #452a1a; + --c--globals--colors--warning-850: #352117; + --c--globals--colors--warning-900: #261813; + --c--globals--colors--warning-950: #170f0c; + --c--globals--colors--error-050: #ffedeb; + --c--globals--colors--error-100: #ffdad7; + --c--globals--colors--error-150: #ffc7c2; + --c--globals--colors--error-200: #ffb3ad; + --c--globals--colors--error-250: #ff9f99; + --c--globals--colors--error-300: #ff8984; + --c--globals--colors--error-350: #ff706e; + --c--globals--colors--error-400: #fb5759; + --c--globals--colors--error-450: #f63a45; + --c--globals--colors--error-500: #e32c39; + --c--globals--colors--error-550: #cf202d; + --c--globals--colors--error-600: #bd0f23; + --c--globals--colors--error-650: #9d2227; + --c--globals--colors--error-700: #812727; + --c--globals--colors--error-750: #672624; + --c--globals--colors--error-800: #512220; + --c--globals--colors--error-850: #3d1c1b; + --c--globals--colors--error-900: #2a1614; + --c--globals--colors--error-950: #190e0d; + --c--globals--colors--red-050: #ffedeb; + --c--globals--colors--red-100: #ffdad7; + --c--globals--colors--red-150: #ffc7c2; + --c--globals--colors--red-200: #ffb3ad; + --c--globals--colors--red-250: #ff9f99; + --c--globals--colors--red-300: #ff8984; + --c--globals--colors--red-350: #ff706e; + --c--globals--colors--red-400: #fb5759; + --c--globals--colors--red-450: #f63a45; + --c--globals--colors--red-500: #e32c39; + --c--globals--colors--red-550: #cf202d; + --c--globals--colors--red-600: #bd0f23; + --c--globals--colors--red-650: #9d2227; + --c--globals--colors--red-700: #812727; + --c--globals--colors--red-750: #672624; + --c--globals--colors--red-800: #512220; + --c--globals--colors--red-850: #3d1c1b; + --c--globals--colors--red-900: #410003; + --c--globals--colors--red-950: #190e0d; + --c--globals--colors--orange-050: #fcedeb; + --c--globals--colors--orange-100: #f8dcd7; + --c--globals--colors--orange-150: #f1ccc5; + --c--globals--colors--orange-200: #eabcb4; + --c--globals--colors--orange-250: #e2aca2; + --c--globals--colors--orange-300: #da9c92; + --c--globals--colors--orange-350: #d28c81; + --c--globals--colors--orange-400: #ca7c70; + --c--globals--colors--orange-450: #be6e62; + --c--globals--colors--orange-500: #ae6257; + --c--globals--colors--orange-550: #9e564d; + --c--globals--colors--orange-600: #8f4b42; + --c--globals--colors--orange-650: #79443d; + --c--globals--colors--orange-700: #643c37; + --c--globals--colors--orange-750: #513430; + --c--globals--colors--orange-800: #412b28; + --c--globals--colors--orange-850: #312220; + --c--globals--colors--orange-900: #231918; + --c--globals--colors--orange-950: #150f0f; + --c--globals--colors--brown-050: #f9efea; + --c--globals--colors--brown-100: #f3dfd3; + --c--globals--colors--brown-150: #eacfc1; + --c--globals--colors--brown-200: #e2bfae; + --c--globals--colors--brown-250: #d8b19c; + --c--globals--colors--brown-300: #d0a189; + --c--globals--colors--brown-350: #c3937b; + --c--globals--colors--brown-400: #b5866d; + --c--globals--colors--brown-450: #a77a62; + --c--globals--colors--brown-500: #996d57; + --c--globals--colors--brown-550: #8b614d; + --c--globals--colors--brown-600: #7c5542; + --c--globals--colors--brown-650: #6a4c3c; + --c--globals--colors--brown-700: #594236; + --c--globals--colors--brown-750: #49382f; + --c--globals--colors--brown-800: #3b2e28; + --c--globals--colors--brown-850: #2d2420; + --c--globals--colors--brown-900: #201a18; + --c--globals--colors--brown-950: #13100f; + --c--globals--colors--yellow-050: #fdf1c5; + --c--globals--colors--yellow-100: #fbe18e; + --c--globals--colors--yellow-150: #f4d261; + --c--globals--colors--yellow-200: #eac244; + --c--globals--colors--yellow-250: #dfb41b; + --c--globals--colors--yellow-300: #d1a516; + --c--globals--colors--yellow-350: #c49711; + --c--globals--colors--yellow-400: #b78a0c; + --c--globals--colors--yellow-450: #a87d07; + --c--globals--colors--yellow-500: #9b6f02; + --c--globals--colors--yellow-550: #8d6300; + --c--globals--colors--yellow-600: #7f5600; + --c--globals--colors--yellow-650: #6e4c11; + --c--globals--colors--yellow-700: #5d4219; + --c--globals--colors--yellow-750: #4d371b; + --c--globals--colors--yellow-800: #3d2e1a; + --c--globals--colors--yellow-850: #2f2417; + --c--globals--colors--yellow-900: #221a12; + --c--globals--colors--yellow-950: #14100c; + --c--globals--colors--green-050: #e7f9b3; + --c--globals--colors--green-100: #d5ec98; + --c--globals--colors--green-150: #c5de86; + --c--globals--colors--green-200: #b5d174; + --c--globals--colors--green-250: #a5c464; + --c--globals--colors--green-300: #95b755; + --c--globals--colors--green-350: #85aa45; + --c--globals--colors--green-400: #769d39; + --c--globals--colors--green-450: #688f30; + --c--globals--colors--green-500: #5a8228; + --c--globals--colors--green-550: #4d7621; + --c--globals--colors--green-600: #416919; + --c--globals--colors--green-650: #3a5b20; + --c--globals--colors--green-700: #324e22; + --c--globals--colors--green-750: #2c4122; + --c--globals--colors--green-800: #24351d; + --c--globals--colors--green-850: #1d2919; + --c--globals--colors--green-900: #161e13; + --c--globals--colors--green-950: #0e120c; + --c--globals--colors--blue-1-050: #e7f2ff; + --c--globals--colors--blue-1-100: #cfe5ff; + --c--globals--colors--blue-1-150: #b7d7ff; + --c--globals--colors--blue-1-200: #a0cafe; + --c--globals--colors--blue-1-250: #8cbcf9; + --c--globals--colors--blue-1-300: #77aef4; + --c--globals--colors--blue-1-350: #63a0ee; + --c--globals--colors--blue-1-400: #5092e7; + --c--globals--colors--blue-1-450: #4185dc; + --c--globals--colors--blue-1-500: #3677cc; + --c--globals--colors--blue-1-550: #2f6abb; + --c--globals--colors--blue-1-600: #265eaa; + --c--globals--colors--blue-1-650: #28528f; + --c--globals--colors--blue-1-700: #274775; + --c--globals--colors--blue-1-750: #243c5e; + --c--globals--colors--blue-1-800: #20314a; + --c--globals--colors--blue-1-850: #1b2637; + --c--globals--colors--blue-1-900: #141c27; + --c--globals--colors--blue-1-950: #0d1118; + --c--globals--colors--blue-2-050: #e2f4fd; + --c--globals--colors--blue-2-100: #c4e8f8; + --c--globals--colors--blue-2-150: #aadcf2; + --c--globals--colors--blue-2-200: #93cfeb; + --c--globals--colors--blue-2-250: #7cc2e2; + --c--globals--colors--blue-2-300: #6cb4d6; + --c--globals--colors--blue-2-350: #5ca7c9; + --c--globals--colors--blue-2-400: #5099bc; + --c--globals--colors--blue-2-450: #458bae; + --c--globals--colors--blue-2-500: #3a7ea0; + --c--globals--colors--blue-2-550: #327191; + --c--globals--colors--blue-2-600: #286483; + --c--globals--colors--blue-2-650: #2b5770; + --c--globals--colors--blue-2-700: #294a5e; + --c--globals--colors--blue-2-750: #263e4d; + --c--globals--colors--blue-2-800: #22323d; + --c--globals--colors--blue-2-850: #1c272e; + --c--globals--colors--blue-2-900: #151d21; + --c--globals--colors--blue-2-950: #0e1114; + --c--globals--colors--purple-050: #f5eeff; + --c--globals--colors--purple-100: #ecdcff; + --c--globals--colors--purple-150: #e2cbff; + --c--globals--colors--purple-200: #d9b9ff; + --c--globals--colors--purple-250: #d0a7ff; + --c--globals--colors--purple-300: #c894fe; + --c--globals--colors--purple-350: #be83fa; + --c--globals--colors--purple-400: #b570f5; + --c--globals--colors--purple-450: #ab5ef0; + --c--globals--colors--purple-500: #a04be8; + --c--globals--colors--purple-550: #933cdb; + --c--globals--colors--purple-600: #8530c8; + --c--globals--colors--purple-650: #7033a5; + --c--globals--colors--purple-700: #5d3185; + --c--globals--colors--purple-750: #4c2c6a; + --c--globals--colors--purple-800: #3c2652; + --c--globals--colors--purple-850: #2d203c; + --c--globals--colors--purple-900: #21182a; + --c--globals--colors--purple-950: #130f19; + --c--globals--colors--pink-050: #ffebf6; + --c--globals--colors--pink-100: #ffd8ed; + --c--globals--colors--pink-150: #fcc4e3; + --c--globals--colors--pink-200: #f7b2d9; + --c--globals--colors--pink-250: #f29fce; + --c--globals--colors--pink-300: #ed8cc3; + --c--globals--colors--pink-350: #e779b8; + --c--globals--colors--pink-400: #e264ad; + --c--globals--colors--pink-450: #d2579e; + --c--globals--colors--pink-500: #c24b8e; + --c--globals--colors--pink-550: #b0417f; + --c--globals--colors--pink-600: #9f3670; + --c--globals--colors--pink-650: #873560; + --c--globals--colors--pink-700: #6f3250; + --c--globals--colors--pink-750: #5a2c43; + --c--globals--colors--pink-800: #472635; + --c--globals--colors--pink-850: #351f29; + --c--globals--colors--pink-900: #26171d; + --c--globals--colors--pink-950: #170f12; + --c--globals--colors--black-000: #181b2400; + --c--globals--colors--black-050: #181b240d; + --c--globals--colors--black-100: #181b241a; + --c--globals--colors--black-150: #181b2426; + --c--globals--colors--black-200: #181b2433; + --c--globals--colors--black-250: #181b2440; + --c--globals--colors--black-300: #181b244d; + --c--globals--colors--black-350: #181b2459; + --c--globals--colors--black-400: #181b2466; + --c--globals--colors--black-450: #181b2473; + --c--globals--colors--black-500: #181b2480; + --c--globals--colors--black-550: #181b248c; + --c--globals--colors--black-600: #181b2499; + --c--globals--colors--black-650: #181b24a6; + --c--globals--colors--black-700: #181b24b2; + --c--globals--colors--black-750: #181b24bf; + --c--globals--colors--black-800: #181b24cc; + --c--globals--colors--black-850: #181b24d9; + --c--globals--colors--black-900: #181b24e5; + --c--globals--colors--black-950: #0f1117f2; + --c--globals--colors--white-000: #f6f8f900; + --c--globals--colors--white-050: #f6f8f90d; + --c--globals--colors--white-100: #f6f8f91a; + --c--globals--colors--white-150: #f6f8f926; + --c--globals--colors--white-200: #f6f8f933; + --c--globals--colors--white-250: #f6f8f940; + --c--globals--colors--white-300: #f6f8f94d; + --c--globals--colors--white-350: #f6f8f959; + --c--globals--colors--white-400: #f6f8f966; + --c--globals--colors--white-450: #f6f8f973; + --c--globals--colors--white-500: #f6f8f980; + --c--globals--colors--white-550: #f6f8f98c; + --c--globals--colors--white-600: #f6f8f999; + --c--globals--colors--white-650: #f6f8f9a6; + --c--globals--colors--white-700: #f6f8f9b2; + --c--globals--colors--white-750: #f6f8f9bf; + --c--globals--colors--white-800: #f6f8f9cc; + --c--globals--colors--white-850: #f6f8f9d9; + --c--globals--colors--white-900: #f6f8f9e5; + --c--globals--colors--white-950: #f6f8f9f2; + --c--globals--colors--white-975: #f6f8f9f9; + --c--globals--spacing--0: 0rem; + --c--globals--spacing--none: 0rem; + --c--globals--spacing--auto: auto; + --c--globals--spacing--bx: 2.2rem; + --c--globals--spacing--full: 100%; + --c--globals--spacing--3xs: 0.25rem; + --c--globals--spacing--2xs: 0.375rem; + --c--contextuals--background--surface--primary: var( + --c--globals--colors--gray-000 + ); + --c--contextuals--background--surface--secondary: var( + --c--globals--colors--gray-000 + ); + --c--contextuals--background--surface--tertiary: var( + --c--globals--colors--gray-025 + ); + --c--contextuals--background--semantic--overlay--primary: var( + --c--globals--colors--black-050 + ); + --c--contextuals--background--semantic--overlay--primary-hover: var( + --c--globals--colors--black-100 + ); + --c--contextuals--background--semantic--contextual--primary: var( + --c--globals--colors--black-050 + ); + --c--contextuals--background--semantic--contextual--primary-hover: var( + --c--globals--colors--black-100 + ); + --c--contextuals--background--semantic--brand--primary: var( + --c--globals--colors--brand-550 + ); + --c--contextuals--background--semantic--brand--primary-hover: var( + --c--globals--colors--brand-650 + ); + --c--contextuals--background--semantic--brand--secondary: var( + --c--globals--colors--brand-100 + ); + --c--contextuals--background--semantic--brand--secondary-hover: var( + --c--globals--colors--brand-150 + ); + --c--contextuals--background--semantic--brand--tertiary: var( + --c--globals--colors--brand-050 + ); + --c--contextuals--background--semantic--brand--tertiary-hover: var( + --c--globals--colors--brand-100 + ); + --c--contextuals--background--semantic--neutral--primary: var( + --c--globals--colors--gray-550 + ); + --c--contextuals--background--semantic--neutral--primary-hover: var( + --c--globals--colors--gray-650 + ); + --c--contextuals--background--semantic--neutral--secondary: var( + --c--globals--colors--gray-100 + ); + --c--contextuals--background--semantic--neutral--secondary-hover: var( + --c--globals--colors--gray-150 + ); + --c--contextuals--background--semantic--neutral--tertiary: var( + --c--globals--colors--gray-050 + ); + --c--contextuals--background--semantic--neutral--tertiary-hover: var( + --c--globals--colors--gray-100 + ); + --c--contextuals--background--semantic--info--primary: var( + --c--globals--colors--info-550 + ); + --c--contextuals--background--semantic--info--primary-hover: var( + --c--globals--colors--info-650 + ); + --c--contextuals--background--semantic--info--secondary: var( + --c--globals--colors--info-100 + ); + --c--contextuals--background--semantic--info--secondary-hover: var( + --c--globals--colors--info-150 + ); + --c--contextuals--background--semantic--info--tertiary: var( + --c--globals--colors--info-050 + ); + --c--contextuals--background--semantic--info--tertiary-hover: var( + --c--globals--colors--info-100 + ); + --c--contextuals--background--semantic--success--primary: var( + --c--globals--colors--success-550 + ); + --c--contextuals--background--semantic--success--primary-hover: var( + --c--globals--colors--success-650 + ); + --c--contextuals--background--semantic--success--secondary: var( + --c--globals--colors--success-100 + ); + --c--contextuals--background--semantic--success--secondary-hover: var( + --c--globals--colors--success-150 + ); + --c--contextuals--background--semantic--success--tertiary: var( + --c--globals--colors--success-050 + ); + --c--contextuals--background--semantic--success--tertiary-hover: var( + --c--globals--colors--success-100 + ); + --c--contextuals--background--semantic--warning--primary: var( + --c--globals--colors--warning-550 + ); + --c--contextuals--background--semantic--warning--primary-hover: var( + --c--globals--colors--warning-650 + ); + --c--contextuals--background--semantic--warning--secondary: var( + --c--globals--colors--warning-100 + ); + --c--contextuals--background--semantic--warning--secondary-hover: var( + --c--globals--colors--warning-150 + ); + --c--contextuals--background--semantic--warning--tertiary: var( + --c--globals--colors--warning-050 + ); + --c--contextuals--background--semantic--warning--tertiary-hover: var( + --c--globals--colors--warning-100 + ); + --c--contextuals--background--semantic--error--primary: var( + --c--globals--colors--error-550 + ); + --c--contextuals--background--semantic--error--primary-hover: var( + --c--globals--colors--error-650 + ); + --c--contextuals--background--semantic--error--secondary: var( + --c--globals--colors--error-100 + ); + --c--contextuals--background--semantic--error--secondary-hover: var( + --c--globals--colors--error-150 + ); + --c--contextuals--background--semantic--error--tertiary: var( + --c--globals--colors--error-050 + ); + --c--contextuals--background--semantic--error--tertiary-hover: var( + --c--globals--colors--error-100 + ); + --c--contextuals--background--semantic--disabled--primary: var( + --c--globals--colors--gray-100 + ); + --c--contextuals--background--semantic--disabled--secondary: var( + --c--globals--colors--gray-050 + ); + --c--contextuals--background--palette--brand--primary: var( + --c--globals--colors--brand-500 + ); + --c--contextuals--background--palette--brand--secondary: var( + --c--globals--colors--brand-350 + ); + --c--contextuals--background--palette--brand--tertiary: var( + --c--globals--colors--brand-150 + ); + --c--contextuals--background--palette--red--primary: var( + --c--globals--colors--red-500 + ); + --c--contextuals--background--palette--red--secondary: var( + --c--globals--colors--red-350 + ); + --c--contextuals--background--palette--red--tertiary: var( + --c--globals--colors--red-150 + ); + --c--contextuals--background--palette--orange--primary: var( + --c--globals--colors--orange-500 + ); + --c--contextuals--background--palette--orange--secondary: var( + --c--globals--colors--orange-350 + ); + --c--contextuals--background--palette--orange--tertiary: var( + --c--globals--colors--orange-150 + ); + --c--contextuals--background--palette--brown--primary: var( + --c--globals--colors--brown-500 + ); + --c--contextuals--background--palette--brown--secondary: var( + --c--globals--colors--brown-350 + ); + --c--contextuals--background--palette--brown--tertiary: var( + --c--globals--colors--brown-150 + ); + --c--contextuals--background--palette--yellow--primary: var( + --c--globals--colors--yellow-500 + ); + --c--contextuals--background--palette--yellow--secondary: var( + --c--globals--colors--yellow-350 + ); + --c--contextuals--background--palette--yellow--tertiary: var( + --c--globals--colors--yellow-150 + ); + --c--contextuals--background--palette--green--primary: var( + --c--globals--colors--green-500 + ); + --c--contextuals--background--palette--green--secondary: var( + --c--globals--colors--green-350 + ); + --c--contextuals--background--palette--green--tertiary: var( + --c--globals--colors--green-150 + ); + --c--contextuals--background--palette--blue-1--primary: var( + --c--globals--colors--blue-1-500 + ); + --c--contextuals--background--palette--blue-1--secondary: var( + --c--globals--colors--blue-1-350 + ); + --c--contextuals--background--palette--blue-1--tertiary: var( + --c--globals--colors--blue-1-150 + ); + --c--contextuals--background--palette--blue-2--primary: var( + --c--globals--colors--blue-2-500 + ); + --c--contextuals--background--palette--blue-2--secondary: var( + --c--globals--colors--blue-2-350 + ); + --c--contextuals--background--palette--blue-2--tertiary: var( + --c--globals--colors--blue-2-150 + ); + --c--contextuals--background--palette--purple--primary: var( + --c--globals--colors--purple-500 + ); + --c--contextuals--background--palette--purple--secondary: var( + --c--globals--colors--purple-350 + ); + --c--contextuals--background--palette--purple--tertiary: var( + --c--globals--colors--purple-150 + ); + --c--contextuals--background--palette--pink--primary: var( + --c--globals--colors--pink-500 + ); + --c--contextuals--background--palette--pink--secondary: var( + --c--globals--colors--pink-350 + ); + --c--contextuals--background--palette--pink--tertiary: var( + --c--globals--colors--pink-150 + ); + --c--contextuals--background--palette--gray--primary: var( + --c--globals--colors--gray-500 + ); + --c--contextuals--background--palette--gray--secondary: var( + --c--globals--colors--gray-350 + ); + --c--contextuals--background--palette--gray--tertiary: var( + --c--globals--colors--gray-150 + ); + --c--contextuals--content--logo1: var(--c--globals--colors--logo-1-light); + --c--contextuals--content--logo2: var(--c--globals--colors--logo-2-light); + --c--contextuals--content--semantic--contextual--primary: var( + --c--globals--colors--white-950 + ); + --c--contextuals--content--semantic--overlay--primary: var( + --c--globals--colors--white-950 + ); + --c--contextuals--content--semantic--brand--primary: var( + --c--globals--colors--brand-700 + ); + --c--contextuals--content--semantic--brand--secondary: var( + --c--globals--colors--brand-600 + ); + --c--contextuals--content--semantic--brand--tertiary: var( + --c--globals--colors--brand-550 + ); + --c--contextuals--content--semantic--brand--on-brand: var( + --c--globals--colors--brand-050 + ); + --c--contextuals--content--semantic--neutral--primary: var( + --c--globals--colors--gray-850 + ); + --c--contextuals--content--semantic--neutral--secondary: var( + --c--globals--colors--gray-600 + ); + --c--contextuals--content--semantic--neutral--tertiary: var( + --c--globals--colors--gray-550 + ); + --c--contextuals--content--semantic--neutral--on-neutral: var( + --c--globals--colors--gray-050 + ); + --c--contextuals--content--semantic--info--primary: var( + --c--globals--colors--info-700 + ); + --c--contextuals--content--semantic--info--secondary: var( + --c--globals--colors--info-600 + ); + --c--contextuals--content--semantic--info--tertiary: var( + --c--globals--colors--info-550 + ); + --c--contextuals--content--semantic--info--on-info: var( + --c--globals--colors--info-050 + ); + --c--contextuals--content--semantic--success--primary: var( + --c--globals--colors--success-700 + ); + --c--contextuals--content--semantic--success--secondary: var( + --c--globals--colors--success-600 + ); + --c--contextuals--content--semantic--success--tertiary: var( + --c--globals--colors--success-550 + ); + --c--contextuals--content--semantic--success--on-success: var( + --c--globals--colors--success-050 + ); + --c--contextuals--content--semantic--warning--primary: var( + --c--globals--colors--warning-700 + ); + --c--contextuals--content--semantic--warning--secondary: var( + --c--globals--colors--warning-600 + ); + --c--contextuals--content--semantic--warning--tertiary: var( + --c--globals--colors--warning-550 + ); + --c--contextuals--content--semantic--warning--on-warning: var( + --c--globals--colors--warning-050 + ); + --c--contextuals--content--semantic--error--primary: var( + --c--globals--colors--error-700 + ); + --c--contextuals--content--semantic--error--secondary: var( + --c--globals--colors--error-600 + ); + --c--contextuals--content--semantic--error--tertiary: var( + --c--globals--colors--error-550 + ); + --c--contextuals--content--semantic--error--on-error: var( + --c--globals--colors--error-050 + ); + --c--contextuals--content--semantic--disabled--primary: var( + --c--globals--colors--gray-300 + ); + --c--contextuals--content--semantic--disabled--secondary: var( + --c--globals--colors--white-500 + ); + --c--contextuals--content--palette--brand--primary: var( + --c--globals--colors--brand-500 + ); + --c--contextuals--content--palette--red--primary: var( + --c--globals--colors--red-500 + ); + --c--contextuals--content--palette--orange--primary: var( + --c--globals--colors--orange-500 + ); + --c--contextuals--content--palette--brown--primary: var( + --c--globals--colors--brown-500 + ); + --c--contextuals--content--palette--yellow--primary: var( + --c--globals--colors--yellow-500 + ); + --c--contextuals--content--palette--green--primary: var( + --c--globals--colors--green-500 + ); + --c--contextuals--content--palette--blue-1--primary: var( + --c--globals--colors--blue-1-500 + ); + --c--contextuals--content--palette--blue-2--primary: var( + --c--globals--colors--blue-2-500 + ); + --c--contextuals--content--palette--purple--primary: var( + --c--globals--colors--purple-500 + ); + --c--contextuals--content--palette--pink--primary: var( + --c--globals--colors--pink-500 + ); + --c--contextuals--content--palette--gray--primary: var( + --c--globals--colors--gray-500 + ); + --c--contextuals--border--surface--primary: var( + --c--globals--colors--gray-100 + ); + --c--contextuals--border--semantic--contextual--primary: var( + --c--globals--colors--white-200 + ); + --c--contextuals--border--semantic--overlay--primary: var( + --c--globals--colors--white-200 + ); + --c--contextuals--border--semantic--brand--primary: var( + --c--globals--colors--brand-550 + ); + --c--contextuals--border--semantic--brand--secondary: var( + --c--globals--colors--brand-300 + ); + --c--contextuals--border--semantic--brand--tertiary: var( + --c--globals--colors--brand-150 + ); + --c--contextuals--border--semantic--neutral--primary: var( + --c--globals--colors--gray-550 + ); + --c--contextuals--border--semantic--neutral--secondary: var( + --c--globals--colors--gray-300 + ); + --c--contextuals--border--semantic--neutral--tertiary: var( + --c--globals--colors--gray-150 + ); + --c--contextuals--border--semantic--info--primary: var( + --c--globals--colors--info-550 + ); + --c--contextuals--border--semantic--info--secondary: var( + --c--globals--colors--info-300 + ); + --c--contextuals--border--semantic--info--tertiary: var( + --c--globals--colors--info-150 + ); + --c--contextuals--border--semantic--success--primary: var( + --c--globals--colors--success-550 + ); + --c--contextuals--border--semantic--success--secondary: var( + --c--globals--colors--success-300 + ); + --c--contextuals--border--semantic--success--tertiary: var( + --c--globals--colors--success-150 + ); + --c--contextuals--border--semantic--warning--primary: var( + --c--globals--colors--warning-550 + ); + --c--contextuals--border--semantic--warning--secondary: var( + --c--globals--colors--warning-300 + ); + --c--contextuals--border--semantic--warning--tertiary: var( + --c--globals--colors--warning-150 + ); + --c--contextuals--border--semantic--error--primary: var( + --c--globals--colors--error-550 + ); + --c--contextuals--border--semantic--error--secondary: var( + --c--globals--colors--error-300 + ); + --c--contextuals--border--semantic--error--tertiary: var( + --c--globals--colors--error-150 + ); + --c--contextuals--border--semantic--disabled--primary: var( + --c--globals--colors--gray-100 + ); + --c--components--modal--width-small: 342px; + --c--components--tooltip--padding: 4px 8px; + --c--components--button--medium-height: 40px; + --c--components--button--medium-text-height: 40px; + --c--components--button--border-radius: 4px; + --c--components--button--border-radius--active: 4px; + --c--components--button--border-radius--focus: 4px; + --c--components--datagrid--header--color: var( + --c--contextuals--content--semantic--neutral--primary + ); + --c--components--datagrid--header--size: 12px; + --c--components--datagrid--header--weight: 500; + --c--components--datagrid--body--background-color-hover: var( + --c--contextuals--background--semantic--neutral--tertiary + ); + --c--components--forms-checkbox--font-size: var( + --c--globals--font--sizes--sm + ); + --c--components--badge--font-size: var(--c--globals--font--sizes--xs); + --c--components--badge--border-radius: 12px; + --c--components--badge--padding-inline: var(--c--globals--spacings--xs); + --c--components--badge--padding-block: var(--c--globals--spacings--2xs); + --c--components--badge--accent--background-color: var( + --c--contextuals--background--semantic--brand--secondary + ); + --c--components--badge--accent--color: var( + --c--contextuals--content--semantic--brand--secondary + ); + --c--components--badge--neutral--background-color: var( + --c--contextuals--background--semantic--neutral--secondary + ); + --c--components--badge--neutral--color: var( + --c--contextuals--content--semantic--neutral--secondary + ); + --c--components--badge--danger--background-color: var( + --c--contextuals--background--semantic--error--secondary + ); + --c--components--badge--danger--color: var( + --c--contextuals--content--semantic--error--secondary + ); + --c--components--badge--success--background-color: var( + --c--contextuals--background--semantic--success--secondary + ); + --c--components--badge--success--color: var( + --c--contextuals--content--semantic--success--secondary + ); + --c--components--badge--warning--background-color: var( + --c--contextuals--background--semantic--warning--secondary + ); + --c--components--badge--warning--color: var( + --c--contextuals--content--semantic--warning--secondary + ); + --c--components--badge--info--background-color: var( + --c--contextuals--background--semantic--info--secondary + ); + --c--components--badge--info--color: var( + --c--contextuals--content--semantic--info--secondary + ); --c--components--logo--src: /assets/logo-gouv.svg; + --c--components--logo--alt: gouvernement logo; --c--components--logo--widthHeader: 110px; --c--components--logo--widthFooter: 220px; - --c--components--logo--alt: gouvernement logo; --c--components--la-gaufre: true; --c--components--home-proconnect: true; --c--components--icon--src: /assets/icon-docs-dsfr.svg; --c--components--icon--width: 32px; --c--components--icon--height: auto; - --c--components--favicon--ico: /assets/favicon-dsfr.ico; --c--components--favicon--png-light: /assets/favicon-dsfr.png; --c--components--favicon--png-dark: /assets/favicon-dark-dsfr.png; + --c--components--favicon--ico: /assets/favicon-dsfr.ico; } -.cunningham-theme--generic { - --c--globals--colors--brand-050: #eef1fa; - --c--globals--colors--brand-100: #dde2f5; - --c--globals--colors--brand-150: #ced3f1; - --c--globals--colors--brand-200: #bec5f0; - --c--globals--colors--brand-250: #afb5f1; - --c--globals--colors--brand-300: #a0a5f6; - --c--globals--colors--brand-350: #8f94fd; - --c--globals--colors--brand-400: #8184fc; - --c--globals--colors--brand-450: #7576ee; - --c--globals--colors--brand-500: #6969df; - --c--globals--colors--brand-550: #5e5cd0; - --c--globals--colors--brand-600: #534fc2; - --c--globals--colors--brand-650: #4844ad; - --c--globals--colors--brand-700: #3e3b98; - --c--globals--colors--brand-750: #36347d; - --c--globals--colors--brand-800: #2d2f5f; - --c--globals--colors--brand-850: #262848; - --c--globals--colors--brand-900: #1c1e32; - --c--globals--colors--brand-950: #11131f; - --c--globals--colors--gray-000: #fff; - --c--globals--colors--gray-025: #f8f8f9; - --c--globals--colors--gray-050: #f0f0f3; - --c--globals--colors--gray-100: #e2e2ea; - --c--globals--colors--gray-150: #d3d4e0; - --c--globals--colors--gray-200: #c5c6d5; - --c--globals--colors--gray-250: #b7b7cb; - --c--globals--colors--gray-300: #a9a9bf; - --c--globals--colors--gray-350: #9c9cb2; - --c--globals--colors--gray-400: #8f8fa4; - --c--globals--colors--gray-450: #828297; - --c--globals--colors--gray-500: #75758a; - --c--globals--colors--gray-550: #69697d; - --c--globals--colors--gray-600: #5d5d70; - --c--globals--colors--gray-650: #515164; - --c--globals--colors--gray-700: #454558; - --c--globals--colors--gray-750: #3a3a4c; - --c--globals--colors--gray-800: #2f303d; - --c--globals--colors--gray-850: #25252f; - --c--globals--colors--gray-900: #1b1b23; - --c--globals--colors--gray-950: #111114; - --c--globals--colors--gray-1000: #000; - --c--globals--colors--info-050: #eaf2f9; - --c--globals--colors--info-100: #d5e4f3; - --c--globals--colors--info-150: #bfd7f0; - --c--globals--colors--info-200: #a7caee; - --c--globals--colors--info-250: #8dbdef; - --c--globals--colors--info-300: #6eb0f2; - --c--globals--colors--info-350: #50a2f5; - --c--globals--colors--info-400: #3593f4; - --c--globals--colors--info-450: #1185ed; - --c--globals--colors--info-500: #0077de; - --c--globals--colors--info-550: #0069cf; - --c--globals--colors--info-600: #005bc0; - --c--globals--colors--info-650: #0d4eaa; - --c--globals--colors--info-700: #124394; - --c--globals--colors--info-750: #163878; - --c--globals--colors--info-800: #192f5a; - --c--globals--colors--info-850: #192541; - --c--globals--colors--info-900: #141b2d; - --c--globals--colors--info-950: #0c111c; - --c--globals--colors--success-050: #e8f1ea; - --c--globals--colors--success-100: #cfe4d4; - --c--globals--colors--success-150: #bad9c1; - --c--globals--colors--success-200: #a2cfad; - --c--globals--colors--success-250: #86c597; - --c--globals--colors--success-300: #6cba83; - --c--globals--colors--success-350: #4fb070; - --c--globals--colors--success-400: #40a363; - --c--globals--colors--success-450: #309556; - --c--globals--colors--success-500: #1e884a; - --c--globals--colors--success-550: #027b3e; - --c--globals--colors--success-600: #016d31; - --c--globals--colors--success-650: #006024; - --c--globals--colors--success-700: #005317; - --c--globals--colors--success-750: #0d4511; - --c--globals--colors--success-800: #11380e; - --c--globals--colors--success-850: #132a11; - --c--globals--colors--success-900: #101e0f; - --c--globals--colors--success-950: #091209; - --c--globals--colors--warning-050: #f8f0e9; - --c--globals--colors--warning-100: #f1e0d3; - --c--globals--colors--warning-150: #ecd0bc; - --c--globals--colors--warning-200: #e8c0a4; - --c--globals--colors--warning-250: #e8ae8a; - --c--globals--colors--warning-300: #eb9970; - --c--globals--colors--warning-350: #e98456; - --c--globals--colors--warning-400: #e57036; - --c--globals--colors--warning-450: #da5e18; - --c--globals--colors--warning-500: #cb5000; - --c--globals--colors--warning-550: #bc4200; - --c--globals--colors--warning-600: #ad3300; - --c--globals--colors--warning-650: #9e2300; - --c--globals--colors--warning-700: #882011; - --c--globals--colors--warning-750: #731e16; - --c--globals--colors--warning-800: #58201a; - --c--globals--colors--warning-850: #401d18; - --c--globals--colors--warning-900: #2e1714; - --c--globals--colors--warning-950: #1d0f0d; - --c--globals--colors--error-050: #f9efec; - --c--globals--colors--error-100: #f4dfd9; - --c--globals--colors--error-150: #f0cec6; - --c--globals--colors--error-200: #eebcb2; - --c--globals--colors--error-250: #eea99d; - --c--globals--colors--error-300: #ef9486; - --c--globals--colors--error-350: #f37c6e; - --c--globals--colors--error-400: #f65f53; - --c--globals--colors--error-450: #f0463d; - --c--globals--colors--error-500: #e82322; - --c--globals--colors--error-550: #d7010e; - --c--globals--colors--error-600: #c00100; - --c--globals--colors--error-650: #a00; - --c--globals--colors--error-700: #910c06; - --c--globals--colors--error-750: #731e16; - --c--globals--colors--error-800: #58201a; - --c--globals--colors--error-850: #401d18; - --c--globals--colors--error-900: #2e1714; - --c--globals--colors--error-950: #1d0f0d; - --c--globals--colors--red-050: #faefee; - --c--globals--colors--red-100: #f4dedd; - --c--globals--colors--red-150: #f1cdcb; - --c--globals--colors--red-200: #efbbba; - --c--globals--colors--red-250: #eea8a8; - --c--globals--colors--red-300: #f09394; - --c--globals--colors--red-350: #f37b7e; - --c--globals--colors--red-400: #ef6569; - --c--globals--colors--red-450: #e94a55; - --c--globals--colors--red-500: #da3b49; - --c--globals--colors--red-550: #ca2a3c; - --c--globals--colors--red-600: #bb1330; - --c--globals--colors--red-650: #a90021; - --c--globals--colors--red-700: #910a13; - --c--globals--colors--red-750: #731e16; - --c--globals--colors--red-800: #58201a; - --c--globals--colors--red-850: #411d18; - --c--globals--colors--red-900: #2e1714; - --c--globals--colors--red-950: #1d0f0d; - --c--globals--colors--orange-050: #f8f0e9; - --c--globals--colors--orange-100: #f1e0d3; - --c--globals--colors--orange-150: #ecd0bd; - --c--globals--colors--orange-200: #eabfa6; - --c--globals--colors--orange-250: #ebac90; - --c--globals--colors--orange-300: #ec9772; - --c--globals--colors--orange-350: #e5845a; - --c--globals--colors--orange-400: #d6774d; - --c--globals--colors--orange-450: #c86a40; - --c--globals--colors--orange-500: #b95d33; - --c--globals--colors--orange-550: #ab5025; - --c--globals--colors--orange-600: #9d4315; - --c--globals--colors--orange-650: #8f3600; - --c--globals--colors--orange-700: #812900; - --c--globals--colors--orange-750: #6c2511; - --c--globals--colors--orange-800: #572017; - --c--globals--colors--orange-850: #401d18; - --c--globals--colors--orange-900: #2e1714; - --c--globals--colors--orange-950: #1d0f0d; - --c--globals--colors--brown-050: #f6f0e8; - --c--globals--colors--brown-100: #f1e0d3; - --c--globals--colors--brown-150: #ebd0ba; - --c--globals--colors--brown-200: #e2c0a6; - --c--globals--colors--brown-250: #d4b398; - --c--globals--colors--brown-300: #c6a58b; - --c--globals--colors--brown-350: #b8987e; - --c--globals--colors--brown-400: #aa8b71; - --c--globals--colors--brown-450: #9d7e65; - --c--globals--colors--brown-500: #8f7158; - --c--globals--colors--brown-550: #82654c; - --c--globals--colors--brown-600: #765841; - --c--globals--colors--brown-650: #694c35; - --c--globals--colors--brown-700: #5d412a; - --c--globals--colors--brown-750: #51361e; - --c--globals--colors--brown-800: #452a13; - --c--globals--colors--brown-850: #392008; - --c--globals--colors--brown-900: #29180a; - --c--globals--colors--brown-950: #1b0f08; - --c--globals--colors--yellow-050: #f3f0e7; - --c--globals--colors--yellow-100: #e9e2cf; - --c--globals--colors--yellow-150: #e1d4b7; - --c--globals--colors--yellow-200: #d9c599; - --c--globals--colors--yellow-250: #d2b677; - --c--globals--colors--yellow-300: #caa756; - --c--globals--colors--yellow-350: #c2972e; - --c--globals--colors--yellow-400: #b98900; - --c--globals--colors--yellow-450: #ab7b00; - --c--globals--colors--yellow-500: #9d6e00; - --c--globals--colors--yellow-550: #916100; - --c--globals--colors--yellow-600: #855400; - --c--globals--colors--yellow-650: #784700; - --c--globals--colors--yellow-700: #6c3a00; - --c--globals--colors--yellow-750: #5f2e00; - --c--globals--colors--yellow-800: #512302; - --c--globals--colors--yellow-850: #3e1d10; - --c--globals--colors--yellow-900: #2d1711; - --c--globals--colors--yellow-950: #1d0f0d; - --c--globals--colors--green-050: #e6f1e9; - --c--globals--colors--green-100: #cfe4d5; - --c--globals--colors--green-150: #b8d8c1; - --c--globals--colors--green-200: #a0cfae; - --c--globals--colors--green-250: #84c59a; - --c--globals--colors--green-300: #65ba86; - --c--globals--colors--green-350: #45b173; - --c--globals--colors--green-400: #23a562; - --c--globals--colors--green-450: #029755; - --c--globals--colors--green-500: #008948; - --c--globals--colors--green-550: #017b3b; - --c--globals--colors--green-600: #006e2e; - --c--globals--colors--green-650: #006022; - --c--globals--colors--green-700: #005314; - --c--globals--colors--green-750: #0d4510; - --c--globals--colors--green-800: #11380e; - --c--globals--colors--green-850: #132a11; - --c--globals--colors--green-900: #101e0f; - --c--globals--colors--green-950: #091209; - --c--globals--colors--blue1-050: #ebf1f9; - --c--globals--colors--blue1-100: #d6e4f4; - --c--globals--colors--blue1-150: #c1d7f0; - --c--globals--colors--blue1-200: #aacaef; - --c--globals--colors--blue1-250: #8fbcef; - --c--globals--colors--blue1-300: #7cafeb; - --c--globals--colors--blue1-350: #68a1e4; - --c--globals--colors--blue1-400: #5b94d6; - --c--globals--colors--blue1-450: #4e86c7; - --c--globals--colors--blue1-500: #4279b9; - --c--globals--colors--blue1-550: #356cac; - --c--globals--colors--blue1-600: #28609e; - --c--globals--colors--blue1-650: #1b5390; - --c--globals--colors--blue1-700: #0b4783; - --c--globals--colors--blue1-750: #0f3c6e; - --c--globals--colors--blue1-800: #133059; - --c--globals--colors--blue1-850: #152641; - --c--globals--colors--blue1-900: #121c2d; - --c--globals--colors--blue1-950: #0b111c; - --c--globals--colors--blue2-050: #e7f3f4; - --c--globals--colors--blue2-100: #cee7e9; - --c--globals--colors--blue2-150: #b2dce0; - --c--globals--colors--blue2-200: #91d1d7; - --c--globals--colors--blue2-250: #68c7d0; - --c--globals--colors--blue2-300: #43bbc5; - --c--globals--colors--blue2-350: #00afba; - --c--globals--colors--blue2-400: #01a0aa; - --c--globals--colors--blue2-450: #00929d; - --c--globals--colors--blue2-500: #00848f; - --c--globals--colors--blue2-550: #007682; - --c--globals--colors--blue2-600: #016874; - --c--globals--colors--blue2-650: #005b67; - --c--globals--colors--blue2-700: #004e5a; - --c--globals--colors--blue2-750: #00424e; - --c--globals--colors--blue2-800: #003642; - --c--globals--colors--blue2-850: #002a38; - --c--globals--colors--blue2-900: #061e28; - --c--globals--colors--blue2-950: #071219; - --c--globals--colors--purple-050: #f7f0f6; - --c--globals--colors--purple-100: #eee0ee; - --c--globals--colors--purple-150: #e7d1e7; - --c--globals--colors--purple-200: #dbbfe4; - --c--globals--colors--purple-250: #d3aee2; - --c--globals--colors--purple-300: #cb99e1; - --c--globals--colors--purple-350: #c188d9; - --c--globals--colors--purple-400: #b47bcb; - --c--globals--colors--purple-450: #a66ebd; - --c--globals--colors--purple-500: #9961af; - --c--globals--colors--purple-550: #8b55a1; - --c--globals--colors--purple-600: #7e4894; - --c--globals--colors--purple-650: #723c87; - --c--globals--colors--purple-700: #633376; - --c--globals--colors--purple-750: #552a65; - --c--globals--colors--purple-800: #452551; - --c--globals--colors--purple-850: #35213d; - --c--globals--colors--purple-900: #261a2c; - --c--globals--colors--purple-950: #17111c; - --c--globals--colors--pink-050: #f8eff4; - --c--globals--colors--pink-100: #f0dfea; - --c--globals--colors--pink-150: #eacedf; - --c--globals--colors--pink-200: #e9bbd1; - --c--globals--colors--pink-250: #e9a7c2; - --c--globals--colors--pink-300: #e095b4; - --c--globals--colors--pink-350: #d685a8; - --c--globals--colors--pink-400: #c7799b; - --c--globals--colors--pink-450: #b86c8d; - --c--globals--colors--pink-500: #aa5f80; - --c--globals--colors--pink-550: #9c5374; - --c--globals--colors--pink-600: #8e4767; - --c--globals--colors--pink-650: #813b5b; - --c--globals--colors--pink-700: #732e4f; - --c--globals--colors--pink-750: #632643; - --c--globals--colors--pink-800: #521f38; - --c--globals--colors--pink-850: #3e1c2b; - --c--globals--colors--pink-900: #2d171f; - --c--globals--colors--pink-950: #1c0e12; - --c--globals--font--families--base: inter, roboto flex variable, sans-serif; - --c--globals--font--families--accent: inter, roboto flex variable, sans-serif; +.clr-logo-1-light { + color: var(--c--globals--colors--logo-1-light); } -.clr-logo-1 { - color: var(--c--globals--colors--logo-1); -} - -.clr-logo-2 { - color: var(--c--globals--colors--logo-2); +.clr-logo-2-light { + color: var(--c--globals--colors--logo-2-light); } .clr-logo-1-dark { @@ -3693,164 +3932,16 @@ color: var(--c--globals--colors--white-950); } -.clr-blue1-050 { - color: var(--c--globals--colors--blue1-050); +.clr-white-975 { + color: var(--c--globals--colors--white-975); } -.clr-blue1-100 { - color: var(--c--globals--colors--blue1-100); +.bg-logo-1-light { + background-color: var(--c--globals--colors--logo-1-light); } -.clr-blue1-150 { - color: var(--c--globals--colors--blue1-150); -} - -.clr-blue1-200 { - color: var(--c--globals--colors--blue1-200); -} - -.clr-blue1-250 { - color: var(--c--globals--colors--blue1-250); -} - -.clr-blue1-300 { - color: var(--c--globals--colors--blue1-300); -} - -.clr-blue1-350 { - color: var(--c--globals--colors--blue1-350); -} - -.clr-blue1-400 { - color: var(--c--globals--colors--blue1-400); -} - -.clr-blue1-450 { - color: var(--c--globals--colors--blue1-450); -} - -.clr-blue1-500 { - color: var(--c--globals--colors--blue1-500); -} - -.clr-blue1-550 { - color: var(--c--globals--colors--blue1-550); -} - -.clr-blue1-600 { - color: var(--c--globals--colors--blue1-600); -} - -.clr-blue1-650 { - color: var(--c--globals--colors--blue1-650); -} - -.clr-blue1-700 { - color: var(--c--globals--colors--blue1-700); -} - -.clr-blue1-750 { - color: var(--c--globals--colors--blue1-750); -} - -.clr-blue1-800 { - color: var(--c--globals--colors--blue1-800); -} - -.clr-blue1-850 { - color: var(--c--globals--colors--blue1-850); -} - -.clr-blue1-900 { - color: var(--c--globals--colors--blue1-900); -} - -.clr-blue1-950 { - color: var(--c--globals--colors--blue1-950); -} - -.clr-blue2-050 { - color: var(--c--globals--colors--blue2-050); -} - -.clr-blue2-100 { - color: var(--c--globals--colors--blue2-100); -} - -.clr-blue2-150 { - color: var(--c--globals--colors--blue2-150); -} - -.clr-blue2-200 { - color: var(--c--globals--colors--blue2-200); -} - -.clr-blue2-250 { - color: var(--c--globals--colors--blue2-250); -} - -.clr-blue2-300 { - color: var(--c--globals--colors--blue2-300); -} - -.clr-blue2-350 { - color: var(--c--globals--colors--blue2-350); -} - -.clr-blue2-400 { - color: var(--c--globals--colors--blue2-400); -} - -.clr-blue2-450 { - color: var(--c--globals--colors--blue2-450); -} - -.clr-blue2-500 { - color: var(--c--globals--colors--blue2-500); -} - -.clr-blue2-550 { - color: var(--c--globals--colors--blue2-550); -} - -.clr-blue2-600 { - color: var(--c--globals--colors--blue2-600); -} - -.clr-blue2-650 { - color: var(--c--globals--colors--blue2-650); -} - -.clr-blue2-700 { - color: var(--c--globals--colors--blue2-700); -} - -.clr-blue2-750 { - color: var(--c--globals--colors--blue2-750); -} - -.clr-blue2-800 { - color: var(--c--globals--colors--blue2-800); -} - -.clr-blue2-850 { - color: var(--c--globals--colors--blue2-850); -} - -.clr-blue2-900 { - color: var(--c--globals--colors--blue2-900); -} - -.clr-blue2-950 { - color: var(--c--globals--colors--blue2-950); -} - -.bg-logo-1 { - background-color: var(--c--globals--colors--logo-1); -} - -.bg-logo-2 { - background-color: var(--c--globals--colors--logo-2); +.bg-logo-2-light { + background-color: var(--c--globals--colors--logo-2-light); } .bg-logo-1-dark { @@ -5173,156 +5264,8 @@ background-color: var(--c--globals--colors--white-950); } -.bg-blue1-050 { - background-color: var(--c--globals--colors--blue1-050); -} - -.bg-blue1-100 { - background-color: var(--c--globals--colors--blue1-100); -} - -.bg-blue1-150 { - background-color: var(--c--globals--colors--blue1-150); -} - -.bg-blue1-200 { - background-color: var(--c--globals--colors--blue1-200); -} - -.bg-blue1-250 { - background-color: var(--c--globals--colors--blue1-250); -} - -.bg-blue1-300 { - background-color: var(--c--globals--colors--blue1-300); -} - -.bg-blue1-350 { - background-color: var(--c--globals--colors--blue1-350); -} - -.bg-blue1-400 { - background-color: var(--c--globals--colors--blue1-400); -} - -.bg-blue1-450 { - background-color: var(--c--globals--colors--blue1-450); -} - -.bg-blue1-500 { - background-color: var(--c--globals--colors--blue1-500); -} - -.bg-blue1-550 { - background-color: var(--c--globals--colors--blue1-550); -} - -.bg-blue1-600 { - background-color: var(--c--globals--colors--blue1-600); -} - -.bg-blue1-650 { - background-color: var(--c--globals--colors--blue1-650); -} - -.bg-blue1-700 { - background-color: var(--c--globals--colors--blue1-700); -} - -.bg-blue1-750 { - background-color: var(--c--globals--colors--blue1-750); -} - -.bg-blue1-800 { - background-color: var(--c--globals--colors--blue1-800); -} - -.bg-blue1-850 { - background-color: var(--c--globals--colors--blue1-850); -} - -.bg-blue1-900 { - background-color: var(--c--globals--colors--blue1-900); -} - -.bg-blue1-950 { - background-color: var(--c--globals--colors--blue1-950); -} - -.bg-blue2-050 { - background-color: var(--c--globals--colors--blue2-050); -} - -.bg-blue2-100 { - background-color: var(--c--globals--colors--blue2-100); -} - -.bg-blue2-150 { - background-color: var(--c--globals--colors--blue2-150); -} - -.bg-blue2-200 { - background-color: var(--c--globals--colors--blue2-200); -} - -.bg-blue2-250 { - background-color: var(--c--globals--colors--blue2-250); -} - -.bg-blue2-300 { - background-color: var(--c--globals--colors--blue2-300); -} - -.bg-blue2-350 { - background-color: var(--c--globals--colors--blue2-350); -} - -.bg-blue2-400 { - background-color: var(--c--globals--colors--blue2-400); -} - -.bg-blue2-450 { - background-color: var(--c--globals--colors--blue2-450); -} - -.bg-blue2-500 { - background-color: var(--c--globals--colors--blue2-500); -} - -.bg-blue2-550 { - background-color: var(--c--globals--colors--blue2-550); -} - -.bg-blue2-600 { - background-color: var(--c--globals--colors--blue2-600); -} - -.bg-blue2-650 { - background-color: var(--c--globals--colors--blue2-650); -} - -.bg-blue2-700 { - background-color: var(--c--globals--colors--blue2-700); -} - -.bg-blue2-750 { - background-color: var(--c--globals--colors--blue2-750); -} - -.bg-blue2-800 { - background-color: var(--c--globals--colors--blue2-800); -} - -.bg-blue2-850 { - background-color: var(--c--globals--colors--blue2-850); -} - -.bg-blue2-900 { - background-color: var(--c--globals--colors--blue2-900); -} - -.bg-blue2-950 { - background-color: var(--c--globals--colors--blue2-950); +.bg-white-975 { + background-color: var(--c--globals--colors--white-975); } .bg-surface-primary { @@ -5337,6 +5280,30 @@ background-color: var(--c--contextuals--background--surface--tertiary); } +.bg-semantic-overlay-primary { + background-color: var( + --c--contextuals--background--semantic--overlay--primary + ); +} + +.bg-semantic-overlay-primary-hover { + background-color: var( + --c--contextuals--background--semantic--overlay--primary-hover + ); +} + +.bg-semantic-contextual-primary { + background-color: var( + --c--contextuals--background--semantic--contextual--primary + ); +} + +.bg-semantic-contextual-primary-hover { + background-color: var( + --c--contextuals--background--semantic--contextual--primary-hover + ); +} + .bg-semantic-brand-primary { background-color: var(--c--contextuals--background--semantic--brand--primary); } @@ -5407,18 +5374,6 @@ ); } -.bg-semantic-contextual-primary { - background-color: var( - --c--contextuals--background--semantic--contextual--primary - ); -} - -.bg-semantic-contextual-primary-hover { - background-color: var( - --c--contextuals--background--semantic--contextual--primary-hover - ); -} - .bg-semantic-info-primary { background-color: var(--c--contextuals--background--semantic--info--primary); } @@ -5727,10 +5682,6 @@ background-color: var(--c--contextuals--background--palette--gray--tertiary); } -.bg-text-primary { - background-color: var(--c--contextuals--background--text--primary); -} - .fw-thin { font-weight: var(--c--globals--font--weights--thin); } @@ -6022,6 +5973,46 @@ margin-right: var(--c--globals--spacings--4xs); } +.m-3xs { + margin: var(--c--globals--spacings--3xs); +} + +.mb-3xs { + margin-bottom: var(--c--globals--spacings--3xs); +} + +.mt-3xs { + margin-top: var(--c--globals--spacings--3xs); +} + +.ml-3xs { + margin-left: var(--c--globals--spacings--3xs); +} + +.mr-3xs { + margin-right: var(--c--globals--spacings--3xs); +} + +.m-2xs { + margin: var(--c--globals--spacings--2xs); +} + +.mb-2xs { + margin-bottom: var(--c--globals--spacings--2xs); +} + +.mt-2xs { + margin-top: var(--c--globals--spacings--2xs); +} + +.ml-2xs { + margin-left: var(--c--globals--spacings--2xs); +} + +.mr-2xs { + margin-right: var(--c--globals--spacings--2xs); +} + .m-xxxs { margin: var(--c--globals--spacings--xxxs); } @@ -6222,6 +6213,46 @@ margin-right: var(--c--globals--spacings--xxxl); } +.m-2xl { + margin: var(--c--globals--spacings--2xl); +} + +.mb-2xl { + margin-bottom: var(--c--globals--spacings--2xl); +} + +.mt-2xl { + margin-top: var(--c--globals--spacings--2xl); +} + +.ml-2xl { + margin-left: var(--c--globals--spacings--2xl); +} + +.mr-2xl { + margin-right: var(--c--globals--spacings--2xl); +} + +.m-3xl { + margin: var(--c--globals--spacings--3xl); +} + +.mb-3xl { + margin-bottom: var(--c--globals--spacings--3xl); +} + +.mt-3xl { + margin-top: var(--c--globals--spacings--3xl); +} + +.ml-3xl { + margin-left: var(--c--globals--spacings--3xl); +} + +.mr-3xl { + margin-right: var(--c--globals--spacings--3xl); +} + .m-4xl { margin: var(--c--globals--spacings--4xl); } @@ -6382,46 +6413,6 @@ margin-right: var(--c--globals--spacings--full); } -.m-3xs { - margin: var(--c--globals--spacings--3xs); -} - -.mb-3xs { - margin-bottom: var(--c--globals--spacings--3xs); -} - -.mt-3xs { - margin-top: var(--c--globals--spacings--3xs); -} - -.ml-3xs { - margin-left: var(--c--globals--spacings--3xs); -} - -.mr-3xs { - margin-right: var(--c--globals--spacings--3xs); -} - -.m-2xs { - margin: var(--c--globals--spacings--2xs); -} - -.mb-2xs { - margin-bottom: var(--c--globals--spacings--2xs); -} - -.mt-2xs { - margin-top: var(--c--globals--spacings--2xs); -} - -.ml-2xs { - margin-left: var(--c--globals--spacings--2xs); -} - -.mr-2xs { - margin-right: var(--c--globals--spacings--2xs); -} - .p-0 { padding: var(--c--globals--spacings--0); } @@ -6582,6 +6573,46 @@ padding-right: var(--c--globals--spacings--4xs); } +.p-3xs { + padding: var(--c--globals--spacings--3xs); +} + +.pb-3xs { + padding-bottom: var(--c--globals--spacings--3xs); +} + +.pt-3xs { + padding-top: var(--c--globals--spacings--3xs); +} + +.pl-3xs { + padding-left: var(--c--globals--spacings--3xs); +} + +.pr-3xs { + padding-right: var(--c--globals--spacings--3xs); +} + +.p-2xs { + padding: var(--c--globals--spacings--2xs); +} + +.pb-2xs { + padding-bottom: var(--c--globals--spacings--2xs); +} + +.pt-2xs { + padding-top: var(--c--globals--spacings--2xs); +} + +.pl-2xs { + padding-left: var(--c--globals--spacings--2xs); +} + +.pr-2xs { + padding-right: var(--c--globals--spacings--2xs); +} + .p-xxxs { padding: var(--c--globals--spacings--xxxs); } @@ -6782,6 +6813,46 @@ padding-right: var(--c--globals--spacings--xxxl); } +.p-2xl { + padding: var(--c--globals--spacings--2xl); +} + +.pb-2xl { + padding-bottom: var(--c--globals--spacings--2xl); +} + +.pt-2xl { + padding-top: var(--c--globals--spacings--2xl); +} + +.pl-2xl { + padding-left: var(--c--globals--spacings--2xl); +} + +.pr-2xl { + padding-right: var(--c--globals--spacings--2xl); +} + +.p-3xl { + padding: var(--c--globals--spacings--3xl); +} + +.pb-3xl { + padding-bottom: var(--c--globals--spacings--3xl); +} + +.pt-3xl { + padding-top: var(--c--globals--spacings--3xl); +} + +.pl-3xl { + padding-left: var(--c--globals--spacings--3xl); +} + +.pr-3xl { + padding-right: var(--c--globals--spacings--3xl); +} + .p-4xl { padding: var(--c--globals--spacings--4xl); } @@ -6942,46 +7013,6 @@ padding-right: var(--c--globals--spacings--full); } -.p-3xs { - padding: var(--c--globals--spacings--3xs); -} - -.pb-3xs { - padding-bottom: var(--c--globals--spacings--3xs); -} - -.pt-3xs { - padding-top: var(--c--globals--spacings--3xs); -} - -.pl-3xs { - padding-left: var(--c--globals--spacings--3xs); -} - -.pr-3xs { - padding-right: var(--c--globals--spacings--3xs); -} - -.p-2xs { - padding: var(--c--globals--spacings--2xs); -} - -.pb-2xs { - padding-bottom: var(--c--globals--spacings--2xs); -} - -.pt-2xs { - padding-top: var(--c--globals--spacings--2xs); -} - -.pl-2xs { - padding-left: var(--c--globals--spacings--2xs); -} - -.pr-2xs { - padding-right: var(--c--globals--spacings--2xs); -} - .border-clr-surface-primary { border-color: var(--c--contextuals--border--surface--primary); } @@ -6990,6 +7021,22 @@ border: 1px solid var(--c--contextuals--border--surface--primary); } +.border-clr-semantic-contextual-primary { + border-color: var(--c--contextuals--border--semantic--contextual--primary); +} + +.border-thin-semantic-contextual-primary { + border: 1px solid var(--c--contextuals--border--semantic--contextual--primary); +} + +.border-clr-semantic-overlay-primary { + border-color: var(--c--contextuals--border--semantic--overlay--primary); +} + +.border-thin-semantic-overlay-primary { + border: 1px solid var(--c--contextuals--border--semantic--overlay--primary); +} + .border-clr-semantic-brand-primary { border-color: var(--c--contextuals--border--semantic--brand--primary); } @@ -7014,14 +7061,6 @@ border: 1px solid var(--c--contextuals--border--semantic--brand--tertiary); } -.border-clr-semantic-contextual-primary { - border-color: var(--c--contextuals--border--semantic--contextual--primary); -} - -.border-thin-semantic-contextual-primary { - border: 1px solid var(--c--contextuals--border--semantic--contextual--primary); -} - .border-clr-semantic-neutral-primary { border-color: var(--c--contextuals--border--semantic--neutral--primary); } @@ -7150,270 +7189,6 @@ border: 1px solid var(--c--contextuals--border--semantic--disabled--primary); } -.border-clr-palette-brand-primary { - border-color: var(--c--contextuals--border--palette--brand--primary); -} - -.border-thin-palette-brand-primary { - border: 1px solid var(--c--contextuals--border--palette--brand--primary); -} - -.border-clr-palette-brand-secondary { - border-color: var(--c--contextuals--border--palette--brand--secondary); -} - -.border-thin-palette-brand-secondary { - border: 1px solid var(--c--contextuals--border--palette--brand--secondary); -} - -.border-clr-palette-brand-tertiary { - border-color: var(--c--contextuals--border--palette--brand--tertiary); -} - -.border-thin-palette-brand-tertiary { - border: 1px solid var(--c--contextuals--border--palette--brand--tertiary); -} - -.border-clr-palette-red-primary { - border-color: var(--c--contextuals--border--palette--red--primary); -} - -.border-thin-palette-red-primary { - border: 1px solid var(--c--contextuals--border--palette--red--primary); -} - -.border-clr-palette-red-secondary { - border-color: var(--c--contextuals--border--palette--red--secondary); -} - -.border-thin-palette-red-secondary { - border: 1px solid var(--c--contextuals--border--palette--red--secondary); -} - -.border-clr-palette-red-tertiary { - border-color: var(--c--contextuals--border--palette--red--tertiary); -} - -.border-thin-palette-red-tertiary { - border: 1px solid var(--c--contextuals--border--palette--red--tertiary); -} - -.border-clr-palette-orange-primary { - border-color: var(--c--contextuals--border--palette--orange--primary); -} - -.border-thin-palette-orange-primary { - border: 1px solid var(--c--contextuals--border--palette--orange--primary); -} - -.border-clr-palette-orange-secondary { - border-color: var(--c--contextuals--border--palette--orange--secondary); -} - -.border-thin-palette-orange-secondary { - border: 1px solid var(--c--contextuals--border--palette--orange--secondary); -} - -.border-clr-palette-orange-tertiary { - border-color: var(--c--contextuals--border--palette--orange--tertiary); -} - -.border-thin-palette-orange-tertiary { - border: 1px solid var(--c--contextuals--border--palette--orange--tertiary); -} - -.border-clr-palette-brown-primary { - border-color: var(--c--contextuals--border--palette--brown--primary); -} - -.border-thin-palette-brown-primary { - border: 1px solid var(--c--contextuals--border--palette--brown--primary); -} - -.border-clr-palette-brown-secondary { - border-color: var(--c--contextuals--border--palette--brown--secondary); -} - -.border-thin-palette-brown-secondary { - border: 1px solid var(--c--contextuals--border--palette--brown--secondary); -} - -.border-clr-palette-brown-tertiary { - border-color: var(--c--contextuals--border--palette--brown--tertiary); -} - -.border-thin-palette-brown-tertiary { - border: 1px solid var(--c--contextuals--border--palette--brown--tertiary); -} - -.border-clr-palette-yellow-primary { - border-color: var(--c--contextuals--border--palette--yellow--primary); -} - -.border-thin-palette-yellow-primary { - border: 1px solid var(--c--contextuals--border--palette--yellow--primary); -} - -.border-clr-palette-yellow-secondary { - border-color: var(--c--contextuals--border--palette--yellow--secondary); -} - -.border-thin-palette-yellow-secondary { - border: 1px solid var(--c--contextuals--border--palette--yellow--secondary); -} - -.border-clr-palette-yellow-tertiary { - border-color: var(--c--contextuals--border--palette--yellow--tertiary); -} - -.border-thin-palette-yellow-tertiary { - border: 1px solid var(--c--contextuals--border--palette--yellow--tertiary); -} - -.border-clr-palette-green-primary { - border-color: var(--c--contextuals--border--palette--green--primary); -} - -.border-thin-palette-green-primary { - border: 1px solid var(--c--contextuals--border--palette--green--primary); -} - -.border-clr-palette-green-secondary { - border-color: var(--c--contextuals--border--palette--green--secondary); -} - -.border-thin-palette-green-secondary { - border: 1px solid var(--c--contextuals--border--palette--green--secondary); -} - -.border-clr-palette-green-tertiary { - border-color: var(--c--contextuals--border--palette--green--tertiary); -} - -.border-thin-palette-green-tertiary { - border: 1px solid var(--c--contextuals--border--palette--green--tertiary); -} - -.border-clr-palette-blue-1-primary { - border-color: var(--c--contextuals--border--palette--blue-1--primary); -} - -.border-thin-palette-blue-1-primary { - border: 1px solid var(--c--contextuals--border--palette--blue-1--primary); -} - -.border-clr-palette-blue-1-secondary { - border-color: var(--c--contextuals--border--palette--blue-1--secondary); -} - -.border-thin-palette-blue-1-secondary { - border: 1px solid var(--c--contextuals--border--palette--blue-1--secondary); -} - -.border-clr-palette-blue-1-tertiary { - border-color: var(--c--contextuals--border--palette--blue-1--tertiary); -} - -.border-thin-palette-blue-1-tertiary { - border: 1px solid var(--c--contextuals--border--palette--blue-1--tertiary); -} - -.border-clr-palette-blue-2-primary { - border-color: var(--c--contextuals--border--palette--blue-2--primary); -} - -.border-thin-palette-blue-2-primary { - border: 1px solid var(--c--contextuals--border--palette--blue-2--primary); -} - -.border-clr-palette-blue-2-secondary { - border-color: var(--c--contextuals--border--palette--blue-2--secondary); -} - -.border-thin-palette-blue-2-secondary { - border: 1px solid var(--c--contextuals--border--palette--blue-2--secondary); -} - -.border-clr-palette-blue-2-tertiary { - border-color: var(--c--contextuals--border--palette--blue-2--tertiary); -} - -.border-thin-palette-blue-2-tertiary { - border: 1px solid var(--c--contextuals--border--palette--blue-2--tertiary); -} - -.border-clr-palette-purple-primary { - border-color: var(--c--contextuals--border--palette--purple--primary); -} - -.border-thin-palette-purple-primary { - border: 1px solid var(--c--contextuals--border--palette--purple--primary); -} - -.border-clr-palette-purple-secondary { - border-color: var(--c--contextuals--border--palette--purple--secondary); -} - -.border-thin-palette-purple-secondary { - border: 1px solid var(--c--contextuals--border--palette--purple--secondary); -} - -.border-clr-palette-purple-tertiary { - border-color: var(--c--contextuals--border--palette--purple--tertiary); -} - -.border-thin-palette-purple-tertiary { - border: 1px solid var(--c--contextuals--border--palette--purple--tertiary); -} - -.border-clr-palette-pink-primary { - border-color: var(--c--contextuals--border--palette--pink--primary); -} - -.border-thin-palette-pink-primary { - border: 1px solid var(--c--contextuals--border--palette--pink--primary); -} - -.border-clr-palette-pink-secondary { - border-color: var(--c--contextuals--border--palette--pink--secondary); -} - -.border-thin-palette-pink-secondary { - border: 1px solid var(--c--contextuals--border--palette--pink--secondary); -} - -.border-clr-palette-pink-tertiary { - border-color: var(--c--contextuals--border--palette--pink--tertiary); -} - -.border-thin-palette-pink-tertiary { - border: 1px solid var(--c--contextuals--border--palette--pink--tertiary); -} - -.border-clr-palette-gray-primary { - border-color: var(--c--contextuals--border--palette--gray--primary); -} - -.border-thin-palette-gray-primary { - border: 1px solid var(--c--contextuals--border--palette--gray--primary); -} - -.border-clr-palette-gray-secondary { - border-color: var(--c--contextuals--border--palette--gray--secondary); -} - -.border-thin-palette-gray-secondary { - border: 1px solid var(--c--contextuals--border--palette--gray--secondary); -} - -.border-clr-palette-gray-tertiary { - border-color: var(--c--contextuals--border--palette--gray--tertiary); -} - -.border-thin-palette-gray-tertiary { - border: 1px solid var(--c--contextuals--border--palette--gray--tertiary); -} - .clr-content-logo1 { color: var(--c--contextuals--content--logo1); } @@ -7422,6 +7197,14 @@ color: var(--c--contextuals--content--logo2); } +.clr-content-semantic-contextual-primary { + color: var(--c--contextuals--content--semantic--contextual--primary); +} + +.clr-content-semantic-overlay-primary { + color: var(--c--contextuals--content--semantic--overlay--primary); +} + .clr-content-semantic-brand-primary { color: var(--c--contextuals--content--semantic--brand--primary); } @@ -7454,10 +7237,6 @@ color: var(--c--contextuals--content--semantic--neutral--on-neutral); } -.clr-content-semantic-contextual-primary { - color: var(--c--contextuals--content--semantic--contextual--primary); -} - .clr-content-semantic-info-primary { color: var(--c--contextuals--content--semantic--info--primary); } @@ -7534,130 +7313,42 @@ color: var(--c--contextuals--content--palette--brand--primary); } -.clr-content-palette-brand-secondary { - color: var(--c--contextuals--content--palette--brand--secondary); -} - -.clr-content-palette-brand-tertiary { - color: var(--c--contextuals--content--palette--brand--tertiary); -} - .clr-content-palette-red-primary { color: var(--c--contextuals--content--palette--red--primary); } -.clr-content-palette-red-secondary { - color: var(--c--contextuals--content--palette--red--secondary); -} - -.clr-content-palette-red-tertiary { - color: var(--c--contextuals--content--palette--red--tertiary); -} - .clr-content-palette-orange-primary { color: var(--c--contextuals--content--palette--orange--primary); } -.clr-content-palette-orange-secondary { - color: var(--c--contextuals--content--palette--orange--secondary); -} - -.clr-content-palette-orange-tertiary { - color: var(--c--contextuals--content--palette--orange--tertiary); -} - .clr-content-palette-brown-primary { color: var(--c--contextuals--content--palette--brown--primary); } -.clr-content-palette-brown-secondary { - color: var(--c--contextuals--content--palette--brown--secondary); -} - -.clr-content-palette-brown-tertiary { - color: var(--c--contextuals--content--palette--brown--tertiary); -} - .clr-content-palette-yellow-primary { color: var(--c--contextuals--content--palette--yellow--primary); } -.clr-content-palette-yellow-secondary { - color: var(--c--contextuals--content--palette--yellow--secondary); -} - -.clr-content-palette-yellow-tertiary { - color: var(--c--contextuals--content--palette--yellow--tertiary); -} - .clr-content-palette-green-primary { color: var(--c--contextuals--content--palette--green--primary); } -.clr-content-palette-green-secondary { - color: var(--c--contextuals--content--palette--green--secondary); -} - -.clr-content-palette-green-tertiary { - color: var(--c--contextuals--content--palette--green--tertiary); -} - .clr-content-palette-blue-1-primary { color: var(--c--contextuals--content--palette--blue-1--primary); } -.clr-content-palette-blue-1-secondary { - color: var(--c--contextuals--content--palette--blue-1--secondary); -} - -.clr-content-palette-blue-1-tertiary { - color: var(--c--contextuals--content--palette--blue-1--tertiary); -} - .clr-content-palette-blue-2-primary { color: var(--c--contextuals--content--palette--blue-2--primary); } -.clr-content-palette-blue-2-secondary { - color: var(--c--contextuals--content--palette--blue-2--secondary); -} - -.clr-content-palette-blue-2-tertiary { - color: var(--c--contextuals--content--palette--blue-2--tertiary); -} - .clr-content-palette-purple-primary { color: var(--c--contextuals--content--palette--purple--primary); } -.clr-content-palette-purple-secondary { - color: var(--c--contextuals--content--palette--purple--secondary); -} - -.clr-content-palette-purple-tertiary { - color: var(--c--contextuals--content--palette--purple--tertiary); -} - .clr-content-palette-pink-primary { color: var(--c--contextuals--content--palette--pink--primary); } -.clr-content-palette-pink-secondary { - color: var(--c--contextuals--content--palette--pink--secondary); -} - -.clr-content-palette-pink-tertiary { - color: var(--c--contextuals--content--palette--pink--tertiary); -} - .clr-content-palette-gray-primary { color: var(--c--contextuals--content--palette--gray--primary); } - -.clr-content-palette-gray-secondary { - color: var(--c--contextuals--content--palette--gray--secondary); -} - -.clr-content-palette-gray-tertiary { - color: var(--c--contextuals--content--palette--gray--tertiary); -} diff --git a/src/frontend/apps/impress/src/cunningham/cunningham-tokens.ts b/src/frontend/apps/impress/src/cunningham/cunningham-tokens.ts index e78eb58c..9b543da7 100644 --- a/src/frontend/apps/impress/src/cunningham/cunningham-tokens.ts +++ b/src/frontend/apps/impress/src/cunningham/cunningham-tokens.ts @@ -3,376 +3,339 @@ export const tokens = { default: { globals: { colors: { - 'logo-1': '#2845C1', - 'logo-2': '#377FDB', - 'logo-1-dark': '#95ABFF', - 'logo-2-dark': '#95ABFF', - 'brand-050': '#EDF0FF', - 'brand-100': '#DAE2FF', - 'brand-150': '#C8D3FF', - 'brand-200': '#B5C4FF', - 'brand-250': '#A2B6FF', - 'brand-300': '#90A7FF', - 'brand-350': '#7E98FF', - 'brand-400': '#6C89FE', - 'brand-450': '#5C7AF7', - 'brand-500': '#4C6CEF', - 'brand-550': '#3E5DE7', - 'brand-600': '#304DDF', - 'brand-650': '#2845C1', - 'brand-700': '#223E9E', - 'brand-750': '#1F367D', - 'brand-800': '#1B2E5F', - 'brand-850': '#172446', - 'brand-900': '#121B30', - 'brand-950': '#0C111A', + 'logo-1-light': '#4844AD', + 'logo-2-light': '#4844AD', + 'logo-1-dark': '#BEC5F0', + 'logo-2-dark': '#BEC5F0', + 'brand-050': '#EEF1FA', + 'brand-100': '#DDE2F5', + 'brand-150': '#CED3F1', + 'brand-200': '#BEC5F0', + 'brand-250': '#AFB5F1', + 'brand-300': '#A0A5F6', + 'brand-350': '#8F94FD', + 'brand-400': '#8184FC', + 'brand-450': '#7576EE', + 'brand-500': '#6969DF', + 'brand-550': '#5E5CD0', + 'brand-600': '#534FC2', + 'brand-650': '#4844AD', + 'brand-700': '#3E3B98', + 'brand-750': '#36347D', + 'brand-800': '#2D2F5F', + 'brand-850': '#262848', + 'brand-900': '#1C1E32', + 'brand-950': '#11131F', 'gray-000': '#FFFFFF', - 'gray-025': '#F6F8F9', - 'gray-050': '#EEF1F4', - 'gray-100': '#DFE2EA', - 'gray-150': '#CFD5DE', - 'gray-200': '#C1C7D3', - 'gray-250': '#B2B9C7', - 'gray-300': '#A4ABBC', - 'gray-350': '#969EB0', - 'gray-400': '#8891A4', - 'gray-450': '#7B8498', - 'gray-500': '#6D778C', - 'gray-550': '#626A80', - 'gray-600': '#555E74', - 'gray-650': '#4A5267', - 'gray-700': '#3F4759', - 'gray-750': '#363B4C', - 'gray-800': '#2B303D', - 'gray-850': '#222631', - 'gray-900': '#181B24', - 'gray-950': '#0F1117', + 'gray-025': '#F8F8F9', + 'gray-050': '#F0F0F3', + 'gray-100': '#E2E2EA', + 'gray-150': '#D3D4E0', + 'gray-200': '#C5C6D5', + 'gray-250': '#B7B7CB', + 'gray-300': '#A9A9BF', + 'gray-350': '#9C9CB2', + 'gray-400': '#8F8FA4', + 'gray-450': '#828297', + 'gray-500': '#75758A', + 'gray-550': '#69697D', + 'gray-600': '#5D5D70', + 'gray-650': '#515164', + 'gray-700': '#454558', + 'gray-750': '#3A3A4C', + 'gray-800': '#2F303D', + 'gray-850': '#25252F', + 'gray-900': '#1B1B23', + 'gray-950': '#111114', 'gray-1000': '#000000', - 'info-050': '#E7F2FF', - 'info-100': '#CFE5FF', - 'info-150': '#B7D7FF', - 'info-200': '#A0CAFE', - 'info-250': '#8CBCF9', - 'info-300': '#77AEF4', - 'info-350': '#63A0EE', - 'info-400': '#5092E7', - 'info-450': '#4185DC', - 'info-500': '#3677CC', - 'info-550': '#2F6ABB', - 'info-600': '#265EAA', - 'info-650': '#28528F', - 'info-700': '#274775', - 'info-750': '#243C5E', - 'info-800': '#20314A', - 'info-850': '#1B2637', - 'info-900': '#141C27', - 'info-950': '#0D1118', - 'success-050': '#DEF7E6', - 'success-100': '#BAEECF', - 'success-150': '#A5E2C0', - 'success-200': '#95D4B3', - 'success-250': '#85C6A7', - 'success-300': '#74B99B', - 'success-350': '#65AB8F', - 'success-400': '#579E84', - 'success-450': '#4B9079', - 'success-500': '#40836F', - 'success-550': '#367664', - 'success-600': '#2B695A', - 'success-650': '#2C5A50', - 'success-700': '#2A4D45', - 'success-750': '#26403C', - 'success-800': '#213430', - 'success-850': '#1B2826', - 'success-900': '#151D1C', - 'success-950': '#0D1212', - 'warning-050': '#FFEEDF', - 'warning-100': '#FFDCBE', - 'warning-150': '#FFCA9C', - 'warning-200': '#FFB778', - 'warning-250': '#FDA54F', - 'warning-300': '#F59425', - 'warning-350': '#E78613', - 'warning-400': '#D7790C', - 'warning-450': '#C86C08', - 'warning-500': '#B85F03', - 'warning-550': '#A75400', - 'warning-600': '#984800', - 'warning-650': '#814112', - 'warning-700': '#6C3A19', - 'warning-750': '#58321C', - 'warning-800': '#452A1A', - 'warning-850': '#352117', - 'warning-900': '#261813', - 'warning-950': '#170F0C', - 'error-050': '#FFEDEB', - 'error-100': '#FFDAD7', - 'error-150': '#FFC7C2', - 'error-200': '#FFB3AD', - 'error-250': '#FF9F99', - 'error-300': '#FF8984', - 'error-350': '#FF706E', - 'error-400': '#FB5759', - 'error-450': '#F63A45', - 'error-500': '#E32C39', - 'error-550': '#CF202D', - 'error-600': '#BD0F23', - 'error-650': '#9D2227', - 'error-700': '#812727', - 'error-750': '#672624', - 'error-800': '#512220', - 'error-850': '#3D1C1B', - 'error-900': '#2A1614', - 'error-950': '#190E0D', - 'red-050': '#FFEDEB', - 'red-100': '#FFDAD7', - 'red-150': '#FFC7C2', - 'red-200': '#FFB3AD', - 'red-250': '#FF9F99', - 'red-300': '#FF8984', - 'red-350': '#FF706E', - 'red-400': '#FB5759', - 'red-450': '#F63A45', - 'red-500': '#E32C39', - 'red-550': '#CF202D', - 'red-600': '#BD0F23', - 'red-650': '#9D2227', - 'red-700': '#812727', - 'red-750': '#672624', - 'red-800': '#512220', - 'red-850': '#3D1C1B', - 'red-900': '#2A1614', - 'red-950': '#190E0D', - 'orange-050': '#FCEDEB', - 'orange-100': '#F8DCD7', - 'orange-150': '#F1CCC5', - 'orange-200': '#EABCB4', - 'orange-250': '#E2ACA2', - 'orange-300': '#DA9C92', - 'orange-350': '#D28C81', - 'orange-400': '#CA7C70', - 'orange-450': '#BE6E62', - 'orange-500': '#AE6257', - 'orange-550': '#9E564D', - 'orange-600': '#8F4B42', - 'orange-650': '#79443D', - 'orange-700': '#643C37', - 'orange-750': '#513430', - 'orange-800': '#412B28', - 'orange-850': '#312220', - 'orange-900': '#231918', - 'orange-950': '#150F0F', - 'brown-050': '#F9EFEA', - 'brown-100': '#F3DFD3', - 'brown-150': '#EACFC1', - 'brown-200': '#E2BFAE', - 'brown-250': '#D8B19C', - 'brown-300': '#D0A189', - 'brown-350': '#C3937B', - 'brown-400': '#B5866D', - 'brown-450': '#A77A62', - 'brown-500': '#996D57', - 'brown-550': '#8B614D', - 'brown-600': '#7C5542', - 'brown-650': '#6A4C3C', - 'brown-700': '#594236', - 'brown-750': '#49382F', - 'brown-800': '#3B2E28', - 'brown-850': '#2D2420', - 'brown-900': '#201A18', - 'brown-950': '#13100F', - 'yellow-050': '#FDF1C5', - 'yellow-100': '#FBE18E', - 'yellow-150': '#F4D261', - 'yellow-200': '#EAC244', - 'yellow-250': '#DFB41B', - 'yellow-300': '#D1A516', - 'yellow-350': '#C49711', - 'yellow-400': '#B78A0C', - 'yellow-450': '#A87D07', - 'yellow-500': '#9B6F02', - 'yellow-550': '#8D6300', - 'yellow-600': '#7F5600', - 'yellow-650': '#6E4C11', - 'yellow-700': '#5D4219', - 'yellow-750': '#4D371B', - 'yellow-800': '#3D2E1A', - 'yellow-850': '#2F2417', - 'yellow-900': '#221A12', - 'yellow-950': '#14100C', - 'green-050': '#E7F9B3', - 'green-100': '#D5EC98', - 'green-150': '#C5DE86', - 'green-200': '#B5D174', - 'green-250': '#A5C464', - 'green-300': '#95B755', - 'green-350': '#85AA45', - 'green-400': '#769D39', - 'green-450': '#688F30', - 'green-500': '#5A8228', - 'green-550': '#4D7621', - 'green-600': '#416919', - 'green-650': '#3A5B20', - 'green-700': '#324E22', - 'green-750': '#2C4122', - 'green-800': '#24351D', - 'green-850': '#1D2919', - 'green-900': '#161E13', - 'green-950': '#0E120C', - 'blue-1-050': '#EBF1FF', - 'blue-1-100': '#D6E3FE', - 'blue-1-150': '#C2D5FE', - 'blue-1-200': '#ADC7FE', - 'blue-1-250': '#99B8FD', - 'blue-1-300': '#84AAFD', - 'blue-1-350': '#6F9BFD', - 'blue-1-400': '#5A8DFB', - 'blue-1-450': '#437DFC', - 'blue-1-500': '#3D71E4', - 'blue-1-550': '#3665CC', - 'blue-1-600': '#305AB5', - 'blue-1-650': '#315093', - 'blue-1-700': '#2E4675', - 'blue-1-750': '#293B5E', - 'blue-1-800': '#243048', - 'blue-1-850': '#1E2635', - 'blue-1-900': '#171C25', - 'blue-1-950': '#0E1116', - 'blue-2-050': '#E2F4F9', - 'blue-2-100': '#C5E9F3', - 'blue-2-150': '#A7DDED', - 'blue-2-200': '#88D1E6', - 'blue-2-250': '#68C5E0', - 'blue-2-300': '#48B8D9', - 'blue-2-350': '#3BAACA', - 'blue-2-400': '#359CB9', - 'blue-2-450': '#318EA9', - 'blue-2-500': '#2C8199', - 'blue-2-550': '#277389', - 'blue-2-600': '#236679', - 'blue-2-650': '#2A5866', - 'blue-2-700': '#2A4B55', - 'blue-2-750': '#283F47', - 'blue-2-800': '#233337', - 'blue-2-850': '#1D272A', - 'blue-2-900': '#161C1E', - 'blue-2-950': '#0E1112', - 'purple-050': '#F5EEFF', - 'purple-100': '#ECDCFF', - 'purple-150': '#E2CBFF', - 'purple-200': '#D9B9FF', - 'purple-250': '#D0A7FF', - 'purple-300': '#C894FE', - 'purple-350': '#BE83FA', - 'purple-400': '#B570F5', - 'purple-450': '#AB5EF0', - 'purple-500': '#A04BE8', - 'purple-550': '#933CDB', - 'purple-600': '#8530C8', - 'purple-650': '#7033A5', - 'purple-700': '#5D3185', - 'purple-750': '#4C2C6A', - 'purple-800': '#3C2652', - 'purple-850': '#2D203C', - 'purple-900': '#21182A', - 'purple-950': '#130F19', - 'pink-050': '#FFEBF6', - 'pink-100': '#FFD8ED', - 'pink-150': '#FCC4E3', - 'pink-200': '#F7B2D9', - 'pink-250': '#F29FCE', - 'pink-300': '#ED8CC3', - 'pink-350': '#E779B8', - 'pink-400': '#E264AD', - 'pink-450': '#D2579E', - 'pink-500': '#C24B8E', - 'pink-550': '#B0417F', - 'pink-600': '#9F3670', - 'pink-650': '#873560', - 'pink-700': '#6F3250', - 'pink-750': '#5A2C43', - 'pink-800': '#472635', - 'pink-850': '#351F29', - 'pink-900': '#26171D', - 'pink-950': '#170F12', - 'black-000': '#00000000', - 'black-050': '#0000000D', - 'black-100': '#0000001A', - 'black-150': '#00000026', - 'black-200': '#00000033', - 'black-250': '#00000040', - 'black-300': '#0000004D', - 'black-350': '#00000059', - 'black-400': '#00000066', - 'black-450': '#00000073', - 'black-500': '#00000080', - 'black-550': '#0000008C', - 'black-600': '#00000099', - 'black-650': '#000000A6', - 'black-700': '#000000B3', - 'black-750': '#000000BF', - 'black-800': '#000000CC', - 'black-850': '#000000D9', - 'black-900': '#000000E6', - 'black-950': '#000000F2', - 'white-000': '#FFFFFF', - 'white-050': '#FFFFFF0D', - 'white-100': '#FFFFFF1A', - 'white-150': '#FFFFFF26', - 'white-200': '#FFFFFF33', - 'white-250': '#FFFFFF40', - 'white-300': '#FFFFFF4D', - 'white-350': '#FFFFFF59', - 'white-400': '#FFFFFF66', - 'white-450': '#FFFFFF73', - 'white-500': '#FFFFFF80', - 'white-550': '#FFFFFF8C', - 'white-600': '#FFFFFF99', - 'white-650': '#FFFFFFA6', - 'white-700': '#FFFFFFB3', - 'white-750': '#FFFFFFBF', - 'white-800': '#FFFFFFCC', - 'white-850': '#FFFFFFD9', - 'white-900': '#FFFFFFE6', - 'white-950': '#FFFFFFF2', - 'blue1-050': '#E7F2FF', - 'blue1-100': '#CFE5FF', - 'blue1-150': '#B7D7FF', - 'blue1-200': '#A0CAFE', - 'blue1-250': '#8CBCF9', - 'blue1-300': '#77AEF4', - 'blue1-350': '#63A0EE', - 'blue1-400': '#5092E7', - 'blue1-450': '#4185DC', - 'blue1-500': '#3677CC', - 'blue1-550': '#2F6ABB', - 'blue1-600': '#265EAA', - 'blue1-650': '#28528F', - 'blue1-700': '#274775', - 'blue1-750': '#243C5E', - 'blue1-800': '#20314A', - 'blue1-850': '#1B2637', - 'blue1-900': '#141C27', - 'blue1-950': '#0D1118', - 'blue2-050': '#E2F4FD', - 'blue2-100': '#C4E8F8', - 'blue2-150': '#AADCF2', - 'blue2-200': '#93CFEB', - 'blue2-250': '#7CC2E2', - 'blue2-300': '#6CB4D6', - 'blue2-350': '#5CA7C9', - 'blue2-400': '#5099BC', - 'blue2-450': '#458BAE', - 'blue2-500': '#3A7EA0', - 'blue2-550': '#327191', - 'blue2-600': '#286483', - 'blue2-650': '#2B5770', - 'blue2-700': '#294A5E', - 'blue2-750': '#263E4D', - 'blue2-800': '#22323D', - 'blue2-850': '#1C272E', - 'blue2-900': '#151D21', - 'blue2-950': '#0E1114', + 'info-050': '#EAF2F9', + 'info-100': '#D5E4F3', + 'info-150': '#BFD7F0', + 'info-200': '#A7CAEE', + 'info-250': '#8DBDEF', + 'info-300': '#6EB0F2', + 'info-350': '#50A2F5', + 'info-400': '#3593F4', + 'info-450': '#1185ED', + 'info-500': '#0077DE', + 'info-550': '#0069CF', + 'info-600': '#005BC0', + 'info-650': '#0D4EAA', + 'info-700': '#124394', + 'info-750': '#163878', + 'info-800': '#192F5A', + 'info-850': '#192541', + 'info-900': '#141B2D', + 'info-950': '#0C111C', + 'success-050': '#E8F1EA', + 'success-100': '#CFE4D4', + 'success-150': '#BAD9C1', + 'success-200': '#A2CFAD', + 'success-250': '#86C597', + 'success-300': '#6CBA83', + 'success-350': '#4FB070', + 'success-400': '#40A363', + 'success-450': '#309556', + 'success-500': '#1E884A', + 'success-550': '#027B3E', + 'success-600': '#016D31', + 'success-650': '#006024', + 'success-700': '#005317', + 'success-750': '#0D4511', + 'success-800': '#11380E', + 'success-850': '#132A11', + 'success-900': '#101E0F', + 'success-950': '#091209', + 'warning-050': '#F8F0E9', + 'warning-100': '#F1E0D3', + 'warning-150': '#ECD0BC', + 'warning-200': '#E8C0A4', + 'warning-250': '#E8AE8A', + 'warning-300': '#EB9970', + 'warning-350': '#E98456', + 'warning-400': '#E57036', + 'warning-450': '#DA5E18', + 'warning-500': '#CB5000', + 'warning-550': '#BC4200', + 'warning-600': '#AD3300', + 'warning-650': '#9E2300', + 'warning-700': '#882011', + 'warning-750': '#731E16', + 'warning-800': '#58201A', + 'warning-850': '#401D18', + 'warning-900': '#2E1714', + 'warning-950': '#1D0F0D', + 'error-050': '#F9EFEC', + 'error-100': '#F4DFD9', + 'error-150': '#F0CEC6', + 'error-200': '#EEBCB2', + 'error-250': '#EEA99D', + 'error-300': '#EF9486', + 'error-350': '#F37C6E', + 'error-400': '#F65F53', + 'error-450': '#F0463D', + 'error-500': '#E82322', + 'error-550': '#D7010E', + 'error-600': '#C00100', + 'error-650': '#AA0000', + 'error-700': '#910C06', + 'error-750': '#731E16', + 'error-800': '#58201A', + 'error-850': '#401D18', + 'error-900': '#2E1714', + 'error-950': '#1D0F0D', + 'red-050': '#FAEFEE', + 'red-100': '#F4DEDD', + 'red-150': '#F1CDCB', + 'red-200': '#EFBBBA', + 'red-250': '#EEA8A8', + 'red-300': '#F09394', + 'red-350': '#F37B7E', + 'red-400': '#EF6569', + 'red-450': '#E94A55', + 'red-500': '#DA3B49', + 'red-550': '#CA2A3C', + 'red-600': '#BB1330', + 'red-650': '#A90021', + 'red-700': '#910A13', + 'red-750': '#731E16', + 'red-800': '#58201A', + 'red-850': '#411D18', + 'red-900': '#2E1714', + 'red-950': '#1D0F0D', + 'orange-050': '#F8F0E9', + 'orange-100': '#F1E0D3', + 'orange-150': '#ECD0BD', + 'orange-200': '#EABFA6', + 'orange-250': '#EBAC90', + 'orange-300': '#EC9772', + 'orange-350': '#E5845A', + 'orange-400': '#D6774D', + 'orange-450': '#C86A40', + 'orange-500': '#B95D33', + 'orange-550': '#AB5025', + 'orange-600': '#9D4315', + 'orange-650': '#8F3600', + 'orange-700': '#812900', + 'orange-750': '#6C2511', + 'orange-800': '#572017', + 'orange-850': '#401D18', + 'orange-900': '#2E1714', + 'orange-950': '#1D0F0D', + 'brown-050': '#F6F0E8', + 'brown-100': '#F1E0D3', + 'brown-150': '#EBD0BA', + 'brown-200': '#E2C0A6', + 'brown-250': '#D4B398', + 'brown-300': '#C6A58B', + 'brown-350': '#B8987E', + 'brown-400': '#AA8B71', + 'brown-450': '#9D7E65', + 'brown-500': '#8F7158', + 'brown-550': '#82654C', + 'brown-600': '#765841', + 'brown-650': '#694C35', + 'brown-700': '#5D412A', + 'brown-750': '#51361E', + 'brown-800': '#452A13', + 'brown-850': '#392008', + 'brown-900': '#29180A', + 'brown-950': '#1B0F08', + 'yellow-050': '#F3F0E7', + 'yellow-100': '#E9E2CF', + 'yellow-150': '#E1D4B7', + 'yellow-200': '#D9C599', + 'yellow-250': '#D2B677', + 'yellow-300': '#CAA756', + 'yellow-350': '#C2972E', + 'yellow-400': '#B98900', + 'yellow-450': '#AB7B00', + 'yellow-500': '#9D6E00', + 'yellow-550': '#916100', + 'yellow-600': '#855400', + 'yellow-650': '#784700', + 'yellow-700': '#6C3A00', + 'yellow-750': '#5F2E00', + 'yellow-800': '#512302', + 'yellow-850': '#3E1D10', + 'yellow-900': '#2D1711', + 'yellow-950': '#1D0F0D', + 'green-050': '#E6F1E9', + 'green-100': '#CFE4D5', + 'green-150': '#B8D8C1', + 'green-200': '#A0CFAE', + 'green-250': '#84C59A', + 'green-300': '#65BA86', + 'green-350': '#45B173', + 'green-400': '#23A562', + 'green-450': '#029755', + 'green-500': '#008948', + 'green-550': '#017B3B', + 'green-600': '#006E2E', + 'green-650': '#006022', + 'green-700': '#005314', + 'green-750': '#0D4510', + 'green-800': '#11380E', + 'green-850': '#132A11', + 'green-900': '#101E0F', + 'green-950': '#091209', + 'blue-1-050': '#EBF1F9', + 'blue-1-100': '#D6E4F4', + 'blue-1-150': '#C1D7F0', + 'blue-1-200': '#AACAEF', + 'blue-1-250': '#8FBCEF', + 'blue-1-300': '#7CAFEB', + 'blue-1-350': '#68A1E4', + 'blue-1-400': '#5B94D6', + 'blue-1-450': '#4E86C7', + 'blue-1-500': '#4279B9', + 'blue-1-550': '#356CAC', + 'blue-1-600': '#28609E', + 'blue-1-650': '#1B5390', + 'blue-1-700': '#0B4783', + 'blue-1-750': '#0F3C6E', + 'blue-1-800': '#133059', + 'blue-1-850': '#152641', + 'blue-1-900': '#121C2D', + 'blue-1-950': '#0B111C', + 'blue-2-050': '#E7F3F4', + 'blue-2-100': '#CEE7E9', + 'blue-2-150': '#B2DCE0', + 'blue-2-200': '#91D1D7', + 'blue-2-250': '#68C7D0', + 'blue-2-300': '#43BBC5', + 'blue-2-350': '#00AFBA', + 'blue-2-400': '#01A0AA', + 'blue-2-450': '#00929D', + 'blue-2-500': '#00848F', + 'blue-2-550': '#007682', + 'blue-2-600': '#016874', + 'blue-2-650': '#005B67', + 'blue-2-700': '#004E5A', + 'blue-2-750': '#00424E', + 'blue-2-800': '#003642', + 'blue-2-850': '#002A38', + 'blue-2-900': '#061E28', + 'blue-2-950': '#071219', + 'purple-050': '#F7F0F6', + 'purple-100': '#EEE0EE', + 'purple-150': '#E7D1E7', + 'purple-200': '#DBBFE4', + 'purple-250': '#D3AEE2', + 'purple-300': '#CB99E1', + 'purple-350': '#C188D9', + 'purple-400': '#B47BCB', + 'purple-450': '#A66EBD', + 'purple-500': '#9961AF', + 'purple-550': '#8B55A1', + 'purple-600': '#7E4894', + 'purple-650': '#723C87', + 'purple-700': '#633376', + 'purple-750': '#552A65', + 'purple-800': '#452551', + 'purple-850': '#35213D', + 'purple-900': '#261A2C', + 'purple-950': '#17111C', + 'pink-050': '#F8EFF4', + 'pink-100': '#F0DFEA', + 'pink-150': '#EACEDF', + 'pink-200': '#E9BBD1', + 'pink-250': '#E9A7C2', + 'pink-300': '#E095B4', + 'pink-350': '#D685A8', + 'pink-400': '#C7799B', + 'pink-450': '#B86C8D', + 'pink-500': '#AA5F80', + 'pink-550': '#9C5374', + 'pink-600': '#8E4767', + 'pink-650': '#813B5B', + 'pink-700': '#732E4F', + 'pink-750': '#632643', + 'pink-800': '#521F38', + 'pink-850': '#3E1C2B', + 'pink-900': '#2D171F', + 'pink-950': '#1C0E12', + 'black-000': '#1B1B2300', + 'black-050': '#1B1B230D', + 'black-100': '#1B1B231A', + 'black-150': '#1B1B2326', + 'black-200': '#1B1B2333', + 'black-250': '#1B1B2340', + 'black-300': '#1B1B234D', + 'black-350': '#1B1B2359', + 'black-400': '#1B1B2366', + 'black-450': '#1B1B2373', + 'black-500': '#1B1B2380', + 'black-550': '#1B1B238C', + 'black-600': '#1B1B2399', + 'black-650': '#1B1B23A6', + 'black-700': '#1B1B23B2', + 'black-750': '#1B1B23BF', + 'black-800': '#1B1B23CC', + 'black-850': '#1B1B23D9', + 'black-900': '#1B1B23E5', + 'black-950': '#111114F2', + 'white-000': '#F8F8F900', + 'white-050': '#F8F8F90D', + 'white-100': '#F8F8F91A', + 'white-150': '#F8F8F926', + 'white-200': '#F8F8F933', + 'white-250': '#F8F8F940', + 'white-300': '#F8F8F94D', + 'white-350': '#F8F8F959', + 'white-400': '#F8F8F966', + 'white-450': '#F8F8F973', + 'white-500': '#F8F8F980', + 'white-550': '#F8F8F98C', + 'white-600': '#F8F8F999', + 'white-650': '#F8F8F9A6', + 'white-700': '#F8F8F9B2', + 'white-750': '#F8F8F9BF', + 'white-800': '#F8F8F9CC', + 'white-850': '#F8F8F9D9', + 'white-900': '#F8F8F9E5', + 'white-950': '#F8F8F9F2', + 'white-975': '#F8F8F9F9', }, transitions: { 'ease-in': 'cubic-bezier(0.32, 0, 0.67, 0)', @@ -411,7 +374,10 @@ export const tokens = { extrabold: 800, black: 900, }, - families: { base: 'sans-serif', accent: 'sans-serif' }, + families: { + base: 'Hanken Grotesk, Inter, Roboto Flex Variable, sans-serif', + accent: 'Hanken Grotesk, Inter, Roboto Flex Variable, sans-serif', + }, }, spacings: { '0': '0', @@ -422,6 +388,8 @@ export const tokens = { t: '0.5rem', st: '0.25rem', '4xs': '0.125rem', + '3xs': '0.25rem', + '2xs': '0.375rem', xxxs: '0.25rem', xxs: '0.375rem', xs: '0.5rem', @@ -432,6 +400,8 @@ export const tokens = { xl: '2.5rem', xxl: '3rem', xxxl: '3.5rem', + '2xl': '3rem', + '3xl': '3.5rem', '4xl': '4rem', '5xl': '4.5rem', '6xl': '6rem', @@ -440,8 +410,6 @@ export const tokens = { auto: 'auto', bx: '2.2rem', full: '100%', - '3xs': '0.25rem', - '2xs': '0.375rem', }, breakpoints: { xs: '480px', @@ -454,324 +422,234 @@ export const tokens = { mobile: '768px', tablet: '1024px', }, + spacing: { + '0': '0rem', + none: '0rem', + auto: 'auto', + bx: '2.2rem', + full: '100%', + '3xs': '0.25rem', + '2xs': '0.375rem', + }, }, contextuals: { background: { surface: { primary: '#FFFFFF', secondary: '#FFFFFF', - tertiary: '#F6F8F9', + tertiary: '#F8F8F9', }, semantic: { + overlay: { primary: '#1B1B230D', 'primary-hover': '#1B1B231A' }, + contextual: { primary: '#1B1B230D', 'primary-hover': '#1B1B231A' }, brand: { - primary: '#3E5DE7', - 'primary-hover': '#2845C1', - secondary: '#DAE2FF', - 'secondary-hover': '#C8D3FF', - tertiary: '#EDF0FF', - 'tertiary-hover': '#DAE2FF', + primary: '#5E5CD0', + 'primary-hover': '#4844AD', + secondary: '#DDE2F5', + 'secondary-hover': '#CED3F1', + tertiary: '#EEF1FA', + 'tertiary-hover': '#DDE2F5', }, neutral: { - primary: '#626A80', - 'primary-hover': '#4A5267', - secondary: '#DFE2EA', - 'secondary-hover': '#CFD5DE', - tertiary: '#EEF1F4', - 'tertiary-hover': '#DFE2EA', + primary: '#69697D', + 'primary-hover': '#515164', + secondary: '#E2E2EA', + 'secondary-hover': '#D3D4E0', + tertiary: '#F0F0F3', + 'tertiary-hover': '#E2E2EA', }, - contextual: { primary: '#0000000D', 'primary-hover': '#0000001A' }, info: { - primary: '#2F6ABB', - 'primary-hover': '#28528F', - secondary: '#CFE5FF', - 'secondary-hover': '#B7D7FF', - tertiary: '#E7F2FF', - 'tertiary-hover': '#CFE5FF', + primary: '#0069CF', + 'primary-hover': '#0D4EAA', + secondary: '#D5E4F3', + 'secondary-hover': '#BFD7F0', + tertiary: '#EAF2F9', + 'tertiary-hover': '#D5E4F3', }, success: { - primary: '#367664', - 'primary-hover': '#2C5A50', - secondary: '#BAEECF', - 'secondary-hover': '#A5E2C0', - tertiary: '#DEF7E6', - 'tertiary-hover': '#BAEECF', + primary: '#027B3E', + 'primary-hover': '#006024', + secondary: '#CFE4D4', + 'secondary-hover': '#BAD9C1', + tertiary: '#E8F1EA', + 'tertiary-hover': '#CFE4D4', }, warning: { - primary: '#A75400', - 'primary-hover': '#814112', - secondary: '#FFDCBE', - 'secondary-hover': '#FFCA9C', - tertiary: '#FFEEDF', - 'tertiary-hover': '#FFDCBE', + primary: '#BC4200', + 'primary-hover': '#9E2300', + secondary: '#F1E0D3', + 'secondary-hover': '#ECD0BC', + tertiary: '#F8F0E9', + 'tertiary-hover': '#F1E0D3', }, error: { - primary: '#CF202D', - 'primary-hover': '#9D2227', - secondary: '#FFDAD7', - 'secondary-hover': '#FFC7C2', - tertiary: '#FFEDEB', - 'tertiary-hover': '#FFDAD7', + primary: '#D7010E', + 'primary-hover': '#AA0000', + secondary: '#F4DFD9', + 'secondary-hover': '#F0CEC6', + tertiary: '#F9EFEC', + 'tertiary-hover': '#F4DFD9', }, - disabled: { primary: '#DFE2EA', secondary: '#EEF1F4' }, + disabled: { primary: '#E2E2EA', secondary: '#F0F0F3' }, }, palette: { brand: { - primary: '#4C6CEF', - secondary: '#7E98FF', - tertiary: '#C8D3FF', + primary: '#6969DF', + secondary: '#8F94FD', + tertiary: '#CED3F1', }, red: { - primary: '#E32C39', - secondary: '#FF706E', - tertiary: '#FFC7C2', + primary: '#DA3B49', + secondary: '#F37B7E', + tertiary: '#F1CDCB', }, orange: { - primary: '#AE6257', - secondary: '#D28C81', - tertiary: '#F1CCC5', + primary: '#B95D33', + secondary: '#E5845A', + tertiary: '#ECD0BD', }, brown: { - primary: '#996D57', - secondary: '#C3937B', - tertiary: '#EACFC1', + primary: '#8F7158', + secondary: '#B8987E', + tertiary: '#EBD0BA', }, yellow: { - primary: '#9B6F02', - secondary: '#C49711', - tertiary: '#F4D261', + primary: '#9D6E00', + secondary: '#C2972E', + tertiary: '#E1D4B7', }, green: { - primary: '#5A8228', - secondary: '#85AA45', - tertiary: '#C5DE86', + primary: '#008948', + secondary: '#45B173', + tertiary: '#B8D8C1', }, 'blue-1': { - primary: '#3D71E4', - secondary: '#6F9BFD', - tertiary: '#C2D5FE', + primary: '#4279B9', + secondary: '#68A1E4', + tertiary: '#C1D7F0', }, 'blue-2': { - primary: '#2C8199', - secondary: '#3BAACA', - tertiary: '#A7DDED', + primary: '#00848F', + secondary: '#00AFBA', + tertiary: '#B2DCE0', }, purple: { - primary: '#A04BE8', - secondary: '#BE83FA', - tertiary: '#E2CBFF', + primary: '#9961AF', + secondary: '#C188D9', + tertiary: '#E7D1E7', }, pink: { - primary: '#C24B8E', - secondary: '#E779B8', - tertiary: '#FCC4E3', + primary: '#AA5F80', + secondary: '#D685A8', + tertiary: '#EACEDF', }, gray: { - primary: '#6D778C', - secondary: '#969EB0', - tertiary: '#CFD5DE', + primary: '#75758A', + secondary: '#9C9CB2', + tertiary: '#D3D4E0', }, }, - text: { primary: '#0000000D' }, }, content: { - logo1: '#2845C1', - logo2: '#377FDB', + logo1: '#4844AD', + logo2: '#4844AD', semantic: { + contextual: { primary: '#F8F8F9F2' }, + overlay: { primary: '#F8F8F9F2' }, brand: { - primary: '#223E9E', - secondary: '#304DDF', - tertiary: '#4C6CEF', - 'on-brand': '#EDF0FF', + primary: '#3E3B98', + secondary: '#534FC2', + tertiary: '#5E5CD0', + 'on-brand': '#EEF1FA', }, neutral: { - primary: '#222631', - secondary: '#555E74', - tertiary: '#6D778C', - 'on-neutral': '#EEF1F4', + primary: '#25252F', + secondary: '#5D5D70', + tertiary: '#69697D', + 'on-neutral': '#F0F0F3', }, - contextual: { primary: '#FFFFFFF2' }, info: { - primary: '#274775', - secondary: '#265EAA', - tertiary: '#3677CC', - 'on-info': '#E7F2FF', + primary: '#124394', + secondary: '#005BC0', + tertiary: '#0069CF', + 'on-info': '#EAF2F9', }, success: { - primary: '#2A4D45', - secondary: '#2B695A', - tertiary: '#40836F', - 'on-success': '#DEF7E6', + primary: '#005317', + secondary: '#016D31', + tertiary: '#027B3E', + 'on-success': '#E8F1EA', }, warning: { - primary: '#6C3A19', - secondary: '#984800', - tertiary: '#B85F03', - 'on-warning': '#FFEEDF', + primary: '#882011', + secondary: '#AD3300', + tertiary: '#BC4200', + 'on-warning': '#F8F0E9', }, error: { - primary: '#812727', - secondary: '#BD0F23', - tertiary: '#E32C39', - 'on-error': '#FFEDEB', + primary: '#910C06', + secondary: '#C00100', + tertiary: '#D7010E', + 'on-error': '#F9EFEC', }, - disabled: { primary: '#A4ABBC', secondary: '#FFFFFF80' }, + disabled: { primary: '#A9A9BF', secondary: '#F8F8F980' }, }, palette: { - brand: { - primary: '#4C6CEF', - secondary: '#7E98FF', - tertiary: '#C8D3FF', - }, - red: { - primary: '#E32C39', - secondary: '#FF706E', - tertiary: '#FFC7C2', - }, - orange: { - primary: '#AE6257', - secondary: '#D28C81', - tertiary: '#F1CCC5', - }, - brown: { - primary: '#996D57', - secondary: '#C3937B', - tertiary: '#EACFC1', - }, - yellow: { - primary: '#9B6F02', - secondary: '#C49711', - tertiary: '#F4D261', - }, - green: { - primary: '#5A8228', - secondary: '#85AA45', - tertiary: '#C5DE86', - }, - 'blue-1': { - primary: '#3D71E4', - secondary: '#6F9BFD', - tertiary: '#C2D5FE', - }, - 'blue-2': { - primary: '#2C8199', - secondary: '#3BAACA', - tertiary: '#A7DDED', - }, - purple: { - primary: '#A04BE8', - secondary: '#BE83FA', - tertiary: '#E2CBFF', - }, - pink: { - primary: '#C24B8E', - secondary: '#E779B8', - tertiary: '#FCC4E3', - }, - gray: { - primary: '#6D778C', - secondary: '#969EB0', - tertiary: '#CFD5DE', - }, + brand: { primary: '#6969DF' }, + red: { primary: '#DA3B49' }, + orange: { primary: '#B95D33' }, + brown: { primary: '#8F7158' }, + yellow: { primary: '#9D6E00' }, + green: { primary: '#008948' }, + 'blue-1': { primary: '#4279B9' }, + 'blue-2': { primary: '#00848F' }, + purple: { primary: '#9961AF' }, + pink: { primary: '#AA5F80' }, + gray: { primary: '#75758A' }, }, }, border: { - surface: { primary: '#DFE2EA' }, + surface: { primary: '#E2E2EA' }, semantic: { + contextual: { primary: '#F8F8F933' }, + overlay: { primary: '#F8F8F933' }, brand: { - primary: '#3E5DE7', - secondary: '#90A7FF', - tertiary: '#C8D3FF', + primary: '#5E5CD0', + secondary: '#A0A5F6', + tertiary: '#CED3F1', }, - contextual: { primary: '#FFFFFF33' }, neutral: { - primary: '#626A80', - secondary: '#A4ABBC', - tertiary: '#CFD5DE', + primary: '#69697D', + secondary: '#A9A9BF', + tertiary: '#D3D4E0', }, info: { - primary: '#2F6ABB', - secondary: '#77AEF4', - tertiary: '#B7D7FF', + primary: '#0069CF', + secondary: '#6EB0F2', + tertiary: '#BFD7F0', }, success: { - primary: '#367664', - secondary: '#74B99B', - tertiary: '#A5E2C0', + primary: '#027B3E', + secondary: '#6CBA83', + tertiary: '#BAD9C1', }, warning: { - primary: '#A75400', - secondary: '#F59425', - tertiary: '#FFCA9C', + primary: '#BC4200', + secondary: '#EB9970', + tertiary: '#ECD0BC', }, error: { - primary: '#CF202D', - secondary: '#FF8984', - tertiary: '#FFC7C2', - }, - disabled: { primary: '#DFE2EA' }, - }, - palette: { - brand: { - primary: '#4C6CEF', - secondary: '#7E98FF', - tertiary: '#C8D3FF', - }, - red: { - primary: '#E32C39', - secondary: '#FF706E', - tertiary: '#FFC7C2', - }, - orange: { - primary: '#AE6257', - secondary: '#D28C81', - tertiary: '#F1CCC5', - }, - brown: { - primary: '#996D57', - secondary: '#C3937B', - tertiary: '#EACFC1', - }, - yellow: { - primary: '#9B6F02', - secondary: '#C49711', - tertiary: '#F4D261', - }, - green: { - primary: '#5A8228', - secondary: '#85AA45', - tertiary: '#C5DE86', - }, - 'blue-1': { - primary: '#3D71E4', - secondary: '#6F9BFD', - tertiary: '#C2D5FE', - }, - 'blue-2': { - primary: '#2C8199', - secondary: '#3BAACA', - tertiary: '#A7DDED', - }, - purple: { - primary: '#A04BE8', - secondary: '#BE83FA', - tertiary: '#E2CBFF', - }, - pink: { - primary: '#C24B8E', - secondary: '#E779B8', - tertiary: '#FCC4E3', - }, - gray: { - primary: '#6D778C', - secondary: '#969EB0', - tertiary: '#CFD5DE', + primary: '#D7010E', + secondary: '#EF9486', + tertiary: '#F0CEC6', }, + disabled: { primary: '#E2E2EA' }, }, }, }, components: { modal: { 'width-small': '342px' }, - tooltip: { padding: '4px 8px', 'background-color': '#EEF1F4' }, + tooltip: { padding: '4px 8px' }, button: { 'medium-height': '40px', 'medium-text-height': '40px', @@ -780,10 +658,10 @@ export const tokens = { 'border-radius--focus': '4px', }, datagrid: { - 'header--color': '#222631', + 'header--color': '#25252F', 'header--size': '12px', 'header--weight': '500', - 'body--background-color-hover': '#EEF1F4', + 'body--background-color-hover': '#F0F0F3', }, 'forms-checkbox': { 'font-size': '0.875rem' }, badge: { @@ -791,12 +669,12 @@ export const tokens = { 'border-radius': '12px', 'padding-inline': '0.5rem', 'padding-block': '0.375rem', - accent: { 'background-color': '#DAE2FF', color: '#304DDF' }, - neutral: { 'background-color': '#DFE2EA', color: '#555E74' }, - danger: { 'background-color': '#FFDAD7', color: '#BD0F23' }, - success: { 'background-color': '#BAEECF', color: '#2B695A' }, - warning: { 'background-color': '#FFDCBE', color: '#984800' }, - info: { 'background-color': '#CFE5FF', color: '#265EAA' }, + accent: { 'background-color': '#DDE2F5', color: '#534FC2' }, + neutral: { 'background-color': '#E2E2EA', color: '#5D5D70' }, + danger: { 'background-color': '#F4DFD9', color: '#C00100' }, + success: { 'background-color': '#CFE4D4', color: '#016D31' }, + warning: { 'background-color': '#F1E0D3', color: '#AD3300' }, + info: { 'background-color': '#D5E4F3', color: '#005BC0' }, }, logo: { src: '', alt: '', widthHeader: '', widthFooter: '' }, 'la-gaufre': false, @@ -811,10 +689,10 @@ export const tokens = { dark: { globals: { colors: { - 'logo-1': '#377FDB', - 'logo-2': '#377FDB', - 'logo-1-dark': '#95ABFF', - 'logo-2-dark': '#95ABFF', + 'logo-1-light': '#377FDB', + 'logo-2-light': '#377FDB', + 'logo-1-dark': '#C1D6F2', + 'logo-2-dark': '#C1D6F2', 'brand-050': '#EAF1FB', 'brand-100': '#D5E4F7', 'brand-150': '#C0D6F4', @@ -1103,46 +981,47 @@ export const tokens = { 'pink-850': '#332028', 'pink-900': '#24181D', 'pink-950': '#160F12', - 'black-000': '#00000000', - 'black-050': '#0000000D', - 'black-100': '#0000001A', - 'black-150': '#00000026', - 'black-200': '#00000033', - 'black-250': '#00000040', - 'black-300': '#0000004D', - 'black-350': '#00000059', - 'black-400': '#00000066', - 'black-450': '#00000073', - 'black-500': '#00000080', - 'black-550': '#0000008C', - 'black-600': '#00000099', - 'black-650': '#000000A6', - 'black-700': '#000000B3', - 'black-750': '#000000BF', - 'black-800': '#000000CC', - 'black-850': '#000000D9', - 'black-900': '#000000E6', - 'black-950': '#000000F2', - 'white-000': '#FFFFFF', - 'white-050': '#FFFFFF0D', - 'white-100': '#FFFFFF1A', - 'white-150': '#FFFFFF26', - 'white-200': '#FFFFFF33', - 'white-250': '#FFFFFF40', - 'white-300': '#FFFFFF4D', - 'white-350': '#FFFFFF59', - 'white-400': '#FFFFFF66', - 'white-450': '#FFFFFF73', - 'white-500': '#FFFFFF80', - 'white-550': '#FFFFFF8C', - 'white-600': '#FFFFFF99', - 'white-650': '#FFFFFFA6', - 'white-700': '#FFFFFFB3', - 'white-750': '#FFFFFFBF', - 'white-800': '#FFFFFFCC', - 'white-850': '#FFFFFFD9', - 'white-900': '#FFFFFFE6', - 'white-950': '#FFFFFFF2', + 'black-000': '#1B1C1D00', + 'black-050': '#1B1C1D0D', + 'black-100': '#1B1C1D1A', + 'black-150': '#1B1C1D26', + 'black-200': '#1B1C1D33', + 'black-250': '#1B1C1D40', + 'black-300': '#1B1C1D4D', + 'black-350': '#1B1C1D59', + 'black-400': '#1B1C1D66', + 'black-450': '#1B1C1D73', + 'black-500': '#1B1C1D80', + 'black-550': '#1B1C1D8C', + 'black-600': '#1B1C1D99', + 'black-650': '#1B1C1DA6', + 'black-700': '#1B1C1DB2', + 'black-750': '#1B1C1DBF', + 'black-800': '#1B1C1DCC', + 'black-850': '#1B1C1DD9', + 'black-900': '#1B1C1DE5', + 'black-950': '#101112F2', + 'white-000': '#F7F8F800', + 'white-050': '#F7F8F80D', + 'white-100': '#F7F8F81A', + 'white-150': '#F7F8F826', + 'white-200': '#F7F8F833', + 'white-250': '#F7F8F840', + 'white-300': '#F7F8F84D', + 'white-350': '#F7F8F859', + 'white-400': '#F7F8F866', + 'white-450': '#F7F8F873', + 'white-500': '#F7F8F880', + 'white-550': '#F7F8F88C', + 'white-600': '#F7F8F899', + 'white-650': '#F7F8F8A6', + 'white-700': '#F7F8F8B2', + 'white-750': '#F7F8F8BF', + 'white-800': '#F7F8F8CC', + 'white-850': '#F7F8F8D9', + 'white-900': '#F7F8F8E5', + 'white-950': '#F7F8F8F2', + 'white-975': '#F7F8F8F9', }, transitions: { 'ease-in': 'cubic-bezier(0.32, 0, 0.67, 0)', @@ -1194,6 +1073,8 @@ export const tokens = { t: '0.5rem', st: '0.25rem', '4xs': '0.125rem', + '3xs': '0.25rem', + '2xs': '0.375rem', xxxs: '0.25rem', xxs: '0.375rem', xs: '0.5rem', @@ -1204,13 +1085,15 @@ export const tokens = { xl: '2.5rem', xxl: '3rem', xxxl: '3.5rem', + '2xl': '3rem', + '3xl': '3.5rem', '4xl': '4rem', '5xl': '4.5rem', '6xl': '6rem', '7xl': '7.5rem', }, breakpoints: { - xs: 0, + xs: '0px', sm: '576px', md: '768px', lg: '992px', @@ -1221,332 +1104,874 @@ export const tokens = { contextuals: { background: { surface: { - primary: '#2B303D', - secondary: '#222631', - tertiary: '#181B24', + primary: '#2F303D', + secondary: '#25252F', + tertiary: '#1B1B23', }, semantic: { + contextual: { primary: '#F8F8F90D', 'primary-hover': '#F8F8F91A' }, + overlay: { primary: '#F8F8F90D', 'primary-hover': '#F8F8F91A' }, brand: { - primary: '#3E5DE7', - 'primary-hover': '#2845C1', - secondary: '#223E9E', - 'secondary-hover': '#1F367D', - tertiary: '#1F367D', - 'tertiary-hover': '#1B2E5F', + primary: '#5E5CD0', + 'primary-hover': '#4844AD', + secondary: '#3E3B98', + 'secondary-hover': '#36347D', + tertiary: '#36347D', + 'tertiary-hover': '#2D2F5F', }, neutral: { - primary: '#626A80', - 'primary-hover': '#4A5267', - secondary: '#3F4759', - 'secondary-hover': '#363B4C', - tertiary: '#363B4C', - 'tertiary-hover': '#2B303D', + primary: '#69697D', + 'primary-hover': '#515164', + secondary: '#454558', + 'secondary-hover': '#3A3A4C', + tertiary: '#3A3A4C', + 'tertiary-hover': '#2F303D', }, - contextual: { primary: '#FFFFFF0D', 'primary-hover': '#FFFFFF1A' }, info: { - primary: '#2F6ABB', - 'primary-hover': '#28528F', - secondary: '#274775', - 'secondary-hover': '#243C5E', - tertiary: '#243C5E', - 'tertiary-hover': '#20314A', + primary: '#0069CF', + 'primary-hover': '#0D4EAA', + secondary: '#124394', + 'secondary-hover': '#163878', + tertiary: '#163878', + 'tertiary-hover': '#192F5A', }, success: { - primary: '#367664', - 'primary-hover': '#2C5A50', - secondary: '#2A4D45', - 'secondary-hover': '#26403C', - tertiary: '#26403C', - 'tertiary-hover': '#213430', + primary: '#027B3E', + 'primary-hover': '#006024', + secondary: '#005317', + 'secondary-hover': '#0D4511', + tertiary: '#0D4511', + 'tertiary-hover': '#11380E', }, warning: { - primary: '#A75400', - 'primary-hover': '#814112', - secondary: '#6C3A19', - 'secondary-hover': '#58321C', - tertiary: '#58321C', - 'tertiary-hover': '#452A1A', + primary: '#BC4200', + 'primary-hover': '#9E2300', + secondary: '#882011', + 'secondary-hover': '#731E16', + tertiary: '#731E16', + 'tertiary-hover': '#58201A', }, error: { - primary: '#CF202D', - 'primary-hover': '#9D2227', - secondary: '#812727', - 'secondary-hover': '#672624', - tertiary: '#672624', - 'tertiary-hover': '#512220', + primary: '#D7010E', + 'primary-hover': '#AA0000', + secondary: '#910C06', + 'secondary-hover': '#731E16', + tertiary: '#731E16', + 'tertiary-hover': '#58201A', }, - disabled: { primary: '#363B4C', secondary: '#2B303D' }, + disabled: { primary: '#3A3A4C', secondary: '#2F303D' }, }, palette: { brand: { - primary: '#7E98FF', - secondary: '#5C7AF7', - tertiary: '#3E5DE7', + primary: '#8F94FD', + secondary: '#7576EE', + tertiary: '#5E5CD0', }, red: { - primary: '#FF706E', - secondary: '#F63A45', - tertiary: '#CF202D', + primary: '#F37B7E', + secondary: '#E94A55', + tertiary: '#CA2A3C', }, orange: { - primary: '#D28C81', - secondary: '#BE6E62', - tertiary: '#9E564D', + primary: '#E5845A', + secondary: '#C86A40', + tertiary: '#AB5025', }, brown: { - primary: '#C3937B', - secondary: '#A77A62', - tertiary: '#8B614D', + primary: '#B8987E', + secondary: '#9D7E65', + tertiary: '#82654C', }, yellow: { - primary: '#C49711', - secondary: '#A87D07', - tertiary: '#8D6300', + primary: '#C2972E', + secondary: '#AB7B00', + tertiary: '#916100', }, green: { - primary: '#85AA45', - secondary: '#688F30', - tertiary: '#4D7621', + primary: '#45B173', + secondary: '#029755', + tertiary: '#017B3B', }, 'blue-1': { - primary: '#6F9BFD', - secondary: '#437DFC', - tertiary: '#3665CC', + primary: '#68A1E4', + secondary: '#4E86C7', + tertiary: '#356CAC', }, 'blue-2': { - primary: '#3BAACA', - secondary: '#318EA9', - tertiary: '#277389', + primary: '#00AFBA', + secondary: '#00929D', + tertiary: '#007682', }, purple: { - primary: '#BE83FA', - secondary: '#AB5EF0', - tertiary: '#933CDB', + primary: '#C188D9', + secondary: '#A66EBD', + tertiary: '#8B55A1', }, pink: { - primary: '#E779B8', - secondary: '#D2579E', - tertiary: '#B0417F', + primary: '#D685A8', + secondary: '#B86C8D', + tertiary: '#9C5374', }, gray: { - primary: '#969EB0', - secondary: '#7B8498', - tertiary: '#626A80', + primary: '#9C9CB2', + secondary: '#828297', + tertiary: '#69697D', }, }, }, content: { - logo1: '#95ABFF', - logo2: '#95ABFF', + logo1: '#BEC5F0', + logo2: '#BEC5F0', semantic: { + contextual: { primary: '#1B1B23D9' }, + overlay: { primary: '#1B1B23D9' }, brand: { - primary: '#EDF0FF', - secondary: '#DAE2FF', - tertiary: '#A2B6FF', - 'on-brand': '#EDF0FF', + primary: '#EEF1FA', + secondary: '#DDE2F5', + tertiary: '#AFB5F1', + 'on-brand': '#EEF1FA', }, neutral: { - primary: '#EEF1F4', - secondary: '#DFE2EA', - tertiary: '#B2B9C7', - 'on-neutral': '#EEF1F4', + primary: '#F0F0F3', + secondary: '#E2E2EA', + tertiary: '#B7B7CB', + 'on-neutral': '#F0F0F3', }, - contextual: { primary: '#000000D9' }, info: { - primary: '#E7F2FF', - secondary: '#CFE5FF', - tertiary: '#8CBCF9', - 'on-info': '#E7F2FF', + primary: '#EAF2F9', + secondary: '#D5E4F3', + tertiary: '#8DBDEF', + 'on-info': '#EAF2F9', }, success: { - primary: '#DEF7E6', - secondary: '#BAEECF', - tertiary: '#85C6A7', - 'on-success': '#DEF7E6', + primary: '#E8F1EA', + secondary: '#CFE4D4', + tertiary: '#86C597', + 'on-success': '#E8F1EA', }, warning: { - primary: '#FFEEDF', - secondary: '#FFDCBE', - tertiary: '#FDA54F', - 'on-warning': '#FFEEDF', + primary: '#F8F0E9', + secondary: '#F1E0D3', + tertiary: '#E8AE8A', + 'on-warning': '#F8F0E9', }, error: { - primary: '#FFEDEB', - secondary: '#FFDAD7', - tertiary: '#FF9F99', - 'on-error': '#FFEDEB', + primary: '#F9EFEC', + secondary: '#F4DFD9', + tertiary: '#EEA99D', + 'on-error': '#F9EFEC', }, - disabled: { primary: '#555E74', secondary: '#0000004D' }, + disabled: { primary: '#5D5D70', secondary: '#1B1B234D' }, }, palette: { - brand: { - primary: '#7E98FF', - secondary: '#5C7AF7', - tertiary: '#3E5DE7', - }, - red: { - primary: '#FF706E', - secondary: '#F63A45', - tertiary: '#CF202D', - }, - orange: { - primary: '#D28C81', - secondary: '#BE6E62', - tertiary: '#9E564D', - }, - brown: { - primary: '#C3937B', - secondary: '#A77A62', - tertiary: '#8B614D', - }, - yellow: { - primary: '#C49711', - secondary: '#A87D07', - tertiary: '#8D6300', - }, - green: { - primary: '#85AA45', - secondary: '#688F30', - tertiary: '#4D7621', - }, - 'blue-1': { - primary: '#6F9BFD', - secondary: '#437DFC', - tertiary: '#3665CC', - }, - 'blue-2': { - primary: '#3BAACA', - secondary: '#318EA9', - tertiary: '#277389', - }, - purple: { - primary: '#BE83FA', - secondary: '#AB5EF0', - tertiary: '#933CDB', - }, - pink: { - primary: '#E779B8', - secondary: '#D2579E', - tertiary: '#B0417F', - }, - gray: { - primary: '#969EB0', - secondary: '#7B8498', - tertiary: '#626A80', - }, + brand: { primary: '#6969DF' }, + red: { primary: '#DA3B49' }, + orange: { primary: '#B95D33' }, + brown: { primary: '#8F7158' }, + yellow: { primary: '#9D6E00' }, + green: { primary: '#008948' }, + 'blue-1': { primary: '#4279B9' }, + 'blue-2': { primary: '#00848F' }, + purple: { primary: '#9961AF' }, + pink: { primary: '#AA5F80' }, + gray: { primary: '#75758A' }, }, }, border: { - surface: { primary: '#363B4C' }, + surface: { primary: '#3A3A4C' }, semantic: { + contextual: { primary: '#1B1B2333' }, + overlay: { primary: '#1B1B2333' }, brand: { - primary: '#5C7AF7', - secondary: '#304DDF', - tertiary: '#223E9E', + primary: '#7576EE', + secondary: '#534FC2', + tertiary: '#3E3B98', }, - contextual: { primary: '#00000033' }, neutral: { - primary: '#7B8498', - secondary: '#555E74', - tertiary: '#3F4759', + primary: '#828297', + secondary: '#5D5D70', + tertiary: '#454558', }, info: { - primary: '#4185DC', - secondary: '#265EAA', - tertiary: '#274775', + primary: '#1185ED', + secondary: '#005BC0', + tertiary: '#124394', }, success: { - primary: '#4B9079', - secondary: '#2B695A', - tertiary: '#2A4D45', + primary: '#309556', + secondary: '#016D31', + tertiary: '#005317', }, warning: { - primary: '#C86C08', - secondary: '#984800', - tertiary: '#6C3A19', + primary: '#DA5E18', + secondary: '#AD3300', + tertiary: '#882011', }, error: { - primary: '#F63A45', - secondary: '#BD0F23', - tertiary: '#812727', - }, - disabled: { primary: '#2B303D' }, - }, - palette: { - brand: { - primary: '#7E98FF', - secondary: '#5C7AF7', - tertiary: '#3E5DE7', - }, - red: { - primary: '#FF706E', - secondary: '#F63A45', - tertiary: '#CF202D', - }, - orange: { - primary: '#D28C81', - secondary: '#BE6E62', - tertiary: '#9E564D', - }, - brown: { - primary: '#C3937B', - secondary: '#A77A62', - tertiary: '#8B614D', - }, - yellow: { - primary: '#C49711', - secondary: '#A87D07', - tertiary: '#8D6300', - }, - green: { - primary: '#85AA45', - secondary: '#688F30', - tertiary: '#4D7621', - }, - 'blue-1': { - primary: '#6F9BFD', - secondary: '#437DFC', - tertiary: '#3665CC', - }, - 'blue-2': { - primary: '#3BAACA', - secondary: '#318EA9', - tertiary: '#277389', - }, - purple: { - primary: '#BE83FA', - secondary: '#AB5EF0', - tertiary: '#933CDB', - }, - pink: { - primary: '#E779B8', - secondary: '#D2579E', - tertiary: '#B0417F', - }, - gray: { - primary: '#969EB0', - secondary: '#7B8498', - tertiary: '#626A80', + primary: '#F0463D', + secondary: '#C00100', + tertiary: '#910C06', }, + disabled: { primary: '#2F303D' }, }, }, }, + components: {}, }, dsfr: { globals: { font: { + sizes: { + xs: '0.75rem', + sm: '0.875rem', + md: '1rem', + lg: '1.125rem', + ml: '0.938rem', + xl: '1.25rem', + t: '0.6875rem', + s: '0.75rem', + h1: '2rem', + h2: '1.75rem', + h3: '1.5rem', + h4: '1.375rem', + h5: '1.25rem', + h6: '1.125rem', + 'xl-alt': '5rem', + 'lg-alt': '4.5rem', + 'md-alt': '4rem', + 'sm-alt': '3.5rem', + 'xs-alt': '3rem', + }, + weights: { thin: 100, extrabold: 800, black: 900 }, families: { - base: 'Marianne, Inter, Roboto Flex Variable, sans-serif', accent: 'Marianne, Inter, Roboto Flex Variable, sans-serif', + base: 'Marianne, Inter, Roboto Flex Variable, sans-serif', + }, + }, + spacings: { + '0': '0', + none: '0', + auto: 'auto', + bx: '2.2rem', + full: '100%', + '4xs': '0.125rem', + '3xs': '0.25rem', + '2xs': '0.375rem', + xs: '0.5rem', + sm: '0.75rem', + base: '1rem', + md: '1.5rem', + lg: '2rem', + xl: '2.5rem', + xxl: '3rem', + '2xl': '3rem', + xxxl: '3.5rem', + '3xl': '3.5rem', + '4xl': '4rem', + '5xl': '4.5rem', + '6xl': '6rem', + '7xl': '7.5rem', + }, + breakpoints: { + xxs: '320px', + xs: '480px', + mobile: '768px', + tablet: '1024px', + }, + colors: { + 'logo-1-light': '#2845C1', + 'logo-2-light': '#C83F49', + 'logo-1-dark': '#95ABFF', + 'logo-2-dark': '#E78087', + 'brand-050': '#EDF0FF', + 'brand-100': '#DAE2FF', + 'brand-150': '#C8D3FF', + 'brand-200': '#B5C4FF', + 'brand-250': '#A2B6FF', + 'brand-300': '#90A7FF', + 'brand-350': '#7E98FF', + 'brand-400': '#6C89FE', + 'brand-450': '#5C7AF7', + 'brand-500': '#4C6CEF', + 'brand-550': '#3E5DE7', + 'brand-600': '#304DDF', + 'brand-650': '#2845C1', + 'brand-700': '#223E9E', + 'brand-750': '#1F367D', + 'brand-800': '#1B2E5F', + 'brand-850': '#172446', + 'brand-900': '#121B30', + 'brand-950': '#0C111A', + 'gray-000': '#FFFFFF', + 'gray-025': '#F8F8F9', + 'gray-050': '#F0F0F3', + 'gray-100': '#DFE2EA', + 'gray-150': '#CFD5DE', + 'gray-200': '#C1C7D3', + 'gray-250': '#B2B9C7', + 'gray-300': '#A4ABBC', + 'gray-350': '#969EB0', + 'gray-400': '#8891A4', + 'gray-450': '#7B8498', + 'gray-500': '#6D778C', + 'gray-550': '#626A80', + 'gray-600': '#555E74', + 'gray-650': '#4A5267', + 'gray-700': '#3F4759', + 'gray-750': '#363B4C', + 'gray-800': '#2B303D', + 'gray-850': '#222631', + 'gray-900': '#181B24', + 'gray-950': '#0F1117', + 'gray-1000': '#000000', + 'info-050': '#E7F2FF', + 'info-100': '#CFE5FF', + 'info-150': '#B7D7FF', + 'info-200': '#A0CAFE', + 'info-250': '#8CBCF9', + 'info-300': '#77AEF4', + 'info-350': '#63A0EE', + 'info-400': '#5092E7', + 'info-450': '#4185DC', + 'info-500': '#3677CC', + 'info-550': '#2F6ABB', + 'info-600': '#265EAA', + 'info-650': '#28528F', + 'info-700': '#274775', + 'info-750': '#243C5E', + 'info-800': '#20314A', + 'info-850': '#1B2637', + 'info-900': '#141C27', + 'info-950': '#0D1118', + 'success-050': '#DEF7E6', + 'success-100': '#BAEECF', + 'success-150': '#A5E2C0', + 'success-200': '#95D4B3', + 'success-250': '#85C6A7', + 'success-300': '#74B99B', + 'success-350': '#65AB8F', + 'success-400': '#579E84', + 'success-450': '#4B9079', + 'success-500': '#40836F', + 'success-550': '#367664', + 'success-600': '#2B695A', + 'success-650': '#2C5A50', + 'success-700': '#2A4D45', + 'success-750': '#26403C', + 'success-800': '#213430', + 'success-850': '#1B2826', + 'success-900': '#151D1C', + 'success-950': '#0D1212', + 'warning-050': '#FFEEDF', + 'warning-100': '#FFDCBE', + 'warning-150': '#FFCA9C', + 'warning-200': '#FFB778', + 'warning-250': '#FDA54F', + 'warning-300': '#F59425', + 'warning-350': '#E78613', + 'warning-400': '#D7790C', + 'warning-450': '#C86C08', + 'warning-500': '#B85F03', + 'warning-550': '#A75400', + 'warning-600': '#984800', + 'warning-650': '#814112', + 'warning-700': '#6C3A19', + 'warning-750': '#58321C', + 'warning-800': '#452A1A', + 'warning-850': '#352117', + 'warning-900': '#261813', + 'warning-950': '#170F0C', + 'error-050': '#FFEDEB', + 'error-100': '#FFDAD7', + 'error-150': '#FFC7C2', + 'error-200': '#FFB3AD', + 'error-250': '#FF9F99', + 'error-300': '#FF8984', + 'error-350': '#FF706E', + 'error-400': '#FB5759', + 'error-450': '#F63A45', + 'error-500': '#E32C39', + 'error-550': '#CF202D', + 'error-600': '#BD0F23', + 'error-650': '#9D2227', + 'error-700': '#812727', + 'error-750': '#672624', + 'error-800': '#512220', + 'error-850': '#3D1C1B', + 'error-900': '#2A1614', + 'error-950': '#190E0D', + 'red-050': '#FFEDEB', + 'red-100': '#FFDAD7', + 'red-150': '#FFC7C2', + 'red-200': '#FFB3AD', + 'red-250': '#FF9F99', + 'red-300': '#FF8984', + 'red-350': '#FF706E', + 'red-400': '#FB5759', + 'red-450': '#F63A45', + 'red-500': '#E32C39', + 'red-550': '#CF202D', + 'red-600': '#BD0F23', + 'red-650': '#9D2227', + 'red-700': '#812727', + 'red-750': '#672624', + 'red-800': '#512220', + 'red-850': '#3D1C1B', + 'red-900': '#410003', + 'red-950': '#190E0D', + 'orange-050': '#FCEDEB', + 'orange-100': '#F8DCD7', + 'orange-150': '#F1CCC5', + 'orange-200': '#EABCB4', + 'orange-250': '#E2ACA2', + 'orange-300': '#DA9C92', + 'orange-350': '#D28C81', + 'orange-400': '#CA7C70', + 'orange-450': '#BE6E62', + 'orange-500': '#AE6257', + 'orange-550': '#9E564D', + 'orange-600': '#8F4B42', + 'orange-650': '#79443D', + 'orange-700': '#643C37', + 'orange-750': '#513430', + 'orange-800': '#412B28', + 'orange-850': '#312220', + 'orange-900': '#231918', + 'orange-950': '#150F0F', + 'brown-050': '#F9EFEA', + 'brown-100': '#F3DFD3', + 'brown-150': '#EACFC1', + 'brown-200': '#E2BFAE', + 'brown-250': '#D8B19C', + 'brown-300': '#D0A189', + 'brown-350': '#C3937B', + 'brown-400': '#B5866D', + 'brown-450': '#A77A62', + 'brown-500': '#996D57', + 'brown-550': '#8B614D', + 'brown-600': '#7C5542', + 'brown-650': '#6A4C3C', + 'brown-700': '#594236', + 'brown-750': '#49382F', + 'brown-800': '#3B2E28', + 'brown-850': '#2D2420', + 'brown-900': '#201A18', + 'brown-950': '#13100F', + 'yellow-050': '#FDF1C5', + 'yellow-100': '#FBE18E', + 'yellow-150': '#F4D261', + 'yellow-200': '#EAC244', + 'yellow-250': '#DFB41B', + 'yellow-300': '#D1A516', + 'yellow-350': '#C49711', + 'yellow-400': '#B78A0C', + 'yellow-450': '#A87D07', + 'yellow-500': '#9B6F02', + 'yellow-550': '#8D6300', + 'yellow-600': '#7F5600', + 'yellow-650': '#6E4C11', + 'yellow-700': '#5D4219', + 'yellow-750': '#4D371B', + 'yellow-800': '#3D2E1A', + 'yellow-850': '#2F2417', + 'yellow-900': '#221A12', + 'yellow-950': '#14100C', + 'green-050': '#E7F9B3', + 'green-100': '#D5EC98', + 'green-150': '#C5DE86', + 'green-200': '#B5D174', + 'green-250': '#A5C464', + 'green-300': '#95B755', + 'green-350': '#85AA45', + 'green-400': '#769D39', + 'green-450': '#688F30', + 'green-500': '#5A8228', + 'green-550': '#4D7621', + 'green-600': '#416919', + 'green-650': '#3A5B20', + 'green-700': '#324E22', + 'green-750': '#2C4122', + 'green-800': '#24351D', + 'green-850': '#1D2919', + 'green-900': '#161E13', + 'green-950': '#0E120C', + 'blue-1-050': '#E7F2FF', + 'blue-1-100': '#CFE5FF', + 'blue-1-150': '#B7D7FF', + 'blue-1-200': '#A0CAFE', + 'blue-1-250': '#8CBCF9', + 'blue-1-300': '#77AEF4', + 'blue-1-350': '#63A0EE', + 'blue-1-400': '#5092E7', + 'blue-1-450': '#4185DC', + 'blue-1-500': '#3677CC', + 'blue-1-550': '#2F6ABB', + 'blue-1-600': '#265EAA', + 'blue-1-650': '#28528F', + 'blue-1-700': '#274775', + 'blue-1-750': '#243C5E', + 'blue-1-800': '#20314A', + 'blue-1-850': '#1B2637', + 'blue-1-900': '#141C27', + 'blue-1-950': '#0D1118', + 'blue-2-050': '#E2F4FD', + 'blue-2-100': '#C4E8F8', + 'blue-2-150': '#AADCF2', + 'blue-2-200': '#93CFEB', + 'blue-2-250': '#7CC2E2', + 'blue-2-300': '#6CB4D6', + 'blue-2-350': '#5CA7C9', + 'blue-2-400': '#5099BC', + 'blue-2-450': '#458BAE', + 'blue-2-500': '#3A7EA0', + 'blue-2-550': '#327191', + 'blue-2-600': '#286483', + 'blue-2-650': '#2B5770', + 'blue-2-700': '#294A5E', + 'blue-2-750': '#263E4D', + 'blue-2-800': '#22323D', + 'blue-2-850': '#1C272E', + 'blue-2-900': '#151D21', + 'blue-2-950': '#0E1114', + 'purple-050': '#F5EEFF', + 'purple-100': '#ECDCFF', + 'purple-150': '#E2CBFF', + 'purple-200': '#D9B9FF', + 'purple-250': '#D0A7FF', + 'purple-300': '#C894FE', + 'purple-350': '#BE83FA', + 'purple-400': '#B570F5', + 'purple-450': '#AB5EF0', + 'purple-500': '#A04BE8', + 'purple-550': '#933CDB', + 'purple-600': '#8530C8', + 'purple-650': '#7033A5', + 'purple-700': '#5D3185', + 'purple-750': '#4C2C6A', + 'purple-800': '#3C2652', + 'purple-850': '#2D203C', + 'purple-900': '#21182A', + 'purple-950': '#130F19', + 'pink-050': '#FFEBF6', + 'pink-100': '#FFD8ED', + 'pink-150': '#FCC4E3', + 'pink-200': '#F7B2D9', + 'pink-250': '#F29FCE', + 'pink-300': '#ED8CC3', + 'pink-350': '#E779B8', + 'pink-400': '#E264AD', + 'pink-450': '#D2579E', + 'pink-500': '#C24B8E', + 'pink-550': '#B0417F', + 'pink-600': '#9F3670', + 'pink-650': '#873560', + 'pink-700': '#6F3250', + 'pink-750': '#5A2C43', + 'pink-800': '#472635', + 'pink-850': '#351F29', + 'pink-900': '#26171D', + 'pink-950': '#170F12', + 'black-000': '#181B2400', + 'black-050': '#181B240D', + 'black-100': '#181B241A', + 'black-150': '#181B2426', + 'black-200': '#181B2433', + 'black-250': '#181B2440', + 'black-300': '#181B244D', + 'black-350': '#181B2459', + 'black-400': '#181B2466', + 'black-450': '#181B2473', + 'black-500': '#181B2480', + 'black-550': '#181B248C', + 'black-600': '#181B2499', + 'black-650': '#181B24A6', + 'black-700': '#181B24B2', + 'black-750': '#181B24BF', + 'black-800': '#181B24CC', + 'black-850': '#181B24D9', + 'black-900': '#181B24E5', + 'black-950': '#0F1117F2', + 'white-000': '#F6F8F900', + 'white-050': '#F6F8F90D', + 'white-100': '#F6F8F91A', + 'white-150': '#F6F8F926', + 'white-200': '#F6F8F933', + 'white-250': '#F6F8F940', + 'white-300': '#F6F8F94D', + 'white-350': '#F6F8F959', + 'white-400': '#F6F8F966', + 'white-450': '#F6F8F973', + 'white-500': '#F6F8F980', + 'white-550': '#F6F8F98C', + 'white-600': '#F6F8F999', + 'white-650': '#F6F8F9A6', + 'white-700': '#F6F8F9B2', + 'white-750': '#F6F8F9BF', + 'white-800': '#F6F8F9CC', + 'white-850': '#F6F8F9D9', + 'white-900': '#F6F8F9E5', + 'white-950': '#F6F8F9F2', + 'white-975': '#F6F8F9F9', + }, + spacing: { + '0': '0rem', + none: '0rem', + auto: 'auto', + bx: '2.2rem', + full: '100%', + '3xs': '0.25rem', + '2xs': '0.375rem', + }, + }, + contextuals: { + background: { + surface: { + primary: '#FFFFFF', + secondary: '#FFFFFF', + tertiary: '#F8F8F9', + }, + semantic: { + overlay: { primary: '#1B1B230D', 'primary-hover': '#1B1B231A' }, + contextual: { primary: '#1B1B230D', 'primary-hover': '#1B1B231A' }, + brand: { + primary: '#5E5CD0', + 'primary-hover': '#4844AD', + secondary: '#DDE2F5', + 'secondary-hover': '#CED3F1', + tertiary: '#EEF1FA', + 'tertiary-hover': '#DDE2F5', + }, + neutral: { + primary: '#69697D', + 'primary-hover': '#515164', + secondary: '#E2E2EA', + 'secondary-hover': '#D3D4E0', + tertiary: '#F0F0F3', + 'tertiary-hover': '#E2E2EA', + }, + info: { + primary: '#0069CF', + 'primary-hover': '#0D4EAA', + secondary: '#D5E4F3', + 'secondary-hover': '#BFD7F0', + tertiary: '#EAF2F9', + 'tertiary-hover': '#D5E4F3', + }, + success: { + primary: '#027B3E', + 'primary-hover': '#006024', + secondary: '#CFE4D4', + 'secondary-hover': '#BAD9C1', + tertiary: '#E8F1EA', + 'tertiary-hover': '#CFE4D4', + }, + warning: { + primary: '#BC4200', + 'primary-hover': '#9E2300', + secondary: '#F1E0D3', + 'secondary-hover': '#ECD0BC', + tertiary: '#F8F0E9', + 'tertiary-hover': '#F1E0D3', + }, + error: { + primary: '#D7010E', + 'primary-hover': '#AA0000', + secondary: '#F4DFD9', + 'secondary-hover': '#F0CEC6', + tertiary: '#F9EFEC', + 'tertiary-hover': '#F4DFD9', + }, + disabled: { primary: '#E2E2EA', secondary: '#F0F0F3' }, + }, + palette: { + brand: { + primary: '#6969DF', + secondary: '#8F94FD', + tertiary: '#CED3F1', + }, + red: { + primary: '#DA3B49', + secondary: '#F37B7E', + tertiary: '#F1CDCB', + }, + orange: { + primary: '#B95D33', + secondary: '#E5845A', + tertiary: '#ECD0BD', + }, + brown: { + primary: '#8F7158', + secondary: '#B8987E', + tertiary: '#EBD0BA', + }, + yellow: { + primary: '#9D6E00', + secondary: '#C2972E', + tertiary: '#E1D4B7', + }, + green: { + primary: '#008948', + secondary: '#45B173', + tertiary: '#B8D8C1', + }, + 'blue-1': { + primary: '#4279B9', + secondary: '#68A1E4', + tertiary: '#C1D7F0', + }, + 'blue-2': { + primary: '#00848F', + secondary: '#00AFBA', + tertiary: '#B2DCE0', + }, + purple: { + primary: '#9961AF', + secondary: '#C188D9', + tertiary: '#E7D1E7', + }, + pink: { + primary: '#AA5F80', + secondary: '#D685A8', + tertiary: '#EACEDF', + }, + gray: { + primary: '#75758A', + secondary: '#9C9CB2', + tertiary: '#D3D4E0', + }, + }, + }, + content: { + logo1: '#4844AD', + logo2: '#4844AD', + semantic: { + contextual: { primary: '#F8F8F9F2' }, + overlay: { primary: '#F8F8F9F2' }, + brand: { + primary: '#3E3B98', + secondary: '#534FC2', + tertiary: '#5E5CD0', + 'on-brand': '#EEF1FA', + }, + neutral: { + primary: '#25252F', + secondary: '#5D5D70', + tertiary: '#69697D', + 'on-neutral': '#F0F0F3', + }, + info: { + primary: '#124394', + secondary: '#005BC0', + tertiary: '#0069CF', + 'on-info': '#EAF2F9', + }, + success: { + primary: '#005317', + secondary: '#016D31', + tertiary: '#027B3E', + 'on-success': '#E8F1EA', + }, + warning: { + primary: '#882011', + secondary: '#AD3300', + tertiary: '#BC4200', + 'on-warning': '#F8F0E9', + }, + error: { + primary: '#910C06', + secondary: '#C00100', + tertiary: '#D7010E', + 'on-error': '#F9EFEC', + }, + disabled: { primary: '#A9A9BF', secondary: '#F8F8F980' }, + }, + palette: { + brand: { primary: '#6969DF' }, + red: { primary: '#DA3B49' }, + orange: { primary: '#B95D33' }, + brown: { primary: '#8F7158' }, + yellow: { primary: '#9D6E00' }, + green: { primary: '#008948' }, + 'blue-1': { primary: '#4279B9' }, + 'blue-2': { primary: '#00848F' }, + purple: { primary: '#9961AF' }, + pink: { primary: '#AA5F80' }, + gray: { primary: '#75758A' }, + }, + }, + border: { + surface: { primary: '#E2E2EA' }, + semantic: { + contextual: { primary: '#F8F8F933' }, + overlay: { primary: '#F8F8F933' }, + brand: { + primary: '#5E5CD0', + secondary: '#A0A5F6', + tertiary: '#CED3F1', + }, + neutral: { + primary: '#69697D', + secondary: '#A9A9BF', + tertiary: '#D3D4E0', + }, + info: { + primary: '#0069CF', + secondary: '#6EB0F2', + tertiary: '#BFD7F0', + }, + success: { + primary: '#027B3E', + secondary: '#6CBA83', + tertiary: '#BAD9C1', + }, + warning: { + primary: '#BC4200', + secondary: '#EB9970', + tertiary: '#ECD0BC', + }, + error: { + primary: '#D7010E', + secondary: '#EF9486', + tertiary: '#F0CEC6', + }, + disabled: { primary: '#E2E2EA' }, }, }, }, components: { + modal: { 'width-small': '342px' }, + tooltip: { padding: '4px 8px' }, + button: { + 'medium-height': '40px', + 'medium-text-height': '40px', + 'border-radius': '4px', + 'border-radius--active': '4px', + 'border-radius--focus': '4px', + }, + datagrid: { + 'header--color': '#25252F', + 'header--size': '12px', + 'header--weight': '500', + 'body--background-color-hover': '#F0F0F3', + }, + 'forms-checkbox': { 'font-size': '0.875rem' }, + badge: { + 'font-size': '0.75rem', + 'border-radius': '12px', + 'padding-inline': '0.5rem', + 'padding-block': '0.375rem', + accent: { 'background-color': '#DDE2F5', color: '#534FC2' }, + neutral: { 'background-color': '#E2E2EA', color: '#5D5D70' }, + danger: { 'background-color': '#F4DFD9', color: '#C00100' }, + success: { 'background-color': '#CFE4D4', color: '#016D31' }, + warning: { 'background-color': '#F1E0D3', color: '#AD3300' }, + info: { 'background-color': '#D5E4F3', color: '#005BC0' }, + }, logo: { src: '/assets/logo-gouv.svg', + alt: 'Gouvernement Logo', widthHeader: '110px', widthFooter: '220px', - alt: 'Gouvernement Logo', }, 'la-gaufre': true, 'home-proconnect': true, @@ -1556,309 +1981,9 @@ export const tokens = { height: 'auto', }, favicon: { - ico: '/assets/favicon-dsfr.ico', 'png-light': '/assets/favicon-dsfr.png', 'png-dark': '/assets/favicon-dark-dsfr.png', - }, - }, - }, - generic: { - globals: { - colors: { - 'brand-050': '#EEF1FA', - 'brand-100': '#DDE2F5', - 'brand-150': '#CED3F1', - 'brand-200': '#BEC5F0', - 'brand-250': '#AFB5F1', - 'brand-300': '#A0A5F6', - 'brand-350': '#8F94FD', - 'brand-400': '#8184FC', - 'brand-450': '#7576EE', - 'brand-500': '#6969DF', - 'brand-550': '#5E5CD0', - 'brand-600': '#534FC2', - 'brand-650': '#4844AD', - 'brand-700': '#3E3B98', - 'brand-750': '#36347D', - 'brand-800': '#2D2F5F', - 'brand-850': '#262848', - 'brand-900': '#1C1E32', - 'brand-950': '#11131F', - 'gray-000': '#FFFFFF', - 'gray-025': '#F8F8F9', - 'gray-050': '#F0F0F3', - 'gray-100': '#E2E2EA', - 'gray-150': '#D3D4E0', - 'gray-200': '#C5C6D5', - 'gray-250': '#B7B7CB', - 'gray-300': '#A9A9BF', - 'gray-350': '#9C9CB2', - 'gray-400': '#8F8FA4', - 'gray-450': '#828297', - 'gray-500': '#75758A', - 'gray-550': '#69697D', - 'gray-600': '#5D5D70', - 'gray-650': '#515164', - 'gray-700': '#454558', - 'gray-750': '#3A3A4C', - 'gray-800': '#2F303D', - 'gray-850': '#25252F', - 'gray-900': '#1B1B23', - 'gray-950': '#111114', - 'gray-1000': '#000000', - 'info-050': '#EAF2F9', - 'info-100': '#D5E4F3', - 'info-150': '#BFD7F0', - 'info-200': '#A7CAEE', - 'info-250': '#8DBDEF', - 'info-300': '#6EB0F2', - 'info-350': '#50A2F5', - 'info-400': '#3593F4', - 'info-450': '#1185ED', - 'info-500': '#0077DE', - 'info-550': '#0069CF', - 'info-600': '#005BC0', - 'info-650': '#0D4EAA', - 'info-700': '#124394', - 'info-750': '#163878', - 'info-800': '#192F5A', - 'info-850': '#192541', - 'info-900': '#141B2D', - 'info-950': '#0C111C', - 'success-050': '#E8F1EA', - 'success-100': '#CFE4D4', - 'success-150': '#BAD9C1', - 'success-200': '#A2CFAD', - 'success-250': '#86C597', - 'success-300': '#6CBA83', - 'success-350': '#4FB070', - 'success-400': '#40A363', - 'success-450': '#309556', - 'success-500': '#1E884A', - 'success-550': '#027B3E', - 'success-600': '#016D31', - 'success-650': '#006024', - 'success-700': '#005317', - 'success-750': '#0D4511', - 'success-800': '#11380E', - 'success-850': '#132A11', - 'success-900': '#101E0F', - 'success-950': '#091209', - 'warning-050': '#F8F0E9', - 'warning-100': '#F1E0D3', - 'warning-150': '#ECD0BC', - 'warning-200': '#E8C0A4', - 'warning-250': '#E8AE8A', - 'warning-300': '#EB9970', - 'warning-350': '#E98456', - 'warning-400': '#E57036', - 'warning-450': '#DA5E18', - 'warning-500': '#CB5000', - 'warning-550': '#BC4200', - 'warning-600': '#AD3300', - 'warning-650': '#9E2300', - 'warning-700': '#882011', - 'warning-750': '#731E16', - 'warning-800': '#58201A', - 'warning-850': '#401D18', - 'warning-900': '#2E1714', - 'warning-950': '#1D0F0D', - 'error-050': '#F9EFEC', - 'error-100': '#F4DFD9', - 'error-150': '#F0CEC6', - 'error-200': '#EEBCB2', - 'error-250': '#EEA99D', - 'error-300': '#EF9486', - 'error-350': '#F37C6E', - 'error-400': '#F65F53', - 'error-450': '#F0463D', - 'error-500': '#E82322', - 'error-550': '#D7010E', - 'error-600': '#C00100', - 'error-650': '#AA0000', - 'error-700': '#910C06', - 'error-750': '#731E16', - 'error-800': '#58201A', - 'error-850': '#401D18', - 'error-900': '#2E1714', - 'error-950': '#1D0F0D', - 'red-050': '#FAEFEE', - 'red-100': '#F4DEDD', - 'red-150': '#F1CDCB', - 'red-200': '#EFBBBA', - 'red-250': '#EEA8A8', - 'red-300': '#F09394', - 'red-350': '#F37B7E', - 'red-400': '#EF6569', - 'red-450': '#E94A55', - 'red-500': '#DA3B49', - 'red-550': '#CA2A3C', - 'red-600': '#BB1330', - 'red-650': '#A90021', - 'red-700': '#910A13', - 'red-750': '#731E16', - 'red-800': '#58201A', - 'red-850': '#411D18', - 'red-900': '#2E1714', - 'red-950': '#1D0F0D', - 'orange-050': '#F8F0E9', - 'orange-100': '#F1E0D3', - 'orange-150': '#ECD0BD', - 'orange-200': '#EABFA6', - 'orange-250': '#EBAC90', - 'orange-300': '#EC9772', - 'orange-350': '#E5845A', - 'orange-400': '#D6774D', - 'orange-450': '#C86A40', - 'orange-500': '#B95D33', - 'orange-550': '#AB5025', - 'orange-600': '#9D4315', - 'orange-650': '#8F3600', - 'orange-700': '#812900', - 'orange-750': '#6C2511', - 'orange-800': '#572017', - 'orange-850': '#401D18', - 'orange-900': '#2E1714', - 'orange-950': '#1D0F0D', - 'brown-050': '#F6F0E8', - 'brown-100': '#F1E0D3', - 'brown-150': '#EBD0BA', - 'brown-200': '#E2C0A6', - 'brown-250': '#D4B398', - 'brown-300': '#C6A58B', - 'brown-350': '#B8987E', - 'brown-400': '#AA8B71', - 'brown-450': '#9D7E65', - 'brown-500': '#8F7158', - 'brown-550': '#82654C', - 'brown-600': '#765841', - 'brown-650': '#694C35', - 'brown-700': '#5D412A', - 'brown-750': '#51361E', - 'brown-800': '#452A13', - 'brown-850': '#392008', - 'brown-900': '#29180A', - 'brown-950': '#1B0F08', - 'yellow-050': '#F3F0E7', - 'yellow-100': '#E9E2CF', - 'yellow-150': '#E1D4B7', - 'yellow-200': '#D9C599', - 'yellow-250': '#D2B677', - 'yellow-300': '#CAA756', - 'yellow-350': '#C2972E', - 'yellow-400': '#B98900', - 'yellow-450': '#AB7B00', - 'yellow-500': '#9D6E00', - 'yellow-550': '#916100', - 'yellow-600': '#855400', - 'yellow-650': '#784700', - 'yellow-700': '#6C3A00', - 'yellow-750': '#5F2E00', - 'yellow-800': '#512302', - 'yellow-850': '#3E1D10', - 'yellow-900': '#2D1711', - 'yellow-950': '#1D0F0D', - 'green-050': '#E6F1E9', - 'green-100': '#CFE4D5', - 'green-150': '#B8D8C1', - 'green-200': '#A0CFAE', - 'green-250': '#84C59A', - 'green-300': '#65BA86', - 'green-350': '#45B173', - 'green-400': '#23A562', - 'green-450': '#029755', - 'green-500': '#008948', - 'green-550': '#017B3B', - 'green-600': '#006E2E', - 'green-650': '#006022', - 'green-700': '#005314', - 'green-750': '#0D4510', - 'green-800': '#11380E', - 'green-850': '#132A11', - 'green-900': '#101E0F', - 'green-950': '#091209', - 'blue1-050': '#EBF1F9', - 'blue1-100': '#D6E4F4', - 'blue1-150': '#C1D7F0', - 'blue1-200': '#AACAEF', - 'blue1-250': '#8FBCEF', - 'blue1-300': '#7CAFEB', - 'blue1-350': '#68A1E4', - 'blue1-400': '#5B94D6', - 'blue1-450': '#4E86C7', - 'blue1-500': '#4279B9', - 'blue1-550': '#356CAC', - 'blue1-600': '#28609E', - 'blue1-650': '#1B5390', - 'blue1-700': '#0B4783', - 'blue1-750': '#0F3C6E', - 'blue1-800': '#133059', - 'blue1-850': '#152641', - 'blue1-900': '#121C2D', - 'blue1-950': '#0B111C', - 'blue2-050': '#E7F3F4', - 'blue2-100': '#CEE7E9', - 'blue2-150': '#B2DCE0', - 'blue2-200': '#91D1D7', - 'blue2-250': '#68C7D0', - 'blue2-300': '#43BBC5', - 'blue2-350': '#00AFBA', - 'blue2-400': '#01A0AA', - 'blue2-450': '#00929D', - 'blue2-500': '#00848F', - 'blue2-550': '#007682', - 'blue2-600': '#016874', - 'blue2-650': '#005B67', - 'blue2-700': '#004E5A', - 'blue2-750': '#00424E', - 'blue2-800': '#003642', - 'blue2-850': '#002A38', - 'blue2-900': '#061E28', - 'blue2-950': '#071219', - 'purple-050': '#F7F0F6', - 'purple-100': '#EEE0EE', - 'purple-150': '#E7D1E7', - 'purple-200': '#DBBFE4', - 'purple-250': '#D3AEE2', - 'purple-300': '#CB99E1', - 'purple-350': '#C188D9', - 'purple-400': '#B47BCB', - 'purple-450': '#A66EBD', - 'purple-500': '#9961AF', - 'purple-550': '#8B55A1', - 'purple-600': '#7E4894', - 'purple-650': '#723C87', - 'purple-700': '#633376', - 'purple-750': '#552A65', - 'purple-800': '#452551', - 'purple-850': '#35213D', - 'purple-900': '#261A2C', - 'purple-950': '#17111C', - 'pink-050': '#F8EFF4', - 'pink-100': '#F0DFEA', - 'pink-150': '#EACEDF', - 'pink-200': '#E9BBD1', - 'pink-250': '#E9A7C2', - 'pink-300': '#E095B4', - 'pink-350': '#D685A8', - 'pink-400': '#C7799B', - 'pink-450': '#B86C8D', - 'pink-500': '#AA5F80', - 'pink-550': '#9C5374', - 'pink-600': '#8E4767', - 'pink-650': '#813B5B', - 'pink-700': '#732E4F', - 'pink-750': '#632643', - 'pink-800': '#521F38', - 'pink-850': '#3E1C2B', - 'pink-900': '#2D171F', - 'pink-950': '#1C0E12', - }, - font: { - families: { - base: 'Inter, Roboto Flex Variable, sans-serif', - accent: 'Inter, Roboto Flex Variable, sans-serif', - }, + ico: '/assets/favicon-dsfr.ico', }, }, }, diff --git a/src/frontend/apps/impress/src/cunningham/useCunninghamTheme.tsx b/src/frontend/apps/impress/src/cunningham/useCunninghamTheme.tsx index 038bb113..672b5be6 100644 --- a/src/frontend/apps/impress/src/cunningham/useCunninghamTheme.tsx +++ b/src/frontend/apps/impress/src/cunningham/useCunninghamTheme.tsx @@ -28,7 +28,7 @@ const getMergedTokens = (theme: Theme) => { return merge({}, tokens.themes['default'], tokens.themes[theme]); }; -const DEFAULT_THEME: Theme = 'generic'; +const DEFAULT_THEME: Theme = 'default'; const defaultTokens = getMergedTokens(DEFAULT_THEME); const initialState: ThemeStore = {