@amboss/design-system 1.16.3 → 1.16.4--canary1

package/build/scss/_theming.scss

@@ -0,0 +1,239 @@
+@mixin ds-theme-light {
+  & {
+    --color-canvas: #eef2f5;
+    --color-background-primary-default: #ffffff;
+    --color-background-secondary-default: #f5f7f9;
+    --color-background-secondary-hover: #eef2f5;
+    --color-background-secondary-active: #ffffff;
+    --color-background-accent-default: #0fa980;
+    --color-background-accent-hover: #0b8363;
+    --color-background-accent-active: #0a5c45;
+    --color-background-accent-disabled: rgba(15, 169, 128, 0.3);
+    --color-background-onAccent-default: #ffffff;
+    --color-background-onAccent-hover: #ffffff;
+    --color-background-onAccent-active: #ffffff;
+    --color-background-onAccent-disabled: rgba(255, 255, 255, 0.6);
+    --color-background-error-default: #dc4847;
+    --color-background-error-hover: #c02725;
+    --color-background-error-active: #c02725;
+    --color-background-error-disabled: rgba(238, 97, 96, 0.3);
+    --color-background-success-default: #0b8363;
+    --color-background-info-default: #295dae;
+    --color-background-warning-default: #df9411;
+    --color-background-accentSubtle-default: #e8f8f4;
+    --color-background-errorSubtle-default: #fde8e8;
+    --color-background-successSubtle-default: #e8f8f4;
+    --color-background-infoSubtle-default: #e7effe;
+    --color-background-warningSubtle-default: #fef3e1;
+    --color-background-highlight-default: #607585;
+    --color-background-highlight-hover: #40515e;
+    --color-background-contrast-default: #314554;
+    --color-background-transparent-default: rgba(255, 255, 255, 0);
+    --color-background-transparent-hover: rgba(96, 117, 133, 0.08);
+    --color-background-transparent-active: rgba(96, 117, 133, 0.08);
+    --color-background-backdrop-default: rgba(0, 0, 0, 0.6);
+    --color-text-primary-default: #1a1c1c;
+    --color-text-primary-hover: #1a1c1c;
+    --color-text-secondary-default: #40515e;
+    --color-text-secondary-hover: #40515e;
+    --color-text-tertiary-default: #607585;
+    --color-text-tertiary-disabled: rgba(64, 81, 94, 0.3);
+    --color-text-tertiary-hover: #40515e;
+    --color-text-quaternary-default: #a3b2bd;
+    --color-text-accent-default: #0b8363;
+    --color-text-accent-hover: #0a5c45;
+    --color-text-onAccent-default: #ffffff;
+    --color-text-onAccent-disabled: rgba(255, 255, 255, 0.6);
+    --color-text-info-default: #1c427d;
+    --color-text-error-default: #c02725;
+    --color-text-error-disabled: rgba(192, 39, 37, 0.3);
+    --color-text-warning-default: #314554;
+    --color-text-success-default: #0a5c45;
+    --color-icon-primary: #1a1c1c;
+    --color-icon-secondary: #40515e;
+    --color-icon-tertiary: #607585;
+    --color-icon-quaternary: #a3b2bd;
+    --color-icon-accent: #0b8363;
+    --color-icon-onAccent: #ffffff;
+    --color-icon-info: #295dae;
+    --color-icon-error: #dc4847;
+    --color-icon-warning: #df9411;
+    --color-icon-success: #0b8363;
+    --color-icon-brand: #0aa6b8;
+    --color-border-primary-default: #a3b2bd;
+    --color-border-primary-hover: #607585;
+    --color-border-primary-active: #40515e;
+    --color-border-primary-disabled: rgba(163, 178, 189, 0.3);
+    --color-border-secondary-default: rgba(163, 178, 189, 0.3);
+    --color-border-accent-default: #0b8363;
+    --color-border-error-default: #dc4847;
+    --color-border-accentSubtle-default: #8adcc6;
+    --color-divider-primary: #e0e6eb;
+    --color-divider-secondary: rgba(163, 178, 189, 0.3);
+    --color-toggle-background-highlight: #f3eb75;
+    --color-toggle-border-highlight: #f3eb75;
+    --color-badge-background-default: #ffffff;
+    --color-badge-background-green: #e8f8f4;
+    --color-badge-background-blue: #e7effe;
+    --color-badge-background-yellow: #fef3e1;
+    --color-badge-background-brand: #e7f6f8;
+    --color-badge-background-purple: #f2effb;
+    --color-badge-background-red: #fde8e8;
+    --color-badge-background-gray: #eef2f5;
+    --color-badge-text-default: #1a1c1c;
+    --color-badge-text-green: #0b8363;
+    --color-badge-text-blue: #295dae;
+    --color-badge-text-yellow: #9a6304;
+    --color-badge-text-brand: #067c89;
+    --color-badge-text-purple: #5d44ab;
+    --color-badge-text-red: #c02725;
+    --color-badge-text-gray: #607585;
+    --color-badge-border-default: #e0e6eb;
+    --color-badge-border-green: #e8f8f4;
+    --color-badge-border-blue: #e7effe;
+    --color-badge-border-yellow: #fef3e1;
+    --color-badge-border-brand: #e7f6f8;
+    --color-badge-border-purple: #f2effb;
+    --color-badge-border-red: #fde8e8;
+    --color-badge-border-gray: #eef2f5;
+    --color-segmented-progress-bar-monochrome: #607585;
+    --color-segmented-progress-bar-success: #39d6ac;
+    --color-segmented-progress-bar-warning: #f1d56b;
+    --color-segmented-progress-bar-alert: #f07575;
+    --color-segmented-progress-bar-in-progress: #e0e6eb;
+    --color-tag-background-gray: #e0e6eb;
+    --color-tag-background-blue: #d2e2f9;
+    --color-tag-text-gray: #40515e;
+    --color-tag-text-blue: #1c427d;
+    --color-destructive-tertiary-button-background-hover: rgba(238, 97, 96, 0.08);
+    --color-destructive-tertiary-button-background-active: rgba(238, 97, 96, 0.08);
+    --elevation-a: 0px 0.3px 0.6px rgba(0, 0, 0, 0.0035), 0px 2px 5px rgba(0, 0, 0, 0.07);
+    --elevation-b: 0px 2px 8px 0px rgba(0, 0, 0, 0.12), 0px 0.3px 1px 0px rgba(0, 0, 0, 0.01);
+    --elevation-c: 0px 0.5px 2.5px rgba(0, 0, 0, 0.16), 0px 4px 20px rgba(0, 0, 0, 0.2);
+    --elevation-d: 0px 0.5px 2.5px rgba(0, 0, 0, 0.16), 0px 4px 20px rgba(0, 0, 0, 0.2);
+  }
+}
+@mixin ds-theme-dark {
+  & {
+    --color-canvas: #1e2125;
+    --color-background-primary-default: #24282d;
+    --color-background-secondary-default: #282c34;
+    --color-background-secondary-hover: #393e47;
+    --color-background-secondary-active: #393e47;
+    --color-background-accent-default: #28816b;
+    --color-background-accent-hover: #41a48a;
+    --color-background-accent-active: #233d3d;
+    --color-background-accent-disabled: rgba(40, 129, 107, 0.3);
+    --color-background-onAccent-default: #ffffff;
+    --color-background-onAccent-hover: #ffffff;
+    --color-background-onAccent-active: #ffffff;
+    --color-background-onAccent-disabled: rgba(255, 255, 255, 0.6);
+    --color-background-error-default: #a45355;
+    --color-background-error-hover: #d07c7c;
+    --color-background-error-active: #4d3237;
+    --color-background-error-disabled: rgba(164, 83, 85, 0.3);
+    --color-background-success-default: #28816b;
+    --color-background-info-default: #2f538a;
+    --color-background-warning-default: #a4792d;
+    --color-background-accentSubtle-default: #233d3d;
+    --color-background-errorSubtle-default: #312b31;
+    --color-background-successSubtle-default: #262e33;
+    --color-background-infoSubtle-default: #282e39;
+    --color-background-warningSubtle-default: #32302f;
+    --color-background-highlight-default: #40454f;
+    --color-background-highlight-hover: #393e47;
+    --color-background-contrast-default: #ced1d6;
+    --color-background-transparent-default: rgba(255, 255, 255, 0);
+    --color-background-transparent-hover: rgba(147, 151, 159, 0.08);
+    --color-background-transparent-active: rgba(147, 151, 159, 0.08);
+    --color-background-backdrop-default: rgba(0, 0, 0, 0.6);
+    --color-text-primary-default: #ced1d6;
+    --color-text-primary-hover: #ffffff;
+    --color-text-secondary-default: #b9bcc3;
+    --color-text-secondary-hover: #ced1d6;
+    --color-text-tertiary-default: #93979f;
+    --color-text-tertiary-disabled: rgba(216, 218, 222, 0.3);
+    --color-text-tertiary-hover: #b9bcc3;
+    --color-text-quaternary-default: #757a84;
+    --color-text-accent-default: #41a48a;
+    --color-text-accent-hover: #a6f2dd;
+    --color-text-onAccent-default: #ffffff;
+    --color-text-onAccent-disabled: rgba(216, 218, 222, 0.3);
+    --color-text-info-default: #99c1fa;
+    --color-text-error-default: #f49a9a;
+    --color-text-error-disabled: rgba(244, 154, 154, 0.3);
+    --color-text-warning-default: #fae0b3;
+    --color-text-success-default: #a6f2dd;
+    --color-icon-primary: #d8dade;
+    --color-icon-secondary: #ced1d6;
+    --color-icon-tertiary: #93979f;
+    --color-icon-quaternary: #757a84;
+    --color-icon-accent: #41a48a;
+    --color-icon-onAccent: #ffffff;
+    --color-icon-info: #6e95cf;
+    --color-icon-error: #d07c7c;
+    --color-icon-warning: #cbac76;
+    --color-icon-success: #41a48a;
+    --color-icon-brand: #62b2bc;
+    --color-border-primary-default: #5b5f67;
+    --color-border-primary-hover: #757a84;
+    --color-border-primary-active: #93979f;
+    --color-border-primary-disabled: rgba(147, 151, 159, 0.08);
+    --color-border-secondary-default: rgba(147, 149, 159, 0.3);
+    --color-border-accent-default: #41a48a;
+    --color-border-error-default: #d07c7c;
+    --color-border-accentSubtle-default: #28816b;
+    --color-divider-primary: #40454f;
+    --color-divider-secondary: rgba(147, 151, 159, 0.08);
+    --color-toggle-background-highlight: #b2ab39;
+    --color-toggle-border-highlight: #b2ab39;
+    --color-badge-background-default: transparent;
+    --color-badge-background-green: transparent;
+    --color-badge-background-blue: transparent;
+    --color-badge-background-yellow: transparent;
+    --color-badge-background-brand: transparent;
+    --color-badge-background-purple: transparent;
+    --color-badge-background-red: transparent;
+    --color-badge-background-gray: transparent;
+    --color-badge-text-default: #ced1d6;
+    --color-badge-text-green: #41a48a;
+    --color-badge-text-blue: #6e95cf;
+    --color-badge-text-yellow: #cbac76;
+    --color-badge-text-brand: #62b2bc;
+    --color-badge-text-purple: #ad97f7;
+    --color-badge-text-red: #d07c7c;
+    --color-badge-text-gray: #93979f;
+    --color-badge-border-default: #393e47;
+    --color-badge-border-green: #393e47;
+    --color-badge-border-blue: #393e47;
+    --color-badge-border-yellow: #393e47;
+    --color-badge-border-brand: #393e47;
+    --color-badge-border-purple: #393e47;
+    --color-badge-border-red: #393e47;
+    --color-badge-border-gray: #393e47;
+    --color-segmented-progress-bar-monochrome: #ced1d6;
+    --color-segmented-progress-bar-success: #28816b;
+    --color-segmented-progress-bar-warning: #a4792d;
+    --color-segmented-progress-bar-alert: #a45355;
+    --color-segmented-progress-bar-in-progress: #5b5f67;
+    --color-tag-background-gray: #5b5f67;
+    --color-tag-background-blue: #2f538a;
+    --color-tag-text-gray: #ced1d6;
+    --color-tag-text-blue: #e7effe;
+    --color-destructive-tertiary-button-background-hover: rgba(164, 83, 85, 0.08);
+    --color-destructive-tertiary-button-background-active: rgba(164, 83, 85, 0.08);
+    --elevation-a: 0px 2px 5px 0px rgba(0, 0, 0, 0.07), 0px 0.3px 0.6px 0px rgba(0, 0, 0, 0), 0px 0px 0px 1px rgba(64, 69, 79, 0.4) inset;
+    --elevation-b: 0px 2px 8px 0px rgba(0, 0, 0, 0.12), 0px 0.3px 1px 0px rgba(0, 0, 0, 0.01), 0px 0px 0px 1px rgba(64, 69, 79, 0.4) inset;
+    --elevation-c: 0px 4px 20px 0px rgba(0, 0, 0, 0.2), 0px 0.5px 2.5px 0px rgba(0, 0, 0, 0.16), 0px 0px 0px 1px rgba(64, 69, 79, 0.5) inset;
+    --elevation-d: 0px 32px 112px 0px rgba(0, 0, 0, 0.24), 0px 4px 14px 0px rgba(0, 0, 0, 0.12), 0px 0px 0px 1px rgba(64, 69, 79, 0.5) inset;
+  }
+}
+@mixin theming($theme-name: ".dark-theme") {
+  :root {
+    @include ds-theme-light;
+  }
+
+  :global(#{$theme-name}) {
+    @include ds-theme-dark;
+  }
+}

