@haiilo/catalyst-tokens 0.10.2 → 0.12.0
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.
- package/dist/css/_variables.css +17 -2
- package/dist/js/_variables.d.ts +15 -0
- package/dist/js/_variables.js +17 -2
- package/dist/scss/_variables.scss +42 -2
- package/package.json +1 -1
package/dist/css/_variables.css
CHANGED
|
@@ -135,7 +135,7 @@
|
|
|
135
135
|
--cat-color-ui-background-input-disabled: 248, 248, 251;
|
|
136
136
|
--cat-color-ui-background-skeleton: 235, 236, 240;
|
|
137
137
|
--cat-color-ui-background-skeleton-highlight: 215, 219, 224;
|
|
138
|
-
--cat-color-ui-background-tooltip:
|
|
138
|
+
--cat-color-ui-background-tooltip: 0, 0, 0;
|
|
139
139
|
--cat-color-ui-background-avatar: 105, 118, 135;
|
|
140
140
|
--cat-color-ui-background-modal-body: 255, 255, 255;
|
|
141
141
|
--cat-color-ui-background-modal-wrapper: 0, 0, 0;
|
|
@@ -151,7 +151,7 @@
|
|
|
151
151
|
--cat-color-ui-font-mono: 0, 0, 0;
|
|
152
152
|
--cat-color-ui-font-muted: 105, 118, 135;
|
|
153
153
|
--cat-color-ui-font-quote: 0, 0, 0;
|
|
154
|
-
--cat-color-ui-font-tooltip:
|
|
154
|
+
--cat-color-ui-font-tooltip: 255, 255, 255;
|
|
155
155
|
--cat-color-ui-font-avatar: 255, 255, 255;
|
|
156
156
|
--cat-font-family-head: Lato;
|
|
157
157
|
--cat-font-family-body: Lato;
|
|
@@ -160,6 +160,21 @@
|
|
|
160
160
|
--cat-font-weight-body: 400;
|
|
161
161
|
--cat-font-weight-mono: 400;
|
|
162
162
|
--cat-opacity-disabled: 0.65;
|
|
163
|
+
--cat-size-badge-padding-horizontal-xl: 1rem;
|
|
164
|
+
--cat-size-badge-padding-horizontal-l: 1rem;
|
|
165
|
+
--cat-size-badge-padding-horizontal-m: 0.75rem;
|
|
166
|
+
--cat-size-badge-padding-horizontal-s: 0.5rem;
|
|
167
|
+
--cat-size-badge-padding-horizontal-xs: 0.25rem;
|
|
168
|
+
--cat-size-badge-height-xl: 3rem;
|
|
169
|
+
--cat-size-badge-height-l: 2.5rem;
|
|
170
|
+
--cat-size-badge-height-m: 2rem;
|
|
171
|
+
--cat-size-badge-height-s: 1.5rem;
|
|
172
|
+
--cat-size-badge-height-xs: 1rem;
|
|
173
|
+
--cat-size-badge-font-xl: 18px;
|
|
174
|
+
--cat-size-badge-font-l: 15px;
|
|
175
|
+
--cat-size-badge-font-m: 13px;
|
|
176
|
+
--cat-size-badge-font-s: 12px;
|
|
177
|
+
--cat-size-badge-font-xs: 12px;
|
|
163
178
|
--cat-size-base-xl: 3.5rem;
|
|
164
179
|
--cat-size-base-l: 3rem;
|
|
165
180
|
--cat-size-base-m: 2.5rem;
|
package/dist/js/_variables.d.ts
CHANGED
|
@@ -159,6 +159,21 @@ export const FontWeightHead : number;
|
|
|
159
159
|
export const FontWeightBody : number;
|
|
160
160
|
export const FontWeightMono : number;
|
|
161
161
|
export const OpacityDisabled : number;
|
|
162
|
+
export const SizeBadgePaddingHorizontalXl : string;
|
|
163
|
+
export const SizeBadgePaddingHorizontalL : string;
|
|
164
|
+
export const SizeBadgePaddingHorizontalM : string;
|
|
165
|
+
export const SizeBadgePaddingHorizontalS : string;
|
|
166
|
+
export const SizeBadgePaddingHorizontalXs : string;
|
|
167
|
+
export const SizeBadgeHeightXl : string;
|
|
168
|
+
export const SizeBadgeHeightL : string;
|
|
169
|
+
export const SizeBadgeHeightM : string;
|
|
170
|
+
export const SizeBadgeHeightS : string;
|
|
171
|
+
export const SizeBadgeHeightXs : string;
|
|
172
|
+
export const SizeBadgeFontXl : string;
|
|
173
|
+
export const SizeBadgeFontL : string;
|
|
174
|
+
export const SizeBadgeFontM : string;
|
|
175
|
+
export const SizeBadgeFontS : string;
|
|
176
|
+
export const SizeBadgeFontXs : string;
|
|
162
177
|
export const SizeBaseXl : string;
|
|
163
178
|
export const SizeBaseL : string;
|
|
164
179
|
export const SizeBaseM : string;
|
package/dist/js/_variables.js
CHANGED
|
@@ -134,7 +134,7 @@ export const ColorUiBackgroundInput = "#ffffff";
|
|
|
134
134
|
export const ColorUiBackgroundInputDisabled = "#f8f8fb";
|
|
135
135
|
export const ColorUiBackgroundSkeleton = "#ebecf0";
|
|
136
136
|
export const ColorUiBackgroundSkeletonHighlight = "#d7dbe0";
|
|
137
|
-
export const ColorUiBackgroundTooltip = "#
|
|
137
|
+
export const ColorUiBackgroundTooltip = "#000000";
|
|
138
138
|
export const ColorUiBackgroundAvatar = "#697687";
|
|
139
139
|
export const ColorUiBackgroundModalBody = "#ffffff";
|
|
140
140
|
export const ColorUiBackgroundModalWrapper = "#000000";
|
|
@@ -150,7 +150,7 @@ export const ColorUiFontBody = "#000000";
|
|
|
150
150
|
export const ColorUiFontMono = "#000000";
|
|
151
151
|
export const ColorUiFontMuted = "#697687";
|
|
152
152
|
export const ColorUiFontQuote = "#000000";
|
|
153
|
-
export const ColorUiFontTooltip = "#
|
|
153
|
+
export const ColorUiFontTooltip = "#ffffff";
|
|
154
154
|
export const ColorUiFontAvatar = "#ffffff";
|
|
155
155
|
export const FontFamilyHead = "Lato";
|
|
156
156
|
export const FontFamilyBody = "Lato";
|
|
@@ -159,6 +159,21 @@ export const FontWeightHead = 500;
|
|
|
159
159
|
export const FontWeightBody = 400;
|
|
160
160
|
export const FontWeightMono = 400;
|
|
161
161
|
export const OpacityDisabled = 0.65;
|
|
162
|
+
export const SizeBadgePaddingHorizontalXl = "1rem";
|
|
163
|
+
export const SizeBadgePaddingHorizontalL = "1rem";
|
|
164
|
+
export const SizeBadgePaddingHorizontalM = "0.75rem";
|
|
165
|
+
export const SizeBadgePaddingHorizontalS = "0.5rem";
|
|
166
|
+
export const SizeBadgePaddingHorizontalXs = "0.25rem";
|
|
167
|
+
export const SizeBadgeHeightXl = "3rem";
|
|
168
|
+
export const SizeBadgeHeightL = "2.5rem";
|
|
169
|
+
export const SizeBadgeHeightM = "2rem";
|
|
170
|
+
export const SizeBadgeHeightS = "1.5rem";
|
|
171
|
+
export const SizeBadgeHeightXs = "1rem";
|
|
172
|
+
export const SizeBadgeFontXl = "18rem";
|
|
173
|
+
export const SizeBadgeFontL = "15rem";
|
|
174
|
+
export const SizeBadgeFontM = "13rem";
|
|
175
|
+
export const SizeBadgeFontS = "12rem";
|
|
176
|
+
export const SizeBadgeFontXs = "12rem";
|
|
162
177
|
export const SizeBaseXl = "3.5rem";
|
|
163
178
|
export const SizeBaseL = "3rem";
|
|
164
179
|
export const SizeBaseM = "2.5rem";
|
|
@@ -65,6 +65,21 @@ $cat-size-base-s: 2rem !default;
|
|
|
65
65
|
$cat-size-base-m: 2.5rem !default;
|
|
66
66
|
$cat-size-base-l: 3rem !default;
|
|
67
67
|
$cat-size-base-xl: 3.5rem !default;
|
|
68
|
+
$cat-size-badge-font-xs: 12px !default;
|
|
69
|
+
$cat-size-badge-font-s: 12px !default;
|
|
70
|
+
$cat-size-badge-font-m: 13px !default;
|
|
71
|
+
$cat-size-badge-font-l: 15px !default;
|
|
72
|
+
$cat-size-badge-font-xl: 18px !default;
|
|
73
|
+
$cat-size-badge-height-xs: 1rem !default;
|
|
74
|
+
$cat-size-badge-height-s: 1.5rem !default;
|
|
75
|
+
$cat-size-badge-height-m: 2rem !default;
|
|
76
|
+
$cat-size-badge-height-l: 2.5rem !default;
|
|
77
|
+
$cat-size-badge-height-xl: 3rem !default;
|
|
78
|
+
$cat-size-badge-padding-horizontal-xs: 0.25rem !default;
|
|
79
|
+
$cat-size-badge-padding-horizontal-s: 0.5rem !default;
|
|
80
|
+
$cat-size-badge-padding-horizontal-m: 0.75rem !default;
|
|
81
|
+
$cat-size-badge-padding-horizontal-l: 1rem !default;
|
|
82
|
+
$cat-size-badge-padding-horizontal-xl: 1rem !default;
|
|
68
83
|
$cat-opacity-disabled: 0.65 !default;
|
|
69
84
|
$cat-font-weight-mono: var(--cat-font-weight-mono, 400) !default;
|
|
70
85
|
$cat-font-weight-body: var(--cat-font-weight-body, 400) !default;
|
|
@@ -154,7 +169,7 @@ $cat-font-family-mono: var(--cat-font-family-mono, $cat-asset-font-azeret-mono-n
|
|
|
154
169
|
$cat-font-family-body: var(--cat-font-family-body, $cat-asset-font-lato-name) !default;
|
|
155
170
|
$cat-font-family-head: var(--cat-font-family-head, $cat-asset-font-lato-name) !default;
|
|
156
171
|
$cat-color-ui-font-avatar: $cat-color-base-neutral-0 !default;
|
|
157
|
-
$cat-color-ui-font-tooltip: $cat-color-base-neutral-
|
|
172
|
+
$cat-color-ui-font-tooltip: $cat-color-base-neutral-0 !default;
|
|
158
173
|
$cat-color-ui-font-muted: var(--cat-font-color-muted, $cat-color-base-neutral-400) !default;
|
|
159
174
|
$cat-color-ui-font-mono: var(--cat-font-color-mono, $cat-color-base-neutral-900) !default;
|
|
160
175
|
$cat-color-ui-font-body: var(--cat-font-color-body, $cat-color-base-neutral-900) !default;
|
|
@@ -168,7 +183,7 @@ $cat-color-ui-border-light: $cat-color-base-neutral-100 !default;
|
|
|
168
183
|
$cat-color-ui-background-modal-wrapper: $cat-color-base-neutral-900 !default;
|
|
169
184
|
$cat-color-ui-background-modal-body: $cat-color-base-neutral-0 !default;
|
|
170
185
|
$cat-color-ui-background-avatar: $cat-color-base-neutral-400 !default;
|
|
171
|
-
$cat-color-ui-background-tooltip: $cat-color-base-neutral-
|
|
186
|
+
$cat-color-ui-background-tooltip: $cat-color-base-neutral-900 !default;
|
|
172
187
|
$cat-color-ui-background-skeleton-highlight: $cat-color-base-neutral-300 !default;
|
|
173
188
|
$cat-color-ui-background-skeleton: $cat-color-base-neutral-200 !default;
|
|
174
189
|
$cat-color-ui-background-input-disabled: $cat-color-base-neutral-100 !default;
|
|
@@ -436,6 +451,31 @@ $tokens: (
|
|
|
436
451
|
'disabled': $cat-opacity-disabled
|
|
437
452
|
),
|
|
438
453
|
'size': (
|
|
454
|
+
'badge': (
|
|
455
|
+
'padding': (
|
|
456
|
+
'horizontal': (
|
|
457
|
+
'xl': $cat-size-badge-padding-horizontal-xl,
|
|
458
|
+
'l': $cat-size-badge-padding-horizontal-l,
|
|
459
|
+
'm': $cat-size-badge-padding-horizontal-m,
|
|
460
|
+
's': $cat-size-badge-padding-horizontal-s,
|
|
461
|
+
'xs': $cat-size-badge-padding-horizontal-xs
|
|
462
|
+
)
|
|
463
|
+
),
|
|
464
|
+
'height': (
|
|
465
|
+
'xl': $cat-size-badge-height-xl,
|
|
466
|
+
'l': $cat-size-badge-height-l,
|
|
467
|
+
'm': $cat-size-badge-height-m,
|
|
468
|
+
's': $cat-size-badge-height-s,
|
|
469
|
+
'xs': $cat-size-badge-height-xs
|
|
470
|
+
),
|
|
471
|
+
'font': (
|
|
472
|
+
'xl': $cat-size-badge-font-xl,
|
|
473
|
+
'l': $cat-size-badge-font-l,
|
|
474
|
+
'm': $cat-size-badge-font-m,
|
|
475
|
+
's': $cat-size-badge-font-s,
|
|
476
|
+
'xs': $cat-size-badge-font-xs
|
|
477
|
+
)
|
|
478
|
+
),
|
|
439
479
|
'base': (
|
|
440
480
|
'xl': $cat-size-base-xl,
|
|
441
481
|
'l': $cat-size-base-l,
|