@cnamts/synapse 1.0.24 → 1.0.25

package/src/assets/tokens.scss

@@ -1,388 +0,0 @@
-/*
- * CNAM Design System
- * Tokens and settings for the CNAM and PA themes.
- * This file must not contain any styles as it will be duplicated many times.
- */
-
-// Primitives
-$orange-darken-80: #2d100b;
-$orange-darken-60: #5a2017;
-$orange-darken-40: #862f22;
-$orange-darken-20: #b33f2e;
-$orange-base: #e04f39;
-$orange-lighten-20: #e67261;
-$orange-lighten-40: #ec9588;
-$orange-lighten-60: #f3b9b0;
-$orange-lighten-80: #f9dcd7;
-$orange-lighten-90: #fcedeb;
-$orange-lighten-97: #fefaf9;
-$yellow-darken-80: #302407;
-$yellow-darken-60: #60480e;
-$yellow-darken-40: #906b15;
-$yellow-darken-20: #c08f1c;
-$yellow-base: #f0b323;
-$yellow-lighten-20: #f3c24f;
-$yellow-lighten-40: #f6d17b;
-$yellow-lighten-60: #f9e1a7;
-$yellow-lighten-80: #fcf0d3;
-$yellow-lighten-90: #fdf7e9;
-$yellow-lighten-97: #fffdf8;
-$green-darken-80: #112717;
-$green-darken-60: #224e2d;
-$green-darken-40: #347444;
-$green-darken-20: #459b5a;
-$green-base: #56c271;
-$green-lighten-20: #78ce8d;
-$green-lighten-40: #9adaaa;
-$green-lighten-60: #bbe7c6;
-$green-lighten-80: #ddf3e3;
-$green-lighten-90: #eef9f1;
-$green-lighten-97: #fafdfb;
-$turquoise-darken-80: #00221c;
-$turquoise-darken-60: #004439;
-$turquoise-darken-40: #006755;
-$turquoise-darken-20: #008972;
-$turquoise-base: #00ab8e;
-$turquoise-lighten-20: #33bca5;
-$turquoise-lighten-40: #66cdbb;
-$turquoise-lighten-60: #99ddd2;
-$turquoise-lighten-80: #cceee8;
-$turquoise-lighten-90: #e5f7f4;
-$turquoise-lighten-97: #f7fcfc;
-$blue-darken-80: #020d1f;
-$blue-darken-60: #051a3e;
-$blue-darken-40: #07275c;
-$blue-darken-20: #0a347b;
-$blue-base: #0c419a;
-$blue-lighten-20: #3d67ae;
-$blue-lighten-40: #6d8dc2;
-$blue-lighten-60: #9eb3d7;
-$blue-lighten-80: #ced9eb;
-$blue-lighten-90: #e7ecf5;
-$blue-lighten-97: #f8f9fc;
-$cyan-darken-80: #00212d;
-$cyan-darken-60: #004259;
-$cyan-darken-40: #006386;
-$cyan-darken-20: #0084b2;
-$cyan-base: #00a5df;
-$cyan-lighten-20: #33b7e5;
-$cyan-lighten-40: #66c9ec;
-$cyan-lighten-60: #99dbf2;
-$cyan-lighten-80: #ccedf9;
-$cyan-lighten-90: #e5f6fc;
-$cyan-lighten-97: #f7fcfe;
-$frosted-blue-darken-80: #142327;
-$frosted-blue-darken-60: #28464d;
-$frosted-blue-darken-40: #3d6874;
-$frosted-blue-darken-20: #518b9a;
-$frosted-blue-base: #65aec1;
-$frosted-blue-lighten-20: #84becd;
-$frosted-blue-lighten-40: #a3ceda;
-$frosted-blue-lighten-60: #c1dfe6;
-$frosted-blue-lighten-80: #e0eff3;
-$frosted-blue-lighten-90: #f0f7f9;
-$frosted-blue-lighten-97: #fafdfd;
-$parma-darken-80: #171c26;
-$parma-darken-60: #2f384d;
-$parma-darken-40: #465473;
-$parma-darken-20: #5e709a;
-$parma-base: #758cc0;
-$parma-lighten-20: #91a3cd;
-$parma-lighten-40: #acbad9;
-$parma-lighten-60: #c8d1e6;
-$parma-lighten-80: #e3e8f2;
-$parma-lighten-90: #f1f3f9;
-$parma-lighten-97: #fbfcfd;
-$mauve-darken-80: #201224;
-$mauve-darken-60: #402449;
-$mauve-darken-40: #60376d;
-$mauve-darken-20: #804992;
-$mauve-base: #a05bb6;
-$mauve-lighten-20: #b37cc5;
-$mauve-lighten-40: #c69dd3;
-$mauve-lighten-60: #d9bde2;
-$mauve-lighten-80: #ecdef0;
-$mauve-lighten-90: #f5eff8;
-$mauve-lighten-97: #fcfafd;
-$pink-darken-80: #2d051a;
-$pink-darken-60: #5a0a34;
-$pink-darken-40: #87104d;
-$pink-darken-20: #b41567;
-$pink-base: #e11a81;
-$pink-lighten-20: #e7489a;
-$pink-lighten-40: #ed76b3;
-$pink-lighten-60: #f3a3cd;
-$pink-lighten-80: #f9d1e6;
-$pink-lighten-90: #fce8f2;
-$pink-lighten-97: #fef8fb;
-$brick-darken-80: #291112;
-$brick-darken-60: #522224;
-$brick-darken-40: #7b3237;
-$brick-darken-20: #a44349;
-$brick-base: #cd545b;
-$brick-lighten-20: #d7767c;
-$brick-lighten-40: #e1989d;
-$brick-lighten-60: #ebbbbd;
-$brick-lighten-80: #f5ddde;
-$brick-lighten-90: #faeeef;
-$brick-lighten-97: #fdfafa;
-$grey-darken-80: #111212;
-$grey-darken-60: #222324;
-$grey-darken-40: #323535;
-$grey-darken-20: #434647;
-$grey-base: #545859;
-$grey-lighten-20: #76797a;
-$grey-lighten-40: #989b9b;
-$grey-lighten-60: #bbbcbd;
-$grey-lighten-80: #dddede;
-$grey-lighten-90: #eee;
-$grey-lighten-97: #fafafa;
-$white-20: rgb(255 255 255 / 20%);
-$white-38: rgb(255 255 255 / 38%);
-$white-40: rgb(255 255 255 / 40%);
-$white-70: rgb(255 255 255 / 70%);
-$white-base: #fff;
-$white-08: rgb(255 255 255 / 8%);
-$white-00: rgb(255 255 255 / 0%);
-$none-value: undefined;
-$transparent-blue-18: rgb(12 65 154 / 18%);
-$transparent-blue-08: rgb(12 65 154 / 8%);
-$transparent-blue-00: rgb(12 65 154 / 0%);
-
-// Semantic Tokens
-$primary-darker-2: #07275c;
-$primary-darker: #0a347b;
-$primary-base: #0c419a;
-$primary: #0c419a;
-$primary-light: #3d67ae;
-$primary-lighter-2: #9eb3d7;
-$primary-lighter-3: #ced9eb;
-$primary-lighter-4: #e7ecf5;
-$primary-lighter-5: #f8f9fc;
-$secondary-darker-2: #006386;
-$secondary-darker: #0084b2;
-$secondary-base: #00a5df;
-$secondary-light: #33b7e5;
-$secondary-lighter-2: #99dbf2;
-$secondary-lighter-3: #ccedf9;
-$secondary-lighter-4: #e5f6fc;
-$secondary-lighter-5: #f7fcfe;
-$neutral-black: #222324;
-$neutral-black-lighter: #545859;
-$neutral-black-lighter-2: #989b9b;
-$neutral-grey: #dddede;
-$neutral-white: #fff;
-$neutral-white-alpha: rgb(255 255 255 / 70%);
-$neutral-white-alpha-lighter: rgb(255 255 255 / 40%);
-$neutral-white-alpha-lighter-2: rgb(255 255 255 / 20%);
-$neutral-white-alpha-lighter-3: rgb(255 255 255 / 8%);
-$info-info-lightest: #e7ecf5;
-$info-info-lighter: #ced9eb;
-$info-default: #0c419a;
-$success-lightest: #e5f7f4;
-$success-lighter: #cceee8;
-$success-default: #56c271;
-$success-darker: #224e2d;
-$warning-lightest: #fdf7e9;
-$warning-lighter: #fcf0d3;
-$warning-default: #f0b323;
-$warning-darker: #60480e;
-$danger-lightest: #fcedeb;
-$danger-lighter: #f9dcd7;
-$danger-default: #b33f2e;
-$danger-darker: #5a2017;
-$user-professionnel: #66c9ec;
-$user-assure: #ed76b3;
-$user-entreprise: #f0b323;
-
-// Contextual Tokens
-$colors-background: #fff;
-$colors-border: #ddd;
-$colors-text: #333;
-$colors-icon: #666;
-$colors-overlay: rgb(0 0 0 / 50%);
-$colors-interactive: #007bff;
-$gap-0: 0;
-$gap-1: 4px;
-$gap-2: 8px;
-$gap-3: 12px;
-$gap-4: 16px;
-$gap-5: 20px;
-$gap-6: 24px;
-$gap-7: 28px;
-$gap-8: 32px;
-$gap-9: 36px;
-$gap-10: 40px;
-$gap-11: 44px;
-$gap-12: 48px;
-$gap-13: 52px;
-$gap-14: 56px;
-$gap-15: 60px;
-$gap-16: 64px;
-$icon-size-xsmall: 8px;
-$icon-size-small: 16px;
-$icon-size-default: 24px;
-$icon-size-large: 32px;
-$radius-rounded-0: 0;
-$radius-rounded: 4px;
-$radius-rounded-md: 4px;
-$radius-rounded-lg: 8px;
-$radius-rounded-pill: 64px;
-$padding-0: 0;
-$padding-2: 8px;
-$padding-3: 12px;
-$padding-4: 16px;
-$padding-6: 24px;
-$padding-8: 32px;
-$padding-10: 40px;
-$padding-14: 56px;
-$padding-16: 64px;
-$font-size-title: 24px;
-$font-size-alt-title: 20px;
-$font-size-body-text: 16px;
-$font-size-link-label: 14px;
-
-// Additional Contextual Tokens
-$colors-background-main: #e7ecf5;
-$colors-background-surface: #fff;
-$colors-background-main-alt: #fff;
-$colors-background-main-ter: #fafafa;
-$colors-background-surface-alt: #e7ecf5;
-$colors-background-raised: #f8f9fc;
-$colors-background-accent-primary: #0c419a;
-$colors-background-accent-primary-contrasted: #07275c;
-$colors-background-accent-primary-alt: #111212;
-$colors-background-accent-primary-light: #3d67ae;
-$colors-background-accent-secondary-light: #99dbf2;
-$colors-background-accent-secondary: #00a5df;
-$colors-background-accent-secondary-contrasted: #006386;
-$colors-background-info: #ced9eb;
-$colors-background-info-subdued: #e7ecf5;
-$colors-background-info-contrasted: #0c419a;
-$colors-background-success: #cceee8;
-$colors-background-success-subdued: #e5f7f4;
-$colors-background-success-contrasted: #56c271;
-$colors-background-warning: #fcf0d3;
-$colors-background-warning-subdued: #fdf7e9;
-$colors-background-warning-contrasted: #f0b323;
-$colors-background-error: #f9dcd7;
-$colors-background-error-subdued: #fcedeb;
-$colors-background-error-contrasted: #b33f2e;
-$colors-background-disabled: #dddede;
-$colors-background-disabled-ondark: rgb(255 255 255 / 8%);
-$colors-background-assure: #ed76b3;
-$colors-background-professionnel: #66c9ec;
-$colors-background-entreprise: #f0b323;
-$colors-border-darker: #222324;
-$colors-border-base: #989b9b;
-$colors-border-subdued: #dddede;
-$colors-border-accent-primary: #0c419a;
-$colors-border-accent-primary-contrasted: #07275c;
-$colors-border-accent-primary-ondark: #fff;
-$colors-border-accent-secondary: #00a5df;
-$colors-border-accent-secondary-contrasted: #006386;
-$colors-border-info: #0c419a;
-$colors-border-success: #224e2d;
-$colors-border-warning: #60480e;
-$colors-border-error: #b33f2e;
-$colors-border-ondark: rgb(255 255 255 / 70%);
-$colors-border-disabled: #dddede;
-$colors-border-disabled-ondark: rgb(255 255 255 / 40%);
-$colors-text-base: #222324;
-$colors-text-accent-primary: #0c419a;
-$colors-text-accent-primary-contrasted: #07275c;
-$colors-text-accent-secondary: #006386;
-$colors-text-subdued: #545859;
-$colors-text-info: #0c419a;
-$colors-text-success: #224e2d;
-$colors-text-warning: #60480e;
-$colors-text-error: #b33f2e;
-$colors-text-disabled: #989b9b;
-$colors-text-ondark: #fff;
-$colors-text-subdued-ondark: rgb(255 255 255 / 70%);
-$colors-text-disabled-ondark: rgb(255 255 255 / 40%);
-$colors-icon-base: #222324;
-$colors-icon-subdued: #545859;
-$colors-icon-subdued-ondark: rgb(255 255 255 / 70%);
-$colors-icon-accent-primary: #0c419a;
-$colors-icon-accent-primary-contrasted: #07275c;
-$colors-icon-accent-secondary: #006386;
-$colors-icon-info: #0c419a;
-$colors-icon-success: #224e2d;
-$colors-icon-warning: #60480e;
-$colors-icon-error: #b33f2e;
-$colors-icon-ondark: #fff;
-$colors-icon-disabled: #989b9b;
-$colors-icon-disabled-ondark: rgb(255 255 255 / 40%);
-$colors-overlay-fullpage: #989b9b;
-$colors-overlay-ondark: #fff;
-$colors-overlay-onlight: #0c419a;
-$colors-interactive-selection-enabled: rgb(255 255 255 / 0%);
-$colors-interactive-selection-hover: #e7ecf5;
-$colors-interactive-selection-pressed: #ced9eb;
-$colors-interactive-selection-selected: #e7ecf5;
-$colors-interactive-selection-hover-on-selected: #ced9eb;
-$colors-interactive-selection-selected-accent: #0c419a;
-$colors-interactive-selection-hover-on-selected-accent: #3d67ae;
-$colors-interactive-selection-disabled: rgb(255 255 255 / 0%);
-$colors-interactive-positive-primary-action-enabled: #0c419a;
-$colors-interactive-positive-primary-action-hover: #3d67ae;
-$colors-interactive-positive-primary-action-pressed: #9eb3d7;
-$colors-interactive-positive-primary-action-disabled: #dddede;
-$colors-interactive-negative-primary-action-enabled: #fff;
-$colors-interactive-negative-primary-action-hover: #ced9eb;
-$colors-interactive-negative-primary-action-pressed: #9eb3d7;
-$colors-interactive-negative-primary-action-disabled: #dddede;
-$colors-interactive-positive-secondary-action-enabled: rgb(255 255 255 / 0%);
-$colors-interactive-positive-secondary-action-hover: #e7ecf5;
-$colors-interactive-positive-secondary-action-pressed: #ced9eb;
-$colors-interactive-positive-secondary-action-disabled: rgb(255 255 255 / 0%);
-$colors-interactive-negative-secondary-action-enabled: rgb(255 255 255 / 0%);
-$colors-interactive-negative-secondary-action-hover: rgb(255 255 255 / 8%);
-$colors-interactive-negative-secondary-action-pressed: rgb(255 255 255 / 20%);
-$colors-interactive-negative-secondary-action-disabled: rgb(255 255 255 / 0%);
-$padding-0: 0;
-$padding-2: 8px;
-$padding-3: 12px;
-$padding-4: 16px;
-$padding-6: 24px;
-$padding-8: 32px;
-$padding-10: 40px;
-$padding-14: 56px;
-$padding-16: 64px;
-$heading-1-font-size: 24px;
-$heading-2-font-size: 20px;
-$heading-3-font-size: 16px;
-$heading-4-font-size: 14px;
-
-// vertical spacing
-
-$spacing-none: 0;
-$spacing-xx-small: 4px;
-$spacing-x-small: 8px;
-$spacing-small: 16px;
-$spacing-medium: 24px;
-$spacing-large: 32px;
-$spacing-x-large: 40px;
-$spacing-xx-large: 56px;
-$spacing-xxx-large: 64px;
-$spacing-huge: 80px;
-
-// horizontal spacing
-
-$spacing-horizontal-none: 0;
-$spacing-horizontal-xx-small: 4px;
-$spacing-horizontal-x-small: 8px;
-$spacing-horizontal-small: 16px;
-$spacing-horizontal-medium: 24px;
-$spacing-horizontal-large: 32px;
-$spacing-horizontal-x-large: 40px;
-$spacing-horizontal-xx-large: 56px;
-$spacing-horizontal-xxx-large: 64px;
-$spacing-horizontal-huge: 80px;
-
-// container
-
-$container-mobile-max-width: 600px;
-$container-tablet-max-width: 960px;
-$container-desktop-max-width: 960px;

