@phila/phila-ui-core 2.3.3-beta.0 → 2.4.0-beta.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.
- package/dist/styles/elements/buttons.css +45 -41
- package/dist/styles/elements/icons.css +14 -14
- package/dist/styles/generated/extended-colors.css +0 -3
- package/dist/styles/generated/other.css +12 -32
- package/dist/styles/generated/palettes.css +75 -75
- package/dist/styles/generated/primitives.css +20 -27
- package/dist/styles/generated/ramps.css +257 -257
- package/dist/styles/generated/schemes.css +39 -32
- package/dist/styles/generated/size.css +1 -0
- package/dist/styles/generated/typography.css +19 -9
- package/dist/styles/legacy.css +13 -4
- package/dist/styles/raw/PhilaUI 4.0-variables.css +900 -2212
- package/dist/styles/typography.css +3 -3
- package/dist/styles/utilities/color.css +13 -4
- package/dist/styles/utilities/containers.css +1 -1
- package/dist/styles/utilities/spacing.css +23 -23
- package/package.json +1 -1
|
@@ -2,58 +2,65 @@
|
|
|
2
2
|
/* schemes */
|
|
3
3
|
/* Generated from Figma CSS export - references preserved */
|
|
4
4
|
|
|
5
|
-
--Schemes-Alert: var(--Palettes-Alert-Alert-
|
|
6
|
-
--Schemes-Alert-Container: var(--Palettes-Alert-Alert-
|
|
7
|
-
--Schemes-Background: var(--white-
|
|
8
|
-
--Schemes-Border: var(--Palettes-Neutral-Neutral-
|
|
9
|
-
--Schemes-Border-
|
|
10
|
-
--Schemes-
|
|
11
|
-
--Schemes-Error
|
|
5
|
+
--Schemes-Alert: var(--Palettes-Alert-Alert-500);
|
|
6
|
+
--Schemes-Alert-Container: var(--Palettes-Alert-Alert-700);
|
|
7
|
+
--Schemes-Background: var(--white-750-white);
|
|
8
|
+
--Schemes-Border: var(--Palettes-Neutral-Neutral-550);
|
|
9
|
+
--Schemes-Border-high: var(--Palettes-Neutral-Variant-Neutral-Variant-350);
|
|
10
|
+
--Schemes-Border-low: var(--Palettes-Neutral-Neutral-650);
|
|
11
|
+
--Schemes-Error: var(--Palettes-Error-Error-500);
|
|
12
|
+
--Schemes-Error-Container: var(--Palettes-Error-Error-700);
|
|
13
|
+
--Schemes-Info-Container: var(--powder-blue-700-powder-blue);
|
|
12
14
|
--Schemes-Inverse-Primary: var(--Palettes-Primary-Primary-400);
|
|
13
15
|
--Schemes-Inverse-Surface: var(--Palettes-Neutral-Variant-Neutral-Variant-200);
|
|
14
16
|
--Schemes-On-Alert: var(--Palettes-Alert-Alert-750);
|
|
15
|
-
--Schemes-On-Alert-Container: var(--
|
|
16
|
-
--Schemes-On-Background: var(--Schemes-On-Surface);
|
|
17
|
-
--Schemes-On-Error: var(--white-
|
|
18
|
-
--Schemes-On-Error-Container: var(--Palettes-Error-Error-
|
|
19
|
-
--Schemes-On-
|
|
17
|
+
--Schemes-On-Alert-Container: var(--Palettes-Alert-Alert-50);
|
|
18
|
+
--Schemes-On-Background: var(--Schemes-On-Surface-High);
|
|
19
|
+
--Schemes-On-Error: var(--white-750-white);
|
|
20
|
+
--Schemes-On-Error-Container: var(--Palettes-Error-Error-350);
|
|
21
|
+
--Schemes-On-Info-Container: var(--union-blue-200-union-blue);
|
|
22
|
+
--Schemes-On-Inverse-Surface: var(--Palettes-Neutral-Neutral-700);
|
|
20
23
|
--Schemes-On-Inverse-Surface-Bright: var(--Palettes-Neutral-Neutral-750);
|
|
21
|
-
--Schemes-On-Primary: var(--white-
|
|
22
|
-
--Schemes-On-Primary-Container: var(--Palettes-Primary-Primary-
|
|
24
|
+
--Schemes-On-Primary: var(--white-750-white);
|
|
25
|
+
--Schemes-On-Primary-Container: var(--Palettes-Primary-Primary-50);
|
|
23
26
|
--Schemes-On-Primary-Fixed: var(--Palettes-Primary-Primary-100);
|
|
24
27
|
--Schemes-On-Primary-Fixed-Variant: var(--Palettes-Primary-Primary-50);
|
|
25
|
-
--Schemes-On-Secondary: var(--
|
|
26
|
-
--Schemes-On-Secondary-Container: var(--Palettes-Secondary-Secondary-
|
|
28
|
+
--Schemes-On-Secondary: var(--Palettes-Secondary-Secondary-750);
|
|
29
|
+
--Schemes-On-Secondary-Container: var(--Palettes-Secondary-Secondary-50);
|
|
27
30
|
--Schemes-On-Secondary-Fixed: var(--Palettes-Secondary-Secondary-50);
|
|
28
31
|
--Schemes-On-Secondary-Fixed-Variant: var(--Palettes-Secondary-Secondary-250);
|
|
29
|
-
--Schemes-On-
|
|
32
|
+
--Schemes-On-Success-Container: var(--Palettes-Success-Success-250);
|
|
33
|
+
--Schemes-On-Surface: var(--Palettes-Neutral-Neutral-200);
|
|
34
|
+
--Schemes-On-Surface-High: var(--Palettes-Neutral-Neutral-50);
|
|
35
|
+
--Schemes-On-Surface-Low: var(--Palettes-Neutral-Neutral-300);
|
|
30
36
|
--Schemes-On-Surface-Variant: var(--Palettes-Neutral-Neutral-50);
|
|
31
37
|
--Schemes-On-Tertiary: var(--Palettes-Tertiary-Tertiary-750);
|
|
32
|
-
--Schemes-On-Tertiary-Container: var(--Palettes-Tertiary-Tertiary-
|
|
38
|
+
--Schemes-On-Tertiary-Container: var(--Palettes-Tertiary-Tertiary-150);
|
|
33
39
|
--Schemes-On-Tertiary-Fixed: var(--Palettes-Tertiary-Tertiary-150);
|
|
34
40
|
--Schemes-On-Tertiary-Fixed-Variant: var(--Palettes-Tertiary-Tertiary-50);
|
|
35
|
-
--Schemes-Primary: var(--
|
|
36
|
-
--Schemes-Primary-Container: var(--Palettes-Primary-Primary-
|
|
41
|
+
--Schemes-Primary: var(--sixers-blue-500-sixers-blue);
|
|
42
|
+
--Schemes-Primary-Container: var(--Palettes-Primary-Primary-700);
|
|
37
43
|
--Schemes-Primary-Fixed: var(--Palettes-Primary-Primary-650);
|
|
38
44
|
--Schemes-Primary-Fixed-Dim: var(--Palettes-Primary-Primary-400);
|
|
39
|
-
--Schemes-Scrim: var(--
|
|
40
|
-
--Schemes-Secondary: var(--Palettes-Secondary-Secondary-
|
|
41
|
-
--Schemes-Secondary-Container: var(--Palettes-Secondary-Secondary-
|
|
45
|
+
--Schemes-Scrim: var(--colors-Black-50);
|
|
46
|
+
--Schemes-Secondary: var(--Palettes-Secondary-Secondary-250);
|
|
47
|
+
--Schemes-Secondary-Container: var(--Palettes-Secondary-Secondary-700);
|
|
42
48
|
--Schemes-Secondary-Fixed: var(--Palettes-Secondary-Secondary-750);
|
|
43
49
|
--Schemes-Secondary-Fixed-Dim: var(--Palettes-Secondary-Secondary-550);
|
|
44
|
-
--Schemes-
|
|
45
|
-
--Schemes-
|
|
50
|
+
--Schemes-Success: var(--Palettes-Success-Success-500);
|
|
51
|
+
--Schemes-Success-Container: var(--Palettes-Success-Success-700);
|
|
52
|
+
--Schemes-Surface: var(--Palettes-Neutral-Neutral-700);
|
|
46
53
|
--Schemes-Surface-Bright: var(--Palettes-Neutral-Neutral-750);
|
|
47
|
-
--Schemes-Surface-Container: var(--Palettes-Neutral-Neutral-
|
|
54
|
+
--Schemes-Surface-Container: var(--Palettes-Neutral-Neutral-550);
|
|
48
55
|
--Schemes-Surface-Container-High: var(--Palettes-Neutral-Neutral-400);
|
|
49
56
|
--Schemes-Surface-Container-Highest: var(--Palettes-Neutral-Neutral-300);
|
|
50
|
-
--Schemes-Surface-Container-Low: var(--Palettes-Neutral-Neutral-
|
|
51
|
-
--Schemes-Surface-Container-Lowest: var(--Palettes-Neutral-Neutral-
|
|
52
|
-
--Schemes-Surface-Dim: var(--Palettes-Neutral-Neutral-
|
|
53
|
-
--Schemes-Surface-Tint: var(--Palettes-Secondary-Secondary-
|
|
54
|
-
--Schemes-Surface-Variant: var(--Palettes-Neutral-Variant-Neutral-Variant-
|
|
57
|
+
--Schemes-Surface-Container-Low: var(--Palettes-Neutral-Neutral-650);
|
|
58
|
+
--Schemes-Surface-Container-Lowest: var(--Palettes-Neutral-Neutral-700);
|
|
59
|
+
--Schemes-Surface-Dim: var(--Palettes-Neutral-Neutral-550);
|
|
60
|
+
--Schemes-Surface-Tint: var(--Palettes-Secondary-Secondary-450);
|
|
61
|
+
--Schemes-Surface-Variant: var(--Palettes-Neutral-Variant-Neutral-Variant-600);
|
|
55
62
|
--Schemes-Tertiary: var(--Palettes-Tertiary-Tertiary-150);
|
|
56
|
-
--Schemes-Tertiary-Container: var(--Palettes-Tertiary-Tertiary-
|
|
63
|
+
--Schemes-Tertiary-Container: var(--Palettes-Tertiary-Tertiary-700);
|
|
57
64
|
--Schemes-Tertiary-Fixed: var(--Palettes-Tertiary-Tertiary-600);
|
|
58
65
|
--Schemes-Tertiary-Fixed-Dim: var(--Palettes-Tertiary-Tertiary-550);
|
|
59
66
|
}
|
|
@@ -10,6 +10,7 @@
|
|
|
10
10
|
--border-radius-s: var(--scale-100);
|
|
11
11
|
--border-radius-xl: var(--scale-300);
|
|
12
12
|
--border-radius-xs: var(--scale-50);
|
|
13
|
+
--border-radius-xxs: var(--scale-25);
|
|
13
14
|
--border-width-2xl: var(--scale-100);
|
|
14
15
|
--border-width-l: var(--scale-50);
|
|
15
16
|
--border-width-m: var(--scale-25);
|
|
@@ -147,6 +147,18 @@
|
|
|
147
147
|
--Label-2XL-font-label-2xl-margin-top: var(--Body-2XL-font-body-2xl-margin-top);
|
|
148
148
|
--Label-2XL-font-label-2xl-size: var(--Body-2XL-font-body-2xl-size);
|
|
149
149
|
--Label-2XL-font-label-2xl-weight: var(--Base-font-variables-Weight-font-weight-semibold);
|
|
150
|
+
--Label-3XL-font-label-3xl-family: var(--Heading-font-heading-family);
|
|
151
|
+
--Label-3XL-font-label-3xl-lineheight: var(--scale-600);
|
|
152
|
+
--Label-3XL-font-label-3xl-margin-bottom: var(--scale-200);
|
|
153
|
+
--Label-3XL-font-label-3xl-margin-top: var(--scale-100);
|
|
154
|
+
--Label-3XL-font-label-3xl-size: var(--scale-450);
|
|
155
|
+
--Label-3XL-font-label-3xl-weight: var(--Base-font-variables-Weight-font-weight-semibold);
|
|
156
|
+
--Label-4XL-font-label-4xl-family: var(--Heading-font-heading-family);
|
|
157
|
+
--Label-4XL-font-label-4xl-lineheight: var(--scale-600);
|
|
158
|
+
--Label-4XL-font-label-4xl-margin-bottom: var(--scale-200);
|
|
159
|
+
--Label-4XL-font-label-4xl-margin-top: var(--scale-200);
|
|
160
|
+
--Label-4XL-font-label-4xl-size: var(--scale-500);
|
|
161
|
+
--Label-4XL-font-label-4xl-weight: var(--Base-font-variables-Weight-font-weight-semibold);
|
|
150
162
|
--Label-Default-font-label-default-family: var(--Label-font-label-family);
|
|
151
163
|
--Label-Default-font-label-default-lineheight: var(--Body-Default-font-body-default-lineheight);
|
|
152
164
|
--Label-Default-font-label-default-margin-bottom: var(--Body-Default-font-body-default-margin-bottom);
|
|
@@ -309,15 +321,13 @@
|
|
|
309
321
|
--Heading-H6-font-heading-6-lineheight: var(--scale-300);
|
|
310
322
|
--Heading-H6-font-heading-6-margin-top: var(--scale-200);
|
|
311
323
|
--Heading-H6-font-heading-6-size: var(--scale-200);
|
|
324
|
+
--Label-3XL-font-label-3xl-margin-bottom: var(--scale-300);
|
|
325
|
+
--Label-3XL-font-label-3xl-margin-top: var(--scale-200);
|
|
326
|
+
--Label-3XL-font-label-3xl-size: var(--scale-500);
|
|
327
|
+
--Label-4XL-font-label-4xl-lineheight: var(--scale-800);
|
|
328
|
+
--Label-4XL-font-label-4xl-margin-bottom: var(--scale-300);
|
|
329
|
+
--Label-4XL-font-label-4xl-margin-top: var(--scale-300);
|
|
330
|
+
--Label-4XL-font-label-4xl-size: var(--scale-600);
|
|
312
331
|
--Label-ExtraSmall-font-label-xs-margin-top: var(--Body-Default-font-body-default-margin-top);
|
|
313
|
-
--Link-on-Primary-Default-font-link-on-primary-default-weight: var(
|
|
314
|
-
--Base-font-variables-Weight-font-weight-regular
|
|
315
|
-
);
|
|
316
|
-
--Link-on-Primary-ExtraLarge-font-link-on-primary-xlarge-weight: var(
|
|
317
|
-
--Base-font-variables-Weight-font-weight-regular
|
|
318
|
-
);
|
|
319
|
-
--Link-on-Primary-ExtraSmall-font-link-on-primary-xs-weight: var(--Base-font-variables-Weight-font-weight-light);
|
|
320
|
-
--Link-on-Primary-Large-font-link-on-primary-large-weight: var(--Base-font-variables-Weight-font-weight-regular);
|
|
321
|
-
--Link-on-Primary-Small-font-link-on-primary-small-weight: var(--Base-font-variables-Weight-font-weight-light);
|
|
322
332
|
}
|
|
323
333
|
}
|
package/dist/styles/legacy.css
CHANGED
|
@@ -53,8 +53,17 @@
|
|
|
53
53
|
--sizes-scale-1100: var(--scale-1100);
|
|
54
54
|
--sizes-scale-1200: var(--scale-1200);
|
|
55
55
|
|
|
56
|
-
/*
|
|
57
|
-
--Extended-Colors-link-default
|
|
58
|
-
--Extended-Colors-link-hover
|
|
59
|
-
--Extended-Colors-link-visited
|
|
56
|
+
/* Link color tokens (removed from Figma export; maintained manually here) */
|
|
57
|
+
--Extended-Colors-link-default: var(--Schemes-Primary);
|
|
58
|
+
--Extended-Colors-link-hover: var(--Schemes-On-Surface-High);
|
|
59
|
+
--Extended-Colors-link-visited: var(--Palettes-Visited-Visited-450);
|
|
60
|
+
--Extended-Colors-link-default-on-primary: #ecfdff;
|
|
61
|
+
--Extended-Colors-link-hover-on-primary: #25cef7;
|
|
62
|
+
--Extended-Colors-link-visited-on-primary: #e9ccf2;
|
|
63
|
+
|
|
64
|
+
/* --spacing-xxl was never in the Figma export; alias to spacing-2xl */
|
|
65
|
+
--spacing-xxl: var(--spacing-2xl);
|
|
66
|
+
|
|
67
|
+
/* --Focus-Ring-Color is defined in a component selector in Figma, not extracted to generated CSS */
|
|
68
|
+
--Focus-Ring-Color: var(--Schemes-Primary);
|
|
60
69
|
}
|