package/build/scss/_variables.scss

@@ -0,0 +1,111 @@
+$colorCanvas: var(--color-canvas);
+$colorBackgroundPrimary: var(--color-background-primary-default);
+$colorBackgroundSecondary: var(--color-background-secondary-default);
+$colorBackgroundSecondaryHover: var(--color-background-secondary-hover);
+$colorBackgroundSecondaryActive: var(--color-background-secondary-active);
+$colorBackgroundAccent: var(--color-background-accent-default);
+$colorBackgroundAccentHover: var(--color-background-accent-hover);
+$colorBackgroundAccentActive: var(--color-background-accent-active);
+$colorBackgroundAccentDisabled: var(--color-background-accent-disabled);
+$colorBackgroundOnAccent: var(--color-background-onAccent-default);
+$colorBackgroundOnAccentHover: var(--color-background-onAccent-hover);
+$colorBackgroundOnAccentActive: var(--color-background-onAccent-active);
+$colorBackgroundOnAccentDisabled: var(--color-background-onAccent-disabled);
+$colorBackgroundError: var(--color-background-error-default);
+$colorBackgroundErrorHover: var(--color-background-error-hover);
+$colorBackgroundErrorActive: var(--color-background-error-active);
+$colorBackgroundErrorDisabled: var(--color-background-error-disabled);
+$colorBackgroundSuccess: var(--color-background-success-default);
+$colorBackgroundInfo: var(--color-background-info-default);
+$colorBackgroundWarning: var(--color-background-warning-default);
+$colorBackgroundAccentSubtle: var(--color-background-accentSubtle-default);
+$colorBackgroundErrorSubtle: var(--color-background-errorSubtle-default);
+$colorBackgroundSuccessSubtle: var(--color-background-successSubtle-default);
+$colorBackgroundInfoSubtle: var(--color-background-infoSubtle-default);
+$colorBackgroundWarningSubtle: var(--color-background-warningSubtle-default);
+$colorBackgroundHighlight: var(--color-background-highlight-default);
+$colorBackgroundHighlightHover: var(--color-background-highlight-hover);
+$colorBackgroundContrast: var(--color-background-contrast-default);
+$colorBackgroundTransparent: var(--color-background-transparent-default);
+$colorBackgroundTransparentHover: var(--color-background-transparent-hover);
+$colorBackgroundTransparentActive: var(--color-background-transparent-active);
+$colorBackgroundBackdrop: var(--color-background-backdrop-default);
+$colorTextPrimary: var(--color-text-primary-default);
+$colorTextPrimaryHover: var(--color-text-primary-hover);
+$colorTextSecondary: var(--color-text-secondary-default);
+$colorTextSecondaryHover: var(--color-text-secondary-hover);
+$colorTextTertiary: var(--color-text-tertiary-default);
+$colorTextTertiaryDisabled: var(--color-text-tertiary-disabled);
+$colorTextTertiaryHover: var(--color-text-tertiary-hover);
+$colorTextQuaternary: var(--color-text-quaternary-default);
+$colorTextAccent: var(--color-text-accent-default);
+$colorTextAccentHover: var(--color-text-accent-hover);
+$colorTextOnAccent: var(--color-text-onAccent-default);
+$colorTextOnAccentDisabled: var(--color-text-onAccent-disabled);
+$colorTextInfo: var(--color-text-info-default);
+$colorTextError: var(--color-text-error-default);
+$colorTextErrorDisabled: var(--color-text-error-disabled);
+$colorTextWarning: var(--color-text-warning-default);
+$colorTextSuccess: var(--color-text-success-default);
+$colorIconPrimary: var(--color-icon-primary);
+$colorIconSecondary: var(--color-icon-secondary);
+$colorIconTertiary: var(--color-icon-tertiary);
+$colorIconQuaternary: var(--color-icon-quaternary);
+$colorIconAccent: var(--color-icon-accent);
+$colorIconOnAccent: var(--color-icon-onAccent);
+$colorIconInfo: var(--color-icon-info);
+$colorIconError: var(--color-icon-error);
+$colorIconWarning: var(--color-icon-warning);
+$colorIconSuccess: var(--color-icon-success);
+$colorIconBrand: var(--color-icon-brand);
+$colorBorderPrimary: var(--color-border-primary-default);
+$colorBorderPrimaryHover: var(--color-border-primary-hover);
+$colorBorderPrimaryActive: var(--color-border-primary-active);
+$colorBorderPrimaryDisabled: var(--color-border-primary-disabled);
+$colorBorderSecondary: var(--color-border-secondary-default);
+$colorBorderAccent: var(--color-border-accent-default);
+$colorBorderError: var(--color-border-error-default);
+$colorBorderAccentSubtle: var(--color-border-accentSubtle-default);
+$colorDividerPrimary: var(--color-divider-primary);
+$colorDividerSecondary: var(--color-divider-secondary);
+$colorToggleBackgroundHighlight: var(--color-toggle-background-highlight);
+$colorToggleBorderHighlight: var(--color-toggle-border-highlight);
+$colorBadgeBackground: var(--color-badge-background-default);
+$colorBadgeBackgroundGreen: var(--color-badge-background-green);
+$colorBadgeBackgroundBlue: var(--color-badge-background-blue);
+$colorBadgeBackgroundYellow: var(--color-badge-background-yellow);
+$colorBadgeBackgroundBrand: var(--color-badge-background-brand);
+$colorBadgeBackgroundPurple: var(--color-badge-background-purple);
+$colorBadgeBackgroundRed: var(--color-badge-background-red);
+$colorBadgeBackgroundGray: var(--color-badge-background-gray);
+$colorBadgeText: var(--color-badge-text-default);
+$colorBadgeTextGreen: var(--color-badge-text-green);
+$colorBadgeTextBlue: var(--color-badge-text-blue);
+$colorBadgeTextYellow: var(--color-badge-text-yellow);
+$colorBadgeTextBrand: var(--color-badge-text-brand);
+$colorBadgeTextPurple: var(--color-badge-text-purple);
+$colorBadgeTextRed: var(--color-badge-text-red);
+$colorBadgeTextGray: var(--color-badge-text-gray);
+$colorBadgeBorder: var(--color-badge-border-default);
+$colorBadgeBorderGreen: var(--color-badge-border-green);
+$colorBadgeBorderBlue: var(--color-badge-border-blue);
+$colorBadgeBorderYellow: var(--color-badge-border-yellow);
+$colorBadgeBorderBrand: var(--color-badge-border-brand);
+$colorBadgeBorderPurple: var(--color-badge-border-purple);
+$colorBadgeBorderRed: var(--color-badge-border-red);
+$colorBadgeBorderGray: var(--color-badge-border-gray);
+$colorSegmentedProgressBarMonochrome: var(--color-segmented-progress-bar-monochrome);
+$colorSegmentedProgressBarSuccess: var(--color-segmented-progress-bar-success);
+$colorSegmentedProgressBarWarning: var(--color-segmented-progress-bar-warning);
+$colorSegmentedProgressBarAlert: var(--color-segmented-progress-bar-alert);
+$colorSegmentedProgressBarInProgress: var(--color-segmented-progress-bar-in-progress);
+$colorTagBackgroundGray: var(--color-tag-background-gray);
+$colorTagBackgroundBlue: var(--color-tag-background-blue);
+$colorTagTextGray: var(--color-tag-text-gray);
+$colorTagTextBlue: var(--color-tag-text-blue);
+$colorDestructiveTertiaryButtonBackgroundHover: var(--color-destructive-tertiary-button-background-hover);
+$colorDestructiveTertiaryButtonBackgroundActive: var(--color-destructive-tertiary-button-background-active);
+$elevationA: var(--elevation-a);
+$elevationB: var(--elevation-b);
+$elevationC: var(--elevation-c);
+$elevationD: var(--elevation-d);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@amboss/design-system",
-  "version": "1.16.3",
+  "version": "1.16.4--canary1",
   "description": "the design system for AMBOSS products",
   "author": "Bagrat Gobedashvili",
   "license": "ISC",
