@bi-digital/css 0.3.5 → 0.4.1

package/dist/tokens.css

@@ -1,4 +1,4 @@
-:root, :host {
+:root {
   --bi-basic-key: #000;
   --bi-basic-white: #fff;
   --bi-neutral-0: #fafbfc;
@@ -148,17 +148,203 @@
   --bi-scale-64x: 16rem;
   --bi-scale-80x: 20rem;
   --bi-scale-max: 624.938rem;
-  --bi-opacity-dark-80: #26333f33;
-  --bi-opacity-dark-50: #26333f80;
-  --bi-opacity-light-100: #fff0;
-  --bi-opacity-light-80: #fff3;
-  --bi-opacity-light-50: #ffffff80;
+  --bi-opacity-dark-80: rgba(38, 51, 63, .2);
+  --bi-opacity-dark-50: rgba(38, 51, 63, .5);
+  --bi-opacity-light-100: rgba(255, 255, 255, 0);
+  --bi-opacity-light-80: rgba(255, 255, 255, .2);
+  --bi-opacity-light-50: rgba(255, 255, 255, .5);
   --bi-stroke-default: .09375rem;
-  --bi-elevation-25: #26333f26;
-  --bi-states-hover-dark: #26333f1a;
-  --bi-states-hover-light: #ffffff1a;
-  --bi-states-press-dark: #26333f26;
-  --bi-states-press-light: #ffffff26;
+  --bi-elevation-25: rgba(38, 51, 63, .15);
+  --bi-states-hover-dark: rgba(38, 51, 63, .1);
+  --bi-states-hover-light: rgba(255, 255, 255, .1);
+  --bi-states-press-dark: rgba(38, 51, 63, .15);
+  --bi-states-press-light: rgba(255, 255, 255, .15);
+  --bi-stroke-none: var(--bi-scale-0);
+  --bi-stroke-thin: var(--bi-scale-0-25x);
+  --bi-stroke-thick: var(--bi-scale-0-50x);
+  --bi-stroke-color-1: var(--bi-neutral-15);
+  --bi-stroke-color-2: var(--bi-neutral-25);
+  --bi-stroke-color-3: var(--bi-neutral-50);
+  --bi-radius-none: var(--bi-scale-0);
+  --bi-radius-small: var(--bi-scale-0-50x);
+  --bi-radius-medium: var(--bi-scale-1x);
+  --bi-radius-large: var(--bi-scale-2x);
+  --bi-radius-xl: var(--bi-scale-3x);
+  --bi-radius-brand: var(--bi-scale-12x);
+  --bi-radius-full: var(--bi-scale-max);
+  --bi-icon-small: var(--bi-scale-5x);
+  --bi-icon-medium: var(--bi-scale-6x);
+  --bi-icon-large: var(--bi-scale-8x);
+  --bi-icon-xl: var(--bi-scale-10x);
+  --bi-icon-2xl: var(--bi-scale-11x);
+  --bi-icon-primary: var(--bi-neutral-90);
+  --bi-icon-secondary: var(--bi-neutral-60);
+  --bi-icon-disabled: var(--bi-neutral-50);
+  --bi-icon-link: var(--bi-primary-50);
+  --bi-layout-navbar-height: var(--bi-scale-16x);
+}
+
+:host {
+  --bi-basic-key: #000;
+  --bi-basic-white: #fff;
+  --bi-neutral-0: #fafbfc;
+  --bi-neutral-5: #f5f7fa;
+  --bi-neutral-10: #e4e8ed;
+  --bi-neutral-15: #d5dde4;
+  --bi-neutral-20: #c8d1db;
+  --bi-neutral-25: #bac6d2;
+  --bi-neutral-30: #acbbca;
+  --bi-neutral-40: #90a3b7;
+  --bi-neutral-50: #597694;
+  --bi-neutral-60: #475e75;
+  --bi-neutral-70: #3e5266;
+  --bi-neutral-75: #344557;
+  --bi-neutral-80: #303f4f;
+  --bi-neutral-85: #2b3947;
+  --bi-neutral-90: #26333f;
+  --bi-neutral-95: #222d38;
+  --bi-neutral-100: #171f26;
+  --bi-primary-0: #ebf3ff;
+  --bi-primary-5: #d9e6f9;
+  --bi-primary-10: #c5d9f7;
+  --bi-primary-15: #b2cdf4;
+  --bi-primary-20: #9ec0f1;
+  --bi-primary-25: #8bb3ee;
+  --bi-primary-30: #75a5f1;
+  --bi-primary-40: #6196f4;
+  --bi-primary-50: #0a64ff;
+  --bi-primary-60: #0b4db4;
+  --bi-primary-70: #0b49a1;
+  --bi-primary-75: #0c468f;
+  --bi-primary-80: #093f82;
+  --bi-primary-85: #083a76;
+  --bi-primary-90: #042f5b;
+  --bi-primary-95: #002341;
+  --bi-primary-100: #001932;
+  --bi-secondary-0: #fffbeb;
+  --bi-secondary-5: #fcf6df;
+  --bi-secondary-10: #fff2bf;
+  --bi-secondary-15: #ffea95;
+  --bi-secondary-20: #ffe680;
+  --bi-secondary-25: #ffe26a;
+  --bi-secondary-30: #ffde55;
+  --bi-secondary-40: #ffd52b;
+  --bi-secondary-50: #ffcd00;
+  --bi-secondary-60: #deb300;
+  --bi-secondary-70: #bd9800;
+  --bi-secondary-75: #9d7e00;
+  --bi-secondary-80: #7c6400;
+  --bi-secondary-85: #5b4900;
+  --bi-secondary-90: #4a3c01;
+  --bi-secondary-95: #3a2f00;
+  --bi-secondary-100: #262000;
+  --bi-info-0: #f3ebff;
+  --bi-info-5: #e6d5ff;
+  --bi-info-10: #d9bfff;
+  --bi-info-15: #cdaaff;
+  --bi-info-20: #c094ff;
+  --bi-info-25: #b480ff;
+  --bi-info-30: #a76aff;
+  --bi-info-40: #822bff;
+  --bi-info-50: #6900ff;
+  --bi-info-60: #5c03dc;
+  --bi-info-70: #4f05b9;
+  --bi-info-75: #420896;
+  --bi-info-80: #3b0984;
+  --bi-info-85: #350a73;
+  --bi-info-90: #2e0b61;
+  --bi-info-95: #280d50;
+  --bi-info-100: #1a0833;
+  --bi-warning-0: #fffbeb;
+  --bi-warning-5: #fff7d5;
+  --bi-warning-10: #fff2bf;
+  --bi-warning-15: #ffea95;
+  --bi-warning-20: #ffe680;
+  --bi-warning-25: #ffe26a;
+  --bi-warning-30: #ffde55;
+  --bi-warning-40: #ffd52b;
+  --bi-warning-50: #ffcd00;
+  --bi-warning-60: #deb300;
+  --bi-warning-70: #bd9800;
+  --bi-warning-75: #9d7e00;
+  --bi-warning-80: #7c6400;
+  --bi-warning-85: #5b4900;
+  --bi-warning-90: #4a3c01;
+  --bi-warning-95: #3a2f00;
+  --bi-warning-100: #262000;
+  --bi-success-0: #ebffeb;
+  --bi-success-5: #d5f4d6;
+  --bi-success-10: #bfeec2;
+  --bi-success-15: #aae8ae;
+  --bi-success-20: #95e299;
+  --bi-success-25: #80dd85;
+  --bi-success-30: #55d15c;
+  --bi-success-40: #2bc634;
+  --bi-success-50: #00ab0b;
+  --bi-success-60: #04a30d;
+  --bi-success-70: #078b0f;
+  --bi-success-75: #0b7411;
+  --bi-success-80: #0f5d13;
+  --bi-success-85: #124515;
+  --bi-success-90: #143a16;
+  --bi-success-95: #162e17;
+  --bi-success-100: #0f1f0f;
+  --bi-alert-0: #fff1f0;
+  --bi-alert-5: #ffe1df;
+  --bi-alert-10: #ffd7d5;
+  --bi-alert-15: #ffc3bf;
+  --bi-alert-20: #ffafaa;
+  --bi-alert-25: #ff8780;
+  --bi-alert-30: #ff5f55;
+  --bi-alert-40: #ff372b;
+  --bi-alert-50: #ff0f00;
+  --bi-alert-60: #e41100;
+  --bi-alert-70: #c91300;
+  --bi-alert-75: #ae1601;
+  --bi-alert-80: #931801;
+  --bi-alert-85: #731a15;
+  --bi-alert-90: #6a1b16;
+  --bi-alert-95: #5d1c18;
+  --bi-alert-100: #280c0a;
+  --bi-scale-0: 0;
+  --bi-scale-0-25x: .0625rem;
+  --bi-scale-0-50x: .125rem;
+  --bi-scale-0-75x: .1875rem;
+  --bi-scale-1x: .25rem;
+  --bi-scale-1-5x: .375rem;
+  --bi-scale-2x: .5rem;
+  --bi-scale-3x: .75rem;
+  --bi-scale-4x: 1rem;
+  --bi-scale-5x: 1.25rem;
+  --bi-scale-6x: 1.5rem;
+  --bi-scale-8x: 2rem;
+  --bi-scale-9x: 2.25rem;
+  --bi-scale-10x: 2.5rem;
+  --bi-scale-11x: 2.75rem;
+  --bi-scale-12x: 3rem;
+  --bi-scale-14x: 3.5rem;
+  --bi-scale-16x: 4rem;
+  --bi-scale-20x: 5rem;
+  --bi-scale-24x: 6rem;
+  --bi-scale-32x: 8rem;
+  --bi-scale-36x: 9rem;
+  --bi-scale-40x: 10rem;
+  --bi-scale-48x: 12rem;
+  --bi-scale-56x: 14rem;
+  --bi-scale-64x: 16rem;
+  --bi-scale-80x: 20rem;
+  --bi-scale-max: 624.938rem;
+  --bi-opacity-dark-80: rgba(38, 51, 63, .2);
+  --bi-opacity-dark-50: rgba(38, 51, 63, .5);
+  --bi-opacity-light-100: rgba(255, 255, 255, 0);
+  --bi-opacity-light-80: rgba(255, 255, 255, .2);
+  --bi-opacity-light-50: rgba(255, 255, 255, .5);
+  --bi-stroke-default: .09375rem;
+  --bi-elevation-25: rgba(38, 51, 63, .15);
+  --bi-states-hover-dark: rgba(38, 51, 63, .1);
+  --bi-states-hover-light: rgba(255, 255, 255, .1);
+  --bi-states-press-dark: rgba(38, 51, 63, .15);
+  --bi-states-press-light: rgba(255, 255, 255, .15);
   --bi-stroke-none: var(--bi-scale-0);
   --bi-stroke-thin: var(--bi-scale-0-25x);
   --bi-stroke-thick: var(--bi-scale-0-50x);

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@bi-digital/css",
   "type": "module",
-  "version": "0.3.5",
+  "version": "0.4.1",
   "engines": {
     "node": "^20.19.0 || >=22.12.0"
   },
@@ -32,10 +32,10 @@
   "devDependencies": {
     "browserslist": "^4.26.2",
     "glob": "^11.0.3",
-    "lightningcss": "^1.30.1",
+    "lightningcss": "^1.30.2",
     "modern-normalize": "^3.0.1",
     "rimraf": "^6.0.1",
-    "@bi-digital/tokens": "0.3.5"
+    "@bi-digital/tokens": "0.4.1"
   },
   "scripts": {
     "build": "rimraf dist && node config.js",