package/src/designTokens/apColors.md

@@ -1,66 +0,0 @@
-# Color Palette Amelipro Light
-
-## Primary
-
-<span style="background-color:#084298"></span>
-
-## Secondary
-
-<span style="background-color:#801F4F"></span>
-
-## Accent
-
-<span style="background-color:#0dcaf0"></span>
-
-## Error
-
-<span style="background-color:#B02A37"></span>
-
-## Info
-
-<span style="background-color:#052C64"></span>
-
-## Success
-
-<span style="background-color:#479F76"></span>
-
-## Warning
-
-<span style="background-color:#FFF2CD"></span>
-
-## Risque Pro
-
-<span style="background-color:#dc3545"></span>
-
-## Light
-
-<span style="background-color:#DEE2E6"></span>
-
-## Dark
-
-<span style="background-color:#212529"></span>
-
-## Brand
-
-<span style="background-color:#4a3f59"></span>
-
-## BrandSecondary
-
-<span style="background-color:#ac1c81"></span>
-
-## BrandMuted
-
-<span style="background-color:#b7cbd6"></span>
-
-## BrandMutedLite
-
-<span style="background-color:#E7F3F9"></span>
-
-
-## HilitePrimary
-
-<span style="background-color:#0062ac"></span>
-
-## HiliteSecondary
-
-<span style="background-color:#e6bebf"></span>

