@dukaandost/tokens 1.1.0 → 1.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/dist/index.cjs +1 -1
  2. package/dist/index.js +9 -9
  3. package/dist/tokens.css +1 -1
  4. package/dist/tokens.d.ts +18 -18
  5. package/dist/tokens.d.ts.map +1 -1
  6. package/package.json +1 -1
  7. package/src/tokens.css +58 -17
package/dist/index.cjs CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t={brand:{primary:"#180C44",accent:"#8A38F5",accentSubtle:"#EBE9F3",accentMuted:"#A499C6",hover:"#3B2395"},semantic:{error:"#E9336C",errorStrong:"#C10000",errorLight:"#EE6691",success:"#099B30",successDark:"#04841B",successDeep:"#065B15",successMuted:"#82AE37",warning:"#FCC13E",warningText:"#E4AC32",info:"#1B4DFF",infoStrong:"#0065F7",infoDark:"#02409A",infoMuted:"#127498"},text:{primary:"#1A1A1A",secondary:"#2E2E2E",tertiary:"#545454",disabled:"#7F7F7F",inverse:"#FFFFFF"},border:{default:"#D3D3D3",subtle:"#E0E0E0",hover:"#A9A9A9"},surface:{default:"#FFFFFF",subtle:"#F5F5F5",subtleHover:"#F6F6F6",accent:"#F4F2FF"},focus:{glow:"#EE6691",border:"#E9336C"},badge:{green:{bg:"#E4FFEC",border:"#5FD87F",text:"#099B30"},darkGreen:{bg:"#B3D9BA",border:"#04841B",text:"#065B15"},blue:{bg:"#E6EFFC",border:"#0065F7",text:"#02409A"},purple:{bg:"#FFE2FF",border:"#DF00DF",text:"#9A009A"},violet:{bg:"#E8C1FF",border:"#B331FF",text:"#921EC3"},yellow:{bg:"#FFF6E2",border:"#FCC13E",text:"#E4AC32"},teal:{bg:"#E3FDFF",border:"#18CBDB",text:"#0DACBB"},pink:{bg:"#FFE7EE",border:"#EE6691",text:"#E30047"},red:{bg:"#FFE2E2",border:"#FF2929",text:"#C10000"},orange:{bg:"#FDE1D4",border:"#FF6924",text:"#F65F1A"},grey:{bg:"#E3E3E3",border:"#7F7F7F",text:"#545454"},brown:{bg:"#F4E8DC",border:"#B87333",text:"#8B5E34"}}},r={brandAlpha:"linear-gradient(90deg, #FF51E3 0%, #8048BE 50%, #02409A 100%)",brandBeta:"linear-gradient(90deg, #02409A 0%, #066E65 25%, #099B30 50%)",brandGamma:"linear-gradient(90deg, #099B30 0%, #82AE37 50%, #FCC13E 100%)",brandDelta:"linear-gradient(90deg, #099B30 0%, #127498 50%, #1B4DFF 100%)"},e={heading:"'Amsi Pro', 'Inter', system-ui, sans-serif",body:"'Nunito Sans', 'Inter', system-ui, sans-serif",code:"'SF Mono', 'Fira Code', 'Fira Mono', 'Roboto Mono', monospace"},i={display:{size:"40px",weight:400,lineHeight:1.37,letterSpacing:"0em",fontFamily:e.heading},headingXl:{size:"32px",weight:400,lineHeight:1.37,letterSpacing:"0em",fontFamily:e.heading},headingLg:{size:"24px",weight:400,lineHeight:1.37,letterSpacing:"0em",fontFamily:e.heading},headingMd:{size:"20px",weight:400,lineHeight:1.37,letterSpacing:"0em",fontFamily:e.heading},headingSm:{size:"18px",weight:400,lineHeight:1.36,letterSpacing:"0em",fontFamily:e.body},bodyLg:{size:"16px",weight:400,lineHeight:1.36,letterSpacing:"0em",fontFamily:e.body},bodyMd:{size:"14px",weight:400,lineHeight:1.36,letterSpacing:"0em",fontFamily:e.body},bodySm:{size:"12px",weight:400,lineHeight:1.36,letterSpacing:"0em",fontFamily:e.body},label:{size:"13px",weight:500,lineHeight:1.4,letterSpacing:"0.03em",fontFamily:e.body},labelSm:{size:"11px",weight:500,lineHeight:1.4,letterSpacing:"0.04em",fontFamily:e.body},code:{size:"13px",weight:400,lineHeight:1.5,letterSpacing:"0em",fontFamily:e.code}},n={px:"1px","0.5":"2px",1:"4px",2:"8px",3:"12px",4:"16px",5:"20px",6:"24px",8:"32px",10:"40px",12:"48px"},o={none:"0px",xs:"4px",sm:"8px",md:"12px",lg:"16px",xl:"24px",full:"9999px"},a={none:"none",xs:"0 1px 2px rgba(0, 0, 0, 0.06)",sm:"0 2px 6px rgba(0, 0, 0, 0.08)",md:"0 4px 12px rgba(0, 0, 0, 0.12)",lg:"0 8px 24px rgba(0, 0, 0, 0.16)",xl:"0 16px 40px rgba(0, 0, 0, 0.20)",glowAlpha:"0 0 20px rgba(190, 3, 164, 0.50)",glowBeta:"0 0 20px rgba(148, 170, 253, 0.50)",glowGamma:"0 0 20px rgba(130, 174, 55, 0.50)",glowDelta:"0 0 20px rgba(55, 130, 174, 0.50)",button:"0 1px 2px rgba(0, 0, 0, 0.2)",buttonHover:"0 1px 4px rgba(0, 0, 0, 0.2)",focusGlow:"0 0 4px #EE6691"},g={base:0,raised:10,dropdown:100,sticky:200,overlay:300,modal:400,popover:500,toast:600},F={colors:t,gradients:r,fontFamily:e,typography:i,spacing:n,radius:o,shadows:a,zIndex:g};exports.colors=t;exports.fontFamily=e;exports.gradients=r;exports.radius=o;exports.shadows=a;exports.spacing=n;exports.tokens=F;exports.typography=i;exports.zIndex=g;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t={brand:{primary:"#180C44",accent:"#725CC1",accentSubtle:"#EBE9F3",accentMuted:"#A499C6",hover:"#3B2395"},semantic:{error:"#E9336C",errorStrong:"#C10000",errorLight:"#EE6691",success:"#099B30",successDark:"#04841B",successDeep:"#065B15",successMuted:"#82AE37",warning:"#FCC13E",warningText:"#E4AC32",info:"#1B4DFF",infoStrong:"#0065F7",infoDark:"#02409A",infoMuted:"#127498"},text:{primary:"#1A1A1A",secondary:"#2E2E2E",tertiary:"#545454",disabled:"#7F7F7F",inverse:"#FFFFFF"},border:{default:"#D3D3D3",subtle:"#E0E0E0",hover:"#A9A9A9"},surface:{default:"#FFFFFF",subtle:"#F5F5F5",subtleHover:"#F6F6F6",accent:"#F4F2FF"},focus:{glow:"#EE6691",border:"#E9336C"},badge:{green:{bg:"#E4FFEC",border:"#5FD87F",text:"#099B30"},darkGreen:{bg:"#B3D9BA",border:"#04841B",text:"#065B15"},blue:{bg:"#E6EFFC",border:"#0065F7",text:"#02409A"},purple:{bg:"#FFE2FF",border:"#DF00DF",text:"#9A009A"},violet:{bg:"#E8C1FF",border:"#B331FF",text:"#921EC3"},yellow:{bg:"#FFF6E2",border:"#FCC13E",text:"#E4AC32"},teal:{bg:"#E3FDFF",border:"#18CBDB",text:"#0DACBB"},pink:{bg:"#FFE7EE",border:"#EE6691",text:"#E30047"},red:{bg:"#FFE2E2",border:"#FF2929",text:"#C10000"},orange:{bg:"#FDE1D4",border:"#FF6924",text:"#F65F1A"},grey:{bg:"#E3E3E3",border:"#7F7F7F",text:"#545454"},brown:{bg:"#F4E8DC",border:"#B87333",text:"#8B5E34"}}},r={brandAlpha:"linear-gradient(90deg, #FF51E3 0%, #8048BE 50%, #02409A 100%)",brandBeta:"linear-gradient(90deg, #02409A 0%, #066E65 25%, #099B30 50%)",brandGamma:"linear-gradient(90deg, #099B30 0%, #82AE37 50%, #FCC13E 100%)",brandDelta:"linear-gradient(90deg, #099B30 0%, #127498 50%, #1B4DFF 100%)"},e={heading:"'Amsi Pro', 'Inter', system-ui, sans-serif",body:"'Nunito Sans', 'Inter', system-ui, sans-serif",code:"'SF Mono', 'Fira Code', 'Fira Mono', 'Roboto Mono', monospace"},i={display:{size:"40px",weight:400,lineHeight:1,letterSpacing:"0em",fontFamily:e.heading},headingXl:{size:"32px",weight:400,lineHeight:1,letterSpacing:"0em",fontFamily:e.heading},headingLg:{size:"24px",weight:400,lineHeight:1,letterSpacing:"0em",fontFamily:e.heading},headingMd:{size:"20px",weight:400,lineHeight:1,letterSpacing:"0em",fontFamily:e.heading},headingSm:{size:"18px",weight:400,lineHeight:1,letterSpacing:"0em",fontFamily:e.body},bodyLg:{size:"16px",weight:400,lineHeight:1,letterSpacing:"0em",fontFamily:e.body},bodyMd:{size:"14px",weight:400,lineHeight:1,letterSpacing:"0em",fontFamily:e.body},bodySm:{size:"12px",weight:400,lineHeight:1,letterSpacing:"0em",fontFamily:e.body},label:{size:"13px",weight:500,lineHeight:1.4,letterSpacing:"0.03em",fontFamily:e.body},labelSm:{size:"11px",weight:500,lineHeight:1.4,letterSpacing:"0.04em",fontFamily:e.body},code:{size:"13px",weight:400,lineHeight:1.5,letterSpacing:"0em",fontFamily:e.code}},n={px:"1px","0.5":"2px",1:"4px",2:"8px",3:"12px",4:"16px",5:"20px",6:"24px",8:"32px",10:"40px",12:"48px"},o={none:"0px",xs:"4px",sm:"8px",md:"12px",lg:"16px",xl:"24px",full:"9999px"},a={none:"none",xs:"0 1px 2px rgba(0, 0, 0, 0.06)",sm:"0 2px 6px rgba(0, 0, 0, 0.08)",md:"0 4px 12px rgba(0, 0, 0, 0.12)",lg:"0 8px 24px rgba(0, 0, 0, 0.16)",xl:"0 16px 40px rgba(0, 0, 0, 0.20)",glowAlpha:"0 0 20px rgba(190, 3, 164, 0.50)",glowBeta:"0 0 20px rgba(148, 170, 253, 0.50)",glowGamma:"0 0 20px rgba(130, 174, 55, 0.50)",glowDelta:"0 0 20px rgba(55, 130, 174, 0.50)",button:"0 1px 2px rgba(0, 0, 0, 0.2)",buttonHover:"0 1px 4px rgba(0, 0, 0, 0.2)",focusGlow:"0 0 4px #EE6691"},g={base:0,raised:10,dropdown:100,sticky:200,overlay:300,modal:400,popover:500,toast:600},F={colors:t,gradients:r,fontFamily:e,typography:i,spacing:n,radius:o,shadows:a,zIndex:g};exports.colors=t;exports.fontFamily=e;exports.gradients=r;exports.radius=o;exports.shadows=a;exports.spacing=n;exports.tokens=F;exports.typography=i;exports.zIndex=g;
package/dist/index.js CHANGED
@@ -1,7 +1,7 @@
1
1
  const t = {
2
2
  brand: {
3
3
  primary: "#180C44",
4
- accent: "#8A38F5",
4
+ accent: "#725CC1",
5
5
  accentSubtle: "#EBE9F3",
6
6
  accentMuted: "#A499C6",
7
7
  hover: "#3B2395"
@@ -70,56 +70,56 @@ const t = {
70
70
  display: {
71
71
  size: "40px",
72
72
  weight: 400,
73
- lineHeight: 1.37,
73
+ lineHeight: 1,
74
74
  letterSpacing: "0em",
75
75
  fontFamily: e.heading
76
76
  },
77
77
  headingXl: {
78
78
  size: "32px",
79
79
  weight: 400,
80
- lineHeight: 1.37,
80
+ lineHeight: 1,
81
81
  letterSpacing: "0em",
82
82
  fontFamily: e.heading
83
83
  },
84
84
  headingLg: {
85
85
  size: "24px",
86
86
  weight: 400,
87
- lineHeight: 1.37,
87
+ lineHeight: 1,
88
88
  letterSpacing: "0em",
89
89
  fontFamily: e.heading
90
90
  },
91
91
  headingMd: {
92
92
  size: "20px",
93
93
  weight: 400,
94
- lineHeight: 1.37,
94
+ lineHeight: 1,
95
95
  letterSpacing: "0em",
96
96
  fontFamily: e.heading
97
97
  },
98
98
  headingSm: {
99
99
  size: "18px",
100
100
  weight: 400,
101
- lineHeight: 1.36,
101
+ lineHeight: 1,
102
102
  letterSpacing: "0em",
103
103
  fontFamily: e.body
104
104
  },
105
105
  bodyLg: {
106
106
  size: "16px",
107
107
  weight: 400,
108
- lineHeight: 1.36,
108
+ lineHeight: 1,
109
109
  letterSpacing: "0em",
110
110
  fontFamily: e.body
111
111
  },
112
112
  bodyMd: {
113
113
  size: "14px",
114
114
  weight: 400,
115
- lineHeight: 1.36,
115
+ lineHeight: 1,
116
116
  letterSpacing: "0em",
117
117
  fontFamily: e.body
118
118
  },
119
119
  bodySm: {
120
120
  size: "12px",
121
121
  weight: 400,
122
- lineHeight: 1.36,
122
+ lineHeight: 1,
123
123
  letterSpacing: "0em",
124
124
  fontFamily: e.body
125
125
  },
package/dist/tokens.css CHANGED
@@ -1 +1 @@
1
- :root{--color-brand-primary: #180C44;--color-brand-accent: #8A38F5;--color-brand-accent-subtle: #EBE9F3;--color-brand-accent-muted: #A499C6;--color-brand-hover: #3B2395;--color-semantic-error: #E9336C;--color-semantic-error-strong: #C10000;--color-semantic-error-light: #EE6691;--color-semantic-success: #099B30;--color-semantic-success-dark: #04841B;--color-semantic-success-deep: #065B15;--color-semantic-success-muted: #82AE37;--color-semantic-warning: #FCC13E;--color-semantic-warning-text: #E4AC32;--color-semantic-info: #1B4DFF;--color-semantic-info-strong: #0065F7;--color-semantic-info-dark: #02409A;--color-semantic-info-muted: #127498;--color-badge-green-bg: #E4FFEC;--color-badge-green-border: #5FD87F;--color-badge-green-text: #099B30;--color-badge-dark-green-bg: #B3D9BA;--color-badge-dark-green-border: #04841B;--color-badge-dark-green-text: #065B15;--color-badge-blue-bg: #E6EFFC;--color-badge-blue-border: #0065F7;--color-badge-blue-text: #02409A;--color-badge-purple-bg: #FFE2FF;--color-badge-purple-border: #DF00DF;--color-badge-purple-text: #9A009A;--color-badge-violet-bg: #E8C1FF;--color-badge-violet-border: #B331FF;--color-badge-violet-text: #921EC3;--color-badge-yellow-bg: #FFF6E2;--color-badge-yellow-border: #FCC13E;--color-badge-yellow-text: #E4AC32;--color-badge-teal-bg: #E3FDFF;--color-badge-teal-border: #18CBDB;--color-badge-teal-text: #0DACBB;--color-badge-pink-bg: #FFE7EE;--color-badge-pink-border: #EE6691;--color-badge-pink-text: #E30047;--color-badge-red-bg: #FFE2E2;--color-badge-red-border: #FF2929;--color-badge-red-text: #C10000;--color-badge-orange-bg: #FDE1D4;--color-badge-orange-border: #FF6924;--color-badge-orange-text: #F65F1A;--color-badge-grey-bg: #E3E3E3;--color-badge-grey-border: #7F7F7F;--color-badge-grey-text: #545454;--color-badge-brown-bg: #F4E8DC;--color-badge-brown-border: #B87333;--color-badge-brown-text: #8B5E34;--color-text-primary: #1A1A1A;--color-text-secondary: #2E2E2E;--color-text-tertiary: #545454;--color-text-disabled: #7F7F7F;--color-text-inverse: #FFFFFF;--color-border-default: #D3D3D3;--color-border-subtle: #E0E0E0;--color-border-hover: #A9A9A9;--color-surface-default: #FFFFFF;--color-surface-subtle: #F5F5F5;--color-surface-subtle-hover: #F6F6F6;--color-surface-accent: #F4F2FF;--color-focus-glow: #EE6691;--color-focus-border: #E9336C;--gradient-brand-alpha: linear-gradient(90deg, #FF51E3 0%, #8048BE 50%, #02409A 100%);--gradient-brand-beta: linear-gradient(90deg, #02409A 0%, #066E65 25%, #099B30 50%);--gradient-brand-gamma: linear-gradient(90deg, #099B30 0%, #82AE37 50%, #FCC13E 100%);--gradient-brand-delta: linear-gradient(90deg, #099B30 0%, #127498 50%, #1B4DFF 100%);--font-heading: "Amsi Pro", "Inter", system-ui, sans-serif;--font-body: "Nunito Sans", "Inter", system-ui, sans-serif;--font-code: "SF Mono", "Fira Code", "Fira Mono", "Roboto Mono", monospace;--text-display-size: 40px;--text-display-weight: 400;--text-display-line-height: 1.37;--text-display-letter-spacing: 0em;--text-heading-xl-size: 32px;--text-heading-xl-weight: 400;--text-heading-xl-line-height: 1.37;--text-heading-xl-letter-spacing: 0em;--text-heading-lg-size: 24px;--text-heading-lg-weight: 400;--text-heading-lg-line-height: 1.37;--text-heading-lg-letter-spacing: 0em;--text-heading-md-size: 20px;--text-heading-md-weight: 400;--text-heading-md-line-height: 1.37;--text-heading-md-letter-spacing: 0em;--text-heading-sm-size: 18px;--text-heading-sm-weight: 400;--text-heading-sm-line-height: 1.36;--text-heading-sm-letter-spacing: 0em;--text-body-lg-size: 16px;--text-body-lg-weight: 400;--text-body-lg-line-height: 1.36;--text-body-lg-letter-spacing: 0em;--text-body-md-size: 14px;--text-body-md-weight: 400;--text-body-md-line-height: 1.36;--text-body-md-letter-spacing: 0em;--text-body-sm-size: 12px;--text-body-sm-weight: 400;--text-body-sm-line-height: 1.36;--text-body-sm-letter-spacing: 0em;--text-label-size: 13px;--text-label-weight: 500;--text-label-line-height: 1.4;--text-label-letter-spacing: .03em;--text-label-sm-size: 11px;--text-label-sm-weight: 500;--text-label-sm-line-height: 1.4;--text-label-sm-letter-spacing: .04em;--text-code-size: 13px;--text-code-weight: 400;--text-code-line-height: 1.5;--text-code-letter-spacing: 0em;--space-px: 1px;--space-0-5: 2px;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--space-10: 40px;--space-12: 48px;--radius-none: 0px;--radius-xs: 4px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 24px;--radius-full: 9999px;--shadow-none: none;--shadow-xs: 0 1px 2px rgba(0, 0, 0, .06);--shadow-sm: 0 2px 6px rgba(0, 0, 0, .08);--shadow-md: 0 4px 12px rgba(0, 0, 0, .12);--shadow-lg: 0 8px 24px rgba(0, 0, 0, .16);--shadow-xl: 0 16px 40px rgba(0, 0, 0, .2);--shadow-button: 0 1px 2px rgba(0, 0, 0, .2);--shadow-button-hover: 0 1px 4px rgba(0, 0, 0, .2);--shadow-button-filled-hover: 0 4px 10px var(--color-border-default);--shadow-button-glass-hover: 0 4px 10px var(--color-border-default);--shadow-focus-glow: 0 0 4px var(--color-focus-glow);--shadow-section-inset: 2px 2px 10px 1px rgba(239, 239, 239, .8) inset;--shadow-glow-alpha: 0 0 20px rgba(190, 3, 164, .5);--shadow-glow-beta: 0 0 20px rgba(148, 170, 253, .5);--shadow-glow-gamma: 0 0 20px rgba(130, 174, 55, .5);--shadow-glow-delta: 0 0 20px rgba(55, 130, 174, .5);--z-base: 0;--z-raised: 10;--z-dropdown: 100;--z-sticky: 200;--z-overlay: 300;--z-modal: 400;--z-popover: 500;--z-toast: 600;--bp-xs: 320px;--bp-sm: 480px;--bp-md: 768px;--bp-lg: 1024px}html{font-family:var(--font-body);font-size:var(--text-body-lg-size);font-weight:400;line-height:var(--text-body-lg-line-height);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}body{font-family:inherit;font-size:inherit;line-height:inherit}*,*:before,*:after{box-sizing:border-box;font-family:inherit}button,input,select,textarea,optgroup{font-family:var(--font-body);font-size:inherit;line-height:inherit}
1
+ :root{--color-brand-primary: #180C44;--color-brand-accent: #725CC1;--color-brand-accent-subtle: #EBE9F3;--color-brand-accent-muted: #A499C6;--color-brand-hover: #3B2395;--color-semantic-error: #E9336C;--color-semantic-error-strong: #C10000;--color-semantic-error-light: #EE6691;--color-semantic-success: #099B30;--color-semantic-success-dark: #04841B;--color-semantic-success-deep: #065B15;--color-semantic-success-muted: #82AE37;--color-semantic-warning: #FCC13E;--color-semantic-warning-text: #E4AC32;--color-semantic-info: #1B4DFF;--color-semantic-info-strong: #0065F7;--color-semantic-info-dark: #02409A;--color-semantic-info-muted: #127498;--color-badge-green-bg: #E4FFEC;--color-badge-green-border: #5FD87F;--color-badge-green-text: #099B30;--color-badge-dark-green-bg: #B3D9BA;--color-badge-dark-green-border: #04841B;--color-badge-dark-green-text: #065B15;--color-badge-blue-bg: #E6EFFC;--color-badge-blue-border: #0065F7;--color-badge-blue-text: #02409A;--color-badge-purple-bg: #FFE2FF;--color-badge-purple-border: #DF00DF;--color-badge-purple-text: #9A009A;--color-badge-violet-bg: #E8C1FF;--color-badge-violet-border: #B331FF;--color-badge-violet-text: #921EC3;--color-badge-yellow-bg: #FFF6E2;--color-badge-yellow-border: #FCC13E;--color-badge-yellow-text: #E4AC32;--color-badge-teal-bg: #E3FDFF;--color-badge-teal-border: #18CBDB;--color-badge-teal-text: #0DACBB;--color-badge-pink-bg: #FFE7EE;--color-badge-pink-border: #EE6691;--color-badge-pink-text: #E30047;--color-badge-red-bg: #FFE2E2;--color-badge-red-border: #FF2929;--color-badge-red-text: #C10000;--color-badge-orange-bg: #FDE1D4;--color-badge-orange-border: #FF6924;--color-badge-orange-text: #F65F1A;--color-badge-grey-bg: #E3E3E3;--color-badge-grey-border: #7F7F7F;--color-badge-grey-text: #545454;--color-badge-brown-bg: #F4E8DC;--color-badge-brown-border: #B87333;--color-badge-brown-text: #8B5E34;--color-text-primary: #1A1A1A;--color-text-secondary: #2E2E2E;--color-text-tertiary: #545454;--color-text-disabled: #7F7F7F;--color-text-inverse: #FFFFFF;--color-border-default: #D3D3D3;--color-border-subtle: #E0E0E0;--color-border-hover: #A9A9A9;--color-surface-default: #FFFFFF;--color-surface-subtle: #F5F5F5;--color-surface-subtle-hover: #F6F6F6;--color-surface-accent: #F4F2FF;--color-focus-glow: #EE6691;--color-focus-border: #E9336C;--gradient-brand-alpha: linear-gradient(90deg, #FF51E3 0%, #8048BE 50%, #02409A 100%);--gradient-brand-beta: linear-gradient(90deg, #02409A 0%, #066E65 25%, #099B30 50%);--gradient-brand-gamma: linear-gradient(90deg, #099B30 0%, #82AE37 50%, #FCC13E 100%);--gradient-brand-delta: linear-gradient(90deg, #099B30 0%, #127498 50%, #1B4DFF 100%);--font-heading: "Amsi Pro", "Inter", system-ui, sans-serif;--font-body: "Nunito Sans", "Inter", system-ui, sans-serif;--font-code: "SF Mono", "Fira Code", "Fira Mono", "Roboto Mono", monospace;--text-display-size: 40px;--text-display-weight: 400;--text-display-line-height: 1;--text-display-letter-spacing: 0em;--text-heading-xl-size: 32px;--text-heading-xl-weight: 400;--text-heading-xl-line-height: 1;--text-heading-xl-letter-spacing: 0em;--text-heading-lg-size: 24px;--text-heading-lg-weight: 400;--text-heading-lg-line-height: 1;--text-heading-lg-letter-spacing: 0em;--text-heading-md-size: 20px;--text-heading-md-weight: 400;--text-heading-md-line-height: 1;--text-heading-md-letter-spacing: 0em;--text-heading-sm-size: 18px;--text-heading-sm-weight: 400;--text-heading-sm-line-height: 1;--text-heading-sm-letter-spacing: 0em;--text-body-lg-size: 16px;--text-body-lg-weight: 400;--text-body-lg-line-height: 1;--text-body-lg-letter-spacing: 0em;--text-body-md-size: 14px;--text-body-md-weight: 400;--text-body-md-line-height: 1;--text-body-md-letter-spacing: 0em;--text-body-sm-size: 12px;--text-body-sm-weight: 400;--text-body-sm-line-height: 1;--text-body-sm-letter-spacing: 0em;--text-label-size: 13px;--text-label-weight: 500;--text-label-line-height: 1.4;--text-label-letter-spacing: .03em;--text-label-sm-size: 11px;--text-label-sm-weight: 500;--text-label-sm-line-height: 1.4;--text-label-sm-letter-spacing: .04em;--text-code-size: 13px;--text-code-weight: 400;--text-code-line-height: 1.5;--text-code-letter-spacing: 0em;--space-px: 1px;--space-0-5: 2px;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--space-10: 40px;--space-12: 48px;--radius-none: 0px;--radius-xs: 4px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 24px;--radius-full: 9999px;--shadow-none: none;--shadow-xs: 0 1px 2px rgba(0, 0, 0, .06);--shadow-sm: 0 2px 6px rgba(0, 0, 0, .08);--shadow-md: 0 4px 12px rgba(0, 0, 0, .12);--shadow-lg: 0 8px 24px rgba(0, 0, 0, .16);--shadow-xl: 0 16px 40px rgba(0, 0, 0, .2);--shadow-button: 0 1px 2px rgba(0, 0, 0, .2);--shadow-button-hover: 0 1px 4px rgba(0, 0, 0, .2);--shadow-button-filled-hover: 0 4px 10px var(--color-border-default);--shadow-button-glass-hover: 0 4px 10px var(--color-border-default);--shadow-focus-glow: 0 0 4px var(--color-focus-glow);--shadow-section-inset: 2px 2px 10px 1px rgba(239, 239, 239, .8) inset;--shadow-glow-alpha: 0 0 20px rgba(190, 3, 164, .5);--shadow-glow-beta: 0 0 20px rgba(148, 170, 253, .5);--shadow-glow-gamma: 0 0 20px rgba(130, 174, 55, .5);--shadow-glow-delta: 0 0 20px rgba(55, 130, 174, .5);--z-base: 0;--z-raised: 10;--z-dropdown: 100;--z-sticky: 200;--z-overlay: 300;--z-modal: 400;--z-popover: 500;--z-toast: 600;--bp-xs: 320px;--bp-sm: 480px;--bp-md: 768px;--bp-lg: 1024px}html{font-family:var(--font-body);font-size:var(--text-body-lg-size);font-weight:400;line-height:var(--text-body-lg-line-height);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}body{font-family:inherit;font-size:inherit;line-height:inherit}*,*:before,*:after{box-sizing:border-box;font-family:inherit}button,input,select,textarea,optgroup{font-family:var(--font-body);font-size:inherit;line-height:inherit}*::-webkit-scrollbar{width:6px;height:6px}*::-webkit-scrollbar-track{background:transparent}*::-webkit-scrollbar-thumb{background:var(--color-border-hover);border-radius:var(--radius-full)}*::-webkit-scrollbar-thumb:hover{background:var(--color-text-disabled)}*::-webkit-scrollbar-button{display:none;width:0;height:0}@supports (-moz-appearance: none){*{scrollbar-width:thin;scrollbar-color:var(--color-border-hover) transparent}}
package/dist/tokens.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  export declare const colors: {
2
2
  readonly brand: {
3
3
  readonly primary: "#180C44";
4
- readonly accent: "#8A38F5";
4
+ readonly accent: "#725CC1";
5
5
  readonly accentSubtle: "#EBE9F3";
6
6
  readonly accentMuted: "#A499C6";
7
7
  readonly hover: "#3B2395";
@@ -121,56 +121,56 @@ export declare const typography: {
121
121
  readonly display: {
122
122
  readonly size: "40px";
123
123
  readonly weight: 400;
124
- readonly lineHeight: 1.37;
124
+ readonly lineHeight: 1;
125
125
  readonly letterSpacing: "0em";
126
126
  readonly fontFamily: "'Amsi Pro', 'Inter', system-ui, sans-serif";
127
127
  };
128
128
  readonly headingXl: {
129
129
  readonly size: "32px";
130
130
  readonly weight: 400;
131
- readonly lineHeight: 1.37;
131
+ readonly lineHeight: 1;
132
132
  readonly letterSpacing: "0em";
133
133
  readonly fontFamily: "'Amsi Pro', 'Inter', system-ui, sans-serif";
134
134
  };
135
135
  readonly headingLg: {
136
136
  readonly size: "24px";
137
137
  readonly weight: 400;
138
- readonly lineHeight: 1.37;
138
+ readonly lineHeight: 1;
139
139
  readonly letterSpacing: "0em";
140
140
  readonly fontFamily: "'Amsi Pro', 'Inter', system-ui, sans-serif";
141
141
  };
142
142
  readonly headingMd: {
143
143
  readonly size: "20px";
144
144
  readonly weight: 400;
145
- readonly lineHeight: 1.37;
145
+ readonly lineHeight: 1;
146
146
  readonly letterSpacing: "0em";
147
147
  readonly fontFamily: "'Amsi Pro', 'Inter', system-ui, sans-serif";
148
148
  };
149
149
  readonly headingSm: {
150
150
  readonly size: "18px";
151
151
  readonly weight: 400;
152
- readonly lineHeight: 1.36;
152
+ readonly lineHeight: 1;
153
153
  readonly letterSpacing: "0em";
154
154
  readonly fontFamily: "'Nunito Sans', 'Inter', system-ui, sans-serif";
155
155
  };
156
156
  readonly bodyLg: {
157
157
  readonly size: "16px";
158
158
  readonly weight: 400;
159
- readonly lineHeight: 1.36;
159
+ readonly lineHeight: 1;
160
160
  readonly letterSpacing: "0em";
161
161
  readonly fontFamily: "'Nunito Sans', 'Inter', system-ui, sans-serif";
162
162
  };
163
163
  readonly bodyMd: {
164
164
  readonly size: "14px";
165
165
  readonly weight: 400;
166
- readonly lineHeight: 1.36;
166
+ readonly lineHeight: 1;
167
167
  readonly letterSpacing: "0em";
168
168
  readonly fontFamily: "'Nunito Sans', 'Inter', system-ui, sans-serif";
169
169
  };
170
170
  readonly bodySm: {
171
171
  readonly size: "12px";
172
172
  readonly weight: 400;
173
- readonly lineHeight: 1.36;
173
+ readonly lineHeight: 1;
174
174
  readonly letterSpacing: "0em";
175
175
  readonly fontFamily: "'Nunito Sans', 'Inter', system-ui, sans-serif";
176
176
  };
@@ -247,7 +247,7 @@ export declare const tokens: {
247
247
  readonly colors: {
248
248
  readonly brand: {
249
249
  readonly primary: "#180C44";
250
- readonly accent: "#8A38F5";
250
+ readonly accent: "#725CC1";
251
251
  readonly accentSubtle: "#EBE9F3";
252
252
  readonly accentMuted: "#A499C6";
253
253
  readonly hover: "#3B2395";
@@ -367,56 +367,56 @@ export declare const tokens: {
367
367
  readonly display: {
368
368
  readonly size: "40px";
369
369
  readonly weight: 400;
370
- readonly lineHeight: 1.37;
370
+ readonly lineHeight: 1;
371
371
  readonly letterSpacing: "0em";
372
372
  readonly fontFamily: "'Amsi Pro', 'Inter', system-ui, sans-serif";
373
373
  };
374
374
  readonly headingXl: {
375
375
  readonly size: "32px";
376
376
  readonly weight: 400;
377
- readonly lineHeight: 1.37;
377
+ readonly lineHeight: 1;
378
378
  readonly letterSpacing: "0em";
379
379
  readonly fontFamily: "'Amsi Pro', 'Inter', system-ui, sans-serif";
380
380
  };
381
381
  readonly headingLg: {
382
382
  readonly size: "24px";
383
383
  readonly weight: 400;
384
- readonly lineHeight: 1.37;
384
+ readonly lineHeight: 1;
385
385
  readonly letterSpacing: "0em";
386
386
  readonly fontFamily: "'Amsi Pro', 'Inter', system-ui, sans-serif";
387
387
  };
388
388
  readonly headingMd: {
389
389
  readonly size: "20px";
390
390
  readonly weight: 400;
391
- readonly lineHeight: 1.37;
391
+ readonly lineHeight: 1;
392
392
  readonly letterSpacing: "0em";
393
393
  readonly fontFamily: "'Amsi Pro', 'Inter', system-ui, sans-serif";
394
394
  };
395
395
  readonly headingSm: {
396
396
  readonly size: "18px";
397
397
  readonly weight: 400;
398
- readonly lineHeight: 1.36;
398
+ readonly lineHeight: 1;
399
399
  readonly letterSpacing: "0em";
400
400
  readonly fontFamily: "'Nunito Sans', 'Inter', system-ui, sans-serif";
401
401
  };
402
402
  readonly bodyLg: {
403
403
  readonly size: "16px";
404
404
  readonly weight: 400;
405
- readonly lineHeight: 1.36;
405
+ readonly lineHeight: 1;
406
406
  readonly letterSpacing: "0em";
407
407
  readonly fontFamily: "'Nunito Sans', 'Inter', system-ui, sans-serif";
408
408
  };
409
409
  readonly bodyMd: {
410
410
  readonly size: "14px";
411
411
  readonly weight: 400;
412
- readonly lineHeight: 1.36;
412
+ readonly lineHeight: 1;
413
413
  readonly letterSpacing: "0em";
414
414
  readonly fontFamily: "'Nunito Sans', 'Inter', system-ui, sans-serif";
415
415
  };
416
416
  readonly bodySm: {
417
417
  readonly size: "12px";
418
418
  readonly weight: 400;
419
- readonly lineHeight: 1.36;
419
+ readonly lineHeight: 1;
420
420
  readonly letterSpacing: "0em";
421
421
  readonly fontFamily: "'Nunito Sans', 'Inter', system-ui, sans-serif";
422
422
  };
package/dist/tokens.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"tokens.d.ts","sourceRoot":"","sources":["../src/tokens.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2DT,CAAC;AAEX,eAAO,MAAM,SAAS;;;;;CAKZ,CAAC;AAEX,eAAO,MAAM,UAAU;;;;CAIb,CAAC;AAEX,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8Eb,CAAC;AAEX,eAAO,MAAM,OAAO;;;;;;;;;;;;CAYV,CAAC;AAEX,eAAO,MAAM,MAAM;;;;;;;;CAQT,CAAC;AAEX,eAAO,MAAM,OAAO;;;;;;;;;;;;;;CAcV,CAAC;AAEX,eAAO,MAAM,MAAM;;;;;;;;;CAST,CAAC;AAEX,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAST,CAAC"}
1
+ {"version":3,"file":"tokens.d.ts","sourceRoot":"","sources":["../src/tokens.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2DT,CAAC;AAEX,eAAO,MAAM,SAAS;;;;;CAKZ,CAAC;AAEX,eAAO,MAAM,UAAU;;;;CAIb,CAAC;AAaX,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8Eb,CAAC;AAEX,eAAO,MAAM,OAAO;;;;;;;;;;;;CAYV,CAAC;AAEX,eAAO,MAAM,MAAM;;;;;;;;CAQT,CAAC;AAEX,eAAO,MAAM,OAAO;;;;;;;;;;;;;;CAcV,CAAC;AAEX,eAAO,MAAM,MAAM;;;;;;;;;CAST,CAAC;AAEX,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAST,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dukaandost/tokens",
3
- "version": "1.1.0",
3
+ "version": "1.1.2",
4
4
  "type": "module",
5
5
  "main": "dist/index.cjs",
6
6
  "module": "dist/index.js",
package/src/tokens.css CHANGED
@@ -1,7 +1,7 @@
1
1
  :root {
2
2
  /* Brand */
3
3
  --color-brand-primary: #180C44;
4
- --color-brand-accent: #8A38F5;
4
+ --color-brand-accent: #725CC1;
5
5
  --color-brand-accent-subtle: #EBE9F3;
6
6
  --color-brand-accent-muted: #A499C6;
7
7
  --color-brand-hover: #3B2395;
@@ -92,52 +92,56 @@
92
92
  --font-body: 'Nunito Sans', 'Inter', system-ui, sans-serif;
93
93
  --font-code: 'SF Mono', 'Fira Code', 'Fira Mono', 'Roboto Mono', monospace;
94
94
 
95
- /* Typography — Figma: H1 (Amsi Pro 40px) */
95
+ /* Figma text styles — all line-height 100%, letter-spacing 0.
96
+ Bold companions exist (H1 Black/H2 Bold/H3-H5 SemiBold/Base+Mobile+
97
+ SubText SemiBold) — express via Typography `weight` prop. */
98
+
99
+ /* Figma: H1 (Amsi Pro Regular 40/100/0) | Bold = weight 900 (Black) */
96
100
  --text-display-size: 40px;
97
101
  --text-display-weight: 400;
98
- --text-display-line-height: 1.37;
102
+ --text-display-line-height: 1;
99
103
  --text-display-letter-spacing: 0em;
100
104
 
101
- /* Figma: H2 (Amsi Pro 32px) */
105
+ /* Figma: H2 (Amsi Pro Regular 32/100/0) | Bold = weight 700 */
102
106
  --text-heading-xl-size: 32px;
103
107
  --text-heading-xl-weight: 400;
104
- --text-heading-xl-line-height: 1.37;
108
+ --text-heading-xl-line-height: 1;
105
109
  --text-heading-xl-letter-spacing: 0em;
106
110
 
107
- /* Figma: H3 (Amsi Pro 24px) */
111
+ /* Figma: H3 (Amsi Pro Regular 24/100/0) | Bold = weight 600 (SemiBold) */
108
112
  --text-heading-lg-size: 24px;
109
113
  --text-heading-lg-weight: 400;
110
- --text-heading-lg-line-height: 1.37;
114
+ --text-heading-lg-line-height: 1;
111
115
  --text-heading-lg-letter-spacing: 0em;
112
116
 
113
- /* Figma: H4 (Amsi Pro 20px) */
117
+ /* Figma: H4 (Amsi Pro Regular 20/100/0) | Bold = weight 600 (SemiBold) */
114
118
  --text-heading-md-size: 20px;
115
119
  --text-heading-md-weight: 400;
116
- --text-heading-md-line-height: 1.37;
120
+ --text-heading-md-line-height: 1;
117
121
  --text-heading-md-letter-spacing: 0em;
118
122
 
119
- /* Figma: H5 (Nunito Sans 18px) */
123
+ /* Figma: H5 (Nunito Sans Regular 18/100/0) | Bold = weight 600 (SemiBold) */
120
124
  --text-heading-sm-size: 18px;
121
125
  --text-heading-sm-weight: 400;
122
- --text-heading-sm-line-height: 1.36;
126
+ --text-heading-sm-line-height: 1;
123
127
  --text-heading-sm-letter-spacing: 0em;
124
128
 
125
- /* Figma: Base Text (Nunito Sans 16px) */
129
+ /* Figma: Base Text (Nunito Sans 16/100/0) */
126
130
  --text-body-lg-size: 16px;
127
131
  --text-body-lg-weight: 400;
128
- --text-body-lg-line-height: 1.36;
132
+ --text-body-lg-line-height: 1;
129
133
  --text-body-lg-letter-spacing: 0em;
130
134
 
131
- /* Figma: Mobile Base Text (Nunito Sans 14px) */
135
+ /* Figma: Mobile Base Text (Nunito Sans 14/100/0) */
132
136
  --text-body-md-size: 14px;
133
137
  --text-body-md-weight: 400;
134
- --text-body-md-line-height: 1.36;
138
+ --text-body-md-line-height: 1;
135
139
  --text-body-md-letter-spacing: 0em;
136
140
 
137
- /* Figma: SubText (Nunito Sans 12px) */
141
+ /* Figma: SubText (Nunito Sans Regular 12/100/0) */
138
142
  --text-body-sm-size: 12px;
139
143
  --text-body-sm-weight: 400;
140
- --text-body-sm-line-height: 1.36;
144
+ --text-body-sm-line-height: 1;
141
145
  --text-body-sm-letter-spacing: 0em;
142
146
 
143
147
  /* Label (Nunito Sans 13px) */
@@ -261,3 +265,40 @@ optgroup {
261
265
  font-size: inherit;
262
266
  line-height: inherit;
263
267
  }
268
+
269
+ /* =============================================
270
+ Scrollbars — thin, grey, always visible. App-wide.
271
+ -------------------------------------------------
272
+ WebKit (Chrome/Edge/Safari) is styled via the pseudo-elements below.
273
+ Firefox's standard properties are scoped inside @supports so they do NOT
274
+ also apply in Chrome — Chrome 121+ silently ignores ::-webkit-scrollbar on
275
+ any element that has scrollbar-width/scrollbar-color set, which would defeat
276
+ the custom styling. Components must not set scrollbar-width locally for the
277
+ same reason.
278
+ ============================================= */
279
+ *::-webkit-scrollbar {
280
+ width: 6px;
281
+ height: 6px;
282
+ }
283
+ *::-webkit-scrollbar-track {
284
+ background: transparent;
285
+ }
286
+ *::-webkit-scrollbar-thumb {
287
+ background: var(--color-border-hover);
288
+ border-radius: var(--radius-full);
289
+ }
290
+ *::-webkit-scrollbar-thumb:hover {
291
+ background: var(--color-text-disabled);
292
+ }
293
+ *::-webkit-scrollbar-button {
294
+ display: none;
295
+ width: 0;
296
+ height: 0;
297
+ }
298
+
299
+ @supports (-moz-appearance: none) {
300
+ * {
301
+ scrollbar-width: thin;
302
+ scrollbar-color: var(--color-border-hover) transparent;
303
+ }
304
+ }