@@ -12,7 +12,7 @@
       "import": "./build/esm/src/index.js",
       "require": "./build/cjs/src/index.js"
     },
-    "./scss/": "./build/scss/themes/"
+    "./scss/": "./build/scss/"
   },
   "sideEffects": false,
   "bugs": {

package/build/scss/themes/dark.scss

@@ -1,111 +0,0 @@
-
-// Do not edit directly
-// Generated on Thu, 05 Oct 2023 11:16:00 GMT
-
-$dark-color-canvas: #1e2125;
-$dark-color-background-primary-default: #24282d;
-$dark-color-background-secondary-default: #282c34;
-$dark-color-background-secondary-hover: #393e47;
-$dark-color-background-secondary-active: #393e47;
-$dark-color-background-accent-default: #28816b;
-$dark-color-background-accent-hover: #41a48a;
-$dark-color-background-accent-active: #233d3d;
-$dark-color-background-accent-disabled: rgba(40, 129, 107, 0.3);
-$dark-color-background-onAccent-default: #ffffff;
-$dark-color-background-onAccent-hover: #ffffff;
-$dark-color-background-onAccent-active: #ffffff;
-$dark-color-background-onAccent-disabled: rgba(255, 255, 255, 0.6);
-$dark-color-background-error-default: #a45355;
-$dark-color-background-error-hover: #d07c7c;
-$dark-color-background-error-active: #4d3237;
-$dark-color-background-error-disabled: rgba(164, 83, 85, 0.3);
-$dark-color-background-success-default: #28816b;
-$dark-color-background-info-default: #2f538a;
-$dark-color-background-warning-default: #a4792d;
-$dark-color-background-accentSubtle-default: #233d3d;
-$dark-color-background-errorSubtle-default: #312b31;
-$dark-color-background-successSubtle-default: #262e33;
-$dark-color-background-infoSubtle-default: #282e39;
-$dark-color-background-warningSubtle-default: #32302f;
-$dark-color-background-highlight-default: #40454f;
-$dark-color-background-highlight-hover: #393e47;
-$dark-color-background-contrast-default: #ced1d6;
-$dark-color-background-transparent-default: rgba(255, 255, 255, 0);
-$dark-color-background-transparent-hover: rgba(147, 151, 159, 0.08);
-$dark-color-background-transparent-active: rgba(147, 151, 159, 0.08);
-$dark-color-background-backdrop-default: rgba(0, 0, 0, 0.6);
-$dark-color-text-primary-default: #ced1d6;
-$dark-color-text-primary-hover: #ffffff;
-$dark-color-text-secondary-default: #b9bcc3;
-$dark-color-text-secondary-hover: #ced1d6;
-$dark-color-text-tertiary-default: #93979f;
-$dark-color-text-tertiary-disabled: rgba(216, 218, 222, 0.3);
-$dark-color-text-tertiary-hover: #b9bcc3;
-$dark-color-text-quaternary-default: #757a84;
-$dark-color-text-accent-default: #41a48a;
-$dark-color-text-accent-hover: #a6f2dd;
-$dark-color-text-onAccent-default: #ffffff;
-$dark-color-text-onAccent-disabled: rgba(216, 218, 222, 0.3);
-$dark-color-text-info-default: #99c1fa;
-$dark-color-text-error-default: #f49a9a;
-$dark-color-text-error-disabled: rgba(244, 154, 154, 0.3);
-$dark-color-text-warning-default: #fae0b3;
-$dark-color-text-success-default: #a6f2dd;
-$dark-color-icon-primary: #d8dade;
-$dark-color-icon-secondary: #ced1d6;
-$dark-color-icon-tertiary: #93979f;
-$dark-color-icon-quaternary: #757a84;
-$dark-color-icon-accent: #41a48a;
-$dark-color-icon-onAccent: #ffffff;
-$dark-color-icon-info: #6e95cf;
-$dark-color-icon-error: #d07c7c;
-$dark-color-icon-warning: #cbac76;
-$dark-color-icon-success: #41a48a;
-$dark-color-icon-brand: #62b2bc;
-$dark-color-border-primary-default: #5b5f67;
-$dark-color-border-primary-hover: #757a84;
-$dark-color-border-primary-active: #93979f;
-$dark-color-border-primary-disabled: rgba(147, 151, 159, 0.08);
-$dark-color-border-secondary-default: rgba(147, 149, 159, 0.3);
-$dark-color-border-accent-default: #41a48a;
-$dark-color-border-error-default: #d07c7c;
-$dark-color-border-accentSubtle-default: #28816b;
-$dark-color-divider-primary: #40454f;
-$dark-color-divider-secondary: rgba(147, 151, 159, 0.08);
-$dark-color-toggle-background-highlight: #b2ab39;
-$dark-color-toggle-border-highlight: #b2ab39;
-$dark-color-badge-background-default: transparent;
-$dark-color-badge-background-green: transparent;
-$dark-color-badge-background-blue: transparent;
-$dark-color-badge-background-yellow: transparent;
-$dark-color-badge-background-brand: transparent;
-$dark-color-badge-background-purple: transparent;
-$dark-color-badge-background-red: transparent;
-$dark-color-badge-background-gray: transparent;
-$dark-color-badge-text-default: #ced1d6;
-$dark-color-badge-text-green: #41a48a;
-$dark-color-badge-text-blue: #6e95cf;
-$dark-color-badge-text-yellow: #cbac76;
-$dark-color-badge-text-brand: #62b2bc;
-$dark-color-badge-text-purple: #ad97f7;
-$dark-color-badge-text-red: #d07c7c;
-$dark-color-badge-text-gray: #93979f;
-$dark-color-badge-border-default: #393e47;
-$dark-color-badge-border-green: #393e47;
-$dark-color-badge-border-blue: #393e47;
-$dark-color-badge-border-yellow: #393e47;
-$dark-color-badge-border-brand: #393e47;
-$dark-color-badge-border-purple: #393e47;
-$dark-color-badge-border-red: #393e47;
-$dark-color-badge-border-gray: #393e47;
-$dark-color-segmented-progress-bar-monochrome: #ced1d6;
-$dark-color-segmented-progress-bar-success: #28816b;
-$dark-color-segmented-progress-bar-warning: #a4792d;
-$dark-color-segmented-progress-bar-alert: #a45355;
-$dark-color-segmented-progress-bar-in-progress: #5b5f67;
-$dark-color-tag-background-gray: #5b5f67;
-$dark-color-tag-background-blue: #2f538a;
-$dark-color-tag-text-gray: #ced1d6;
-$dark-color-tag-text-blue: #e7effe;
-$dark-color-destructive-tertiary-button-background-hover: rgba(164, 83, 85, 0.08);
-$dark-color-destructive-tertiary-button-background-active: rgba(164, 83, 85, 0.08);

package/build/scss/themes/light.scss

@@ -1,111 +0,0 @@
-
-// Do not edit directly
-// Generated on Thu, 05 Oct 2023 11:16:00 GMT
-
-$light-color-canvas: #eef2f5;
-$light-color-background-primary-default: #ffffff;
-$light-color-background-secondary-default: #f5f7f9;
-$light-color-background-secondary-hover: #eef2f5;
-$light-color-background-secondary-active: #ffffff;
-$light-color-background-accent-default: #0fa980;
-$light-color-background-accent-hover: #0b8363;
-$light-color-background-accent-active: #0a5c45;
-$light-color-background-accent-disabled: rgba(15, 169, 128, 0.3);
-$light-color-background-onAccent-default: #ffffff;
-$light-color-background-onAccent-hover: #ffffff;
-$light-color-background-onAccent-active: #ffffff;
-$light-color-background-onAccent-disabled: rgba(255, 255, 255, 0.6);
-$light-color-background-error-default: #dc4847;
-$light-color-background-error-hover: #c02725;
-$light-color-background-error-active: #c02725;
-$light-color-background-error-disabled: rgba(238, 97, 96, 0.3);
-$light-color-background-success-default: #0b8363;
-$light-color-background-info-default: #295dae;
-$light-color-background-warning-default: #df9411;
-$light-color-background-accentSubtle-default: #e8f8f4;
-$light-color-background-errorSubtle-default: #fde8e8;
-$light-color-background-successSubtle-default: #e8f8f4;
-$light-color-background-infoSubtle-default: #e7effe;
-$light-color-background-warningSubtle-default: #fef3e1;
-$light-color-background-highlight-default: #607585;
-$light-color-background-highlight-hover: #40515e;
-$light-color-background-contrast-default: #314554;
-$light-color-background-transparent-default: rgba(255, 255, 255, 0);
-$light-color-background-transparent-hover: rgba(96, 117, 133, 0.08);
-$light-color-background-transparent-active: rgba(96, 117, 133, 0.08);
-$light-color-background-backdrop-default: rgba(0, 0, 0, 0.6);
-$light-color-text-primary-default: #1a1c1c;
-$light-color-text-primary-hover: #1a1c1c;
-$light-color-text-secondary-default: #40515e;
-$light-color-text-secondary-hover: #40515e;
-$light-color-text-tertiary-default: #607585;
-$light-color-text-tertiary-disabled: rgba(64, 81, 94, 0.3);
-$light-color-text-tertiary-hover: #40515e;
-$light-color-text-quaternary-default: #a3b2bd;
-$light-color-text-accent-default: #0b8363;
-$light-color-text-accent-hover: #0a5c45;
-$light-color-text-onAccent-default: #ffffff;
-$light-color-text-onAccent-disabled: rgba(255, 255, 255, 0.6);
-$light-color-text-info-default: #1c427d;
-$light-color-text-error-default: #c02725;
-$light-color-text-error-disabled: rgba(192, 39, 37, 0.3);
-$light-color-text-warning-default: #314554;
-$light-color-text-success-default: #0a5c45;
-$light-color-icon-primary: #1a1c1c;
-$light-color-icon-secondary: #40515e;
-$light-color-icon-tertiary: #607585;
-$light-color-icon-quaternary: #a3b2bd;
-$light-color-icon-accent: #0b8363;
-$light-color-icon-onAccent: #ffffff;
-$light-color-icon-info: #295dae;
-$light-color-icon-error: #dc4847;
-$light-color-icon-warning: #df9411;
-$light-color-icon-success: #0b8363;
-$light-color-icon-brand: #0aa6b8;
-$light-color-border-primary-default: #a3b2bd;
-$light-color-border-primary-hover: #607585;
-$light-color-border-primary-active: #40515e;
-$light-color-border-primary-disabled: rgba(163, 178, 189, 0.3);
-$light-color-border-secondary-default: rgba(163, 178, 189, 0.3);
-$light-color-border-accent-default: #0b8363;
-$light-color-border-error-default: #dc4847;
-$light-color-border-accentSubtle-default: #8adcc6;
-$light-color-divider-primary: #e0e6eb;
-$light-color-divider-secondary: rgba(163, 178, 189, 0.3);
-$light-color-toggle-background-highlight: #f3eb75;
-$light-color-toggle-border-highlight: #f3eb75;
-$light-color-badge-background-default: #ffffff;
-$light-color-badge-background-green: #e8f8f4;
-$light-color-badge-background-blue: #e7effe;
-$light-color-badge-background-yellow: #fef3e1;
-$light-color-badge-background-brand: #e7f6f8;
-$light-color-badge-background-purple: #f2effb;
-$light-color-badge-background-red: #fde8e8;
-$light-color-badge-background-gray: #eef2f5;
-$light-color-badge-text-default: #1a1c1c;
-$light-color-badge-text-green: #0b8363;
-$light-color-badge-text-blue: #295dae;
-$light-color-badge-text-yellow: #9a6304;
-$light-color-badge-text-brand: #067c89;
-$light-color-badge-text-purple: #5d44ab;
-$light-color-badge-text-red: #c02725;
-$light-color-badge-text-gray: #607585;
-$light-color-badge-border-default: #e0e6eb;
-$light-color-badge-border-green: #e8f8f4;
-$light-color-badge-border-blue: #e7effe;
-$light-color-badge-border-yellow: #fef3e1;
-$light-color-badge-border-brand: #e7f6f8;
-$light-color-badge-border-purple: #f2effb;
-$light-color-badge-border-red: #fde8e8;
-$light-color-badge-border-gray: #eef2f5;
-$light-color-segmented-progress-bar-monochrome: #607585;
-$light-color-segmented-progress-bar-success: #39d6ac;
-$light-color-segmented-progress-bar-warning: #f1d56b;
-$light-color-segmented-progress-bar-alert: #f07575;
-$light-color-segmented-progress-bar-in-progress: #e0e6eb;
-$light-color-tag-background-gray: #e0e6eb;
-$light-color-tag-background-blue: #d2e2f9;
-$light-color-tag-text-gray: #40515e;
-$light-color-tag-text-blue: #1c427d;
-$light-color-destructive-tertiary-button-background-hover: rgba(238, 97, 96, 0.08);
-$light-color-destructive-tertiary-button-background-active: rgba(238, 97, 96, 0.08);