package/src/designTokens/cnamColors.md

@@ -1,193 +0,0 @@
-# Color Palette Cnam Light
-
-## Primary
-
-<span style="background-color:#0000ff"></span>
-
-## Secondary
-
-<span style="background-color:#00bcd4"></span>
-
-## Accent
-
-<span style="background-color:#00bcd4"></span>
-
-## Error
-
-<span style="background-color:#ff9800"></span>
-
-## Info
-
-<span style="background-color:#0000ff"></span>
-
-## Success
-
-<span style="background-color:#4caf50"></span>
-
-## Warning
-
-<span style="background-color:#ffeb3b"></span>
-
-## Risk Pro
-
-<span style="background-color:#b22222"></span>
-
-## On Background
-
-<span style="background-color:#ffffff"></span>
-
-## On Surface Alt
-
-<span style="background-color:#e7ecf5"></span>
-
-## On Surface
-
-<span style="background-color:#ffffff"></span>
-
-## On Warning
-
-<span style="background-color:#fcf0d3">On Warning</span>
-
-## Overlay Fullpage
-
-<span style="background-color:#989b9b">Overlay Fullpage</span>
-
-## Overlay On Dark
-
-<span style="background-color:#ffffff">Overlay On Dark</span>
-
-## Overlay On Light
-
-<span style="background-color:#0c419a">Overlay On Light</span>
-
-## Interactive Default
-
-<span style="background-color:rgba(255, 255, 255, 0.0000)">Interactive Default</span>
-
-## Interactive Hover
-
-<span style="background-color:#e7ecf5">Interactive Hover</span>
-
-## Interactive Pressed
-
-<span style="background-color:#ced9eb">Interactive Pressed</span>
-
-## Interactive Focus
-
-<span style="background-color:#e7ecf5">Interactive Focus</span>
-
-## Interactive Disabled
-
-<span style="background-color:rgba(255, 255, 255, 0.0000)">Interactive Disabled</span>
-
-## Interactive Hover On Selected
-
-<span style="background-color:#ced9eb">Interactive Hover On Selected</span>
-
-## Background Main
-
-<span style="background-color:#e7ecf5">Background Main</span>
-
-## Background Surface
-
-<span style="background-color:#ffffff">Background Surface</span>
-
-## Background Surface Alt
-
-<span style="background-color:#e7ecf5">Background Surface Alt</span>
-
-## Background Main Alt
-
-<span style="background-color:#ffffff">Background Main Alt</span>
-
-## Background Raised
-
-<span style="background-color:#f8f9fc">Background Raised</span>
-
-## Background Accent
-
-<span style="background-color:#0c419a">Background Accent</span>
-
-## Background Accent Contrasted
-
-<span style="background-color:#07275c">Background Accent Contrasted</span>
-
-## Background Accent Alt
-
-<span style="background-color:#111212">Background Accent Alt</span>
-
-## Background Info
-
-<span style="background-color:#ced9eb">Background Info</span>
-
-## Background Info Subdued
-
-<span style="background-color:#e7ecf5">Background Info Subdued</span>
-
-## Background Info Contrasted
-
-<span style="background-color:#0c419a">Background Info Contrasted</span>
-
-## Background Success
-
-<span style="background-color:#cceee8">Background Success</span>
-
-## Background Success Subdued
-
-<span style="background-color:#e5f7f4">Background Success Subdued</span>
-
-## Background Success Contrasted
-
-<span style="background-color:#56c271">Background Success Contrasted</span>
-
-## Background Warning
-
-<span style="background-color:#fcf0d3">Background Warning</span>
-
-## Background Warning Subdued
-
-<span style="background-color:#fdf7e9">Background Warning Subdued</span>
-
-## Background Warning Contrasted
-
-<span style="background-color:#f0b323">Background Warning Contrasted</span>
-
-## Background Error
-
-<span style="background-color:#f9dcd7">Background Error</span>
-
-## Background Error Subdued
-
-<span style="background-color:#fcedeb">Background Error Subdued</span>
-
-## Background Error Contrasted
-
-<span style="background-color:#b33f2e">Background Error Contrasted</span>
-
-## Background Disabled
-
-<span style="background-color:#dddede">Background Disabled</span>
-
-## Background Disabled On Dark
-
-<span style="background-color:rgba(255, 255, 255, 0.0800)">Background Disabled On Dark</span>
-
-## Background Assure
-
-<span style="background-color:#ed76b3">Background Assure</span>
-
-## Background Professionnel
-
-<span style="background-color:#66c9ec">Background Professionnel</span>
-
-## Background Entreprise
-
-<span style="background-color:#f0b323">Background Entreprise</span>
-
-## transparentBlue18
-
-<span style="background-color:#a6d4eb">transparentBlue18</span>
-
-## transparentBlue8
-
-<span style="background-color:#ebf0f7">transparentBlue8</span>

package/src/designTokens/paColors.md

@@ -1,66 +0,0 @@
-# Color Palette Portail Agent Light
-
-## Primary
-
-<span style="background-color:#084298"></span>
-
-## Secondary
-
-<span style="background-color:#801F4F"></span>
-
-## Accent
-
-<span style="background-color:#0dcaf0"></span>
-
-## Error
-
-<span style="background-color:#B02A37"></span>
-
-## Info
-
-<span style="background-color:#052C64"></span>
-
-## Success
-
-<span style="background-color:#479F76"></span>
-
-## Warning
-
-<span style="background-color:#FFF2CD"></span>
-
-## Risque Pro
-
-<span style="background-color:#dc3545"></span>
-
-## Light
-
-<span style="background-color:#DEE2E6"></span>
-
-## Dark
-
-<span style="background-color:#212529"></span>
-
-## Brand
-
-<span style="background-color:#4a3f59"></span>
-
-## BrandSecondary
-
-<span style="background-color:#ac1c81"></span>
-
-## BrandMuted
-
-<span style="background-color:#b7cbd6"></span>
-
-## BrandMutedLite
-
-<span style="background-color:#E7F3F9"></span>
-
-
-## HilitePrimary
-
-<span style="background-color:#0062ac"></span>
-
-## HiliteSecondary
-
-<span style="background-color:#e6bebf"></span>