ui-style-kit-css 2.0.4 → 2.1.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/CHANGELOG.md +23 -0
- package/README.md +62 -15
- package/dist/ui-style-kit.css +10349 -4578
- package/dist/ui-style-kit.min.css +3 -2
- package/dist/ui-style-kit.visual.css +11125 -0
- package/dist/ui-style-kit.visual.min.css +7 -0
- package/dist/ui-style-kit.with-bridge.css +10355 -4583
- package/dist/ui-style-kit.with-bridge.min.css +3 -2
- package/dist/visual/bauhaus.css +2948 -0
- package/dist/visual/bento.css +2967 -0
- package/dist/visual/brutalism.css +2731 -0
- package/dist/visual/cyberpunk.css +2757 -0
- package/dist/visual/maximalist.css +2955 -0
- package/dist/visual/minimal-saas.css +2946 -0
- package/dist/visual/neumorphism.css +2952 -0
- package/dist/visual/retro-glass.css +2768 -0
- package/dist/visual/retrofuturism.css +2939 -0
- package/dist/visual/tactile.css +2933 -0
- package/dist/visual/y2k.css +2729 -0
- package/docs/ECOSYSTEM.md +13 -12
- package/docs/NATIVE-ELEMENTS.md +52 -0
- package/docs/PUBLISHING.md +14 -4
- package/docs/TOKENS.md +13 -0
- package/manifest.json +436 -0
- package/package.json +27 -4
- package/styles/compat-layout.css +88 -0
- package/styles/components.css +671 -0
- package/styles/interactive-surface-bridge.css +5 -3
- package/styles/interactive-surface-theme.css +114 -0
- package/styles/maximalist.css +1 -1
- package/styles/native-elements.css +211 -9
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "ui-style-kit-css",
|
|
3
|
-
"version": "2.0
|
|
3
|
+
"version": "2.1.0",
|
|
4
4
|
"description": "CSS theme and UI style preset library for accessible websites, dashboards, admin interfaces, and client-facing pages.",
|
|
5
5
|
"style": "dist/ui-style-kit.css",
|
|
6
6
|
"main": "dist/ui-style-kit.css",
|
|
@@ -13,6 +13,7 @@
|
|
|
13
13
|
"README.md",
|
|
14
14
|
"LICENSE",
|
|
15
15
|
"CHANGELOG.md",
|
|
16
|
+
"manifest.json",
|
|
16
17
|
"STYLE-MAP.md",
|
|
17
18
|
"CONTRIBUTING.md",
|
|
18
19
|
"SECURITY.md"
|
|
@@ -57,6 +58,20 @@
|
|
|
57
58
|
"./css.css": "./dist/ui-style-kit.css",
|
|
58
59
|
"./min": "./dist/ui-style-kit.min.css",
|
|
59
60
|
"./min.css": "./dist/ui-style-kit.min.css",
|
|
61
|
+
"./visual": "./dist/ui-style-kit.visual.css",
|
|
62
|
+
"./visual.css": "./dist/ui-style-kit.visual.css",
|
|
63
|
+
"./visual.min.css": "./dist/ui-style-kit.visual.min.css",
|
|
64
|
+
"./visual/minimal-saas.css": "./dist/visual/minimal-saas.css",
|
|
65
|
+
"./visual/bento.css": "./dist/visual/bento.css",
|
|
66
|
+
"./visual/maximalist.css": "./dist/visual/maximalist.css",
|
|
67
|
+
"./visual/bauhaus.css": "./dist/visual/bauhaus.css",
|
|
68
|
+
"./visual/tactile.css": "./dist/visual/tactile.css",
|
|
69
|
+
"./visual/neumorphism.css": "./dist/visual/neumorphism.css",
|
|
70
|
+
"./visual/retrofuturism.css": "./dist/visual/retrofuturism.css",
|
|
71
|
+
"./visual/brutalism.css": "./dist/visual/brutalism.css",
|
|
72
|
+
"./visual/cyberpunk.css": "./dist/visual/cyberpunk.css",
|
|
73
|
+
"./visual/y2k.css": "./dist/visual/y2k.css",
|
|
74
|
+
"./visual/retro-glass.css": "./dist/visual/retro-glass.css",
|
|
60
75
|
"./dist/ui-style-kit.css": "./dist/ui-style-kit.css",
|
|
61
76
|
"./dist/ui-style-kit.min.css": "./dist/ui-style-kit.min.css",
|
|
62
77
|
"./package.json": "./package.json",
|
|
@@ -116,6 +131,8 @@
|
|
|
116
131
|
"./styles/retro-glass.css": "./styles/retro-glass.css",
|
|
117
132
|
"./retro-glass": "./styles/retro-glass.css",
|
|
118
133
|
"./retro-glass.css": "./styles/retro-glass.css",
|
|
134
|
+
"./interactive-surface-theme": "./styles/interactive-surface-theme.css",
|
|
135
|
+
"./interactive-surface-theme.css": "./styles/interactive-surface-theme.css",
|
|
119
136
|
"./styles/interactive-surface-bridge": "./styles/interactive-surface-bridge.css",
|
|
120
137
|
"./styles/interactive-surface-bridge.css": "./styles/interactive-surface-bridge.css",
|
|
121
138
|
"./interactive-surface-bridge": "./styles/interactive-surface-bridge.css",
|
|
@@ -123,7 +140,8 @@
|
|
|
123
140
|
"./with-bridge": "./dist/ui-style-kit.with-bridge.css",
|
|
124
141
|
"./with-bridge.css": "./dist/ui-style-kit.with-bridge.css",
|
|
125
142
|
"./dist/ui-style-kit.with-bridge.css": "./dist/ui-style-kit.with-bridge.css",
|
|
126
|
-
"./dist/ui-style-kit.with-bridge.min.css": "./dist/ui-style-kit.with-bridge.min.css"
|
|
143
|
+
"./dist/ui-style-kit.with-bridge.min.css": "./dist/ui-style-kit.with-bridge.min.css",
|
|
144
|
+
"./manifest.json": "./manifest.json"
|
|
127
145
|
},
|
|
128
146
|
"repository": {
|
|
129
147
|
"type": "git",
|
|
@@ -138,7 +156,9 @@
|
|
|
138
156
|
},
|
|
139
157
|
"type": "module",
|
|
140
158
|
"devDependencies": {
|
|
159
|
+
"@axe-core/playwright": "4.12.1",
|
|
141
160
|
"@playwright/test": "~1.61.1",
|
|
161
|
+
"css-tree": "3.2.1",
|
|
142
162
|
"lightningcss": "1.33.0",
|
|
143
163
|
"stylelint": "~17.14.0"
|
|
144
164
|
},
|
|
@@ -150,11 +170,14 @@
|
|
|
150
170
|
"test": "npm run test:unit",
|
|
151
171
|
"test:unit": "node --test tests/*.test.js",
|
|
152
172
|
"test:e2e": "playwright test --config playwright.config.js",
|
|
153
|
-
"test:
|
|
173
|
+
"test:axe": "playwright test --config playwright.config.js tests/e2e/accessibility.spec.js",
|
|
174
|
+
"test:matrix": "playwright test --config playwright.matrix.config.js",
|
|
175
|
+
"test:e2e:install:ci": "playwright install --with-deps chromium firefox webkit",
|
|
176
|
+
"check:ecosystem:packs": "node scripts/check-ecosystem-packs.mjs",
|
|
154
177
|
"check": "npm run build && npm run lint && npm run test:unit && npm run check:contrast && npm run check:package",
|
|
155
178
|
"pack:dry-run": "npm pack --dry-run",
|
|
156
179
|
"prepack": "npm run check",
|
|
157
|
-
"release:verify": "npm run check && npm run test:e2e && npm run test:visual && npm audit --audit-level=moderate && npm run pack:dry-run",
|
|
180
|
+
"release:verify": "npm run check && npm run test:e2e && npm run test:axe && npm run test:visual && npm run test:matrix && npm run check:ecosystem:packs && npm audit --audit-level=moderate && npm run pack:dry-run",
|
|
158
181
|
"prepublishOnly": "npm run release:verify",
|
|
159
182
|
"release:patch": "npm version patch && npm publish",
|
|
160
183
|
"release:minor": "npm version minor && npm publish",
|
|
@@ -0,0 +1,88 @@
|
|
|
1
|
+
/* =========================================================
|
|
2
|
+
UI Style Kit CSS - Deprecated Compatibility Layout
|
|
3
|
+
|
|
4
|
+
These selectors preserve the v2 prefixed layout helpers.
|
|
5
|
+
New layouts should use layout-style-css; this selector set is frozen.
|
|
6
|
+
========================================================= */
|
|
7
|
+
|
|
8
|
+
@layer ui-style-kit.compat_layout {
|
|
9
|
+
[data-ui][data-theme][data-mode] :where(
|
|
10
|
+
[class~="saas-page"],
|
|
11
|
+
[class~="saas-container"],
|
|
12
|
+
[class~="saas-section"],
|
|
13
|
+
[class~="saas-grid"],
|
|
14
|
+
[class~="saas-stack"],
|
|
15
|
+
[class~="saas-cluster"],
|
|
16
|
+
[class~="saas-split"],
|
|
17
|
+
[class~="bento-page"],
|
|
18
|
+
[class~="bento-container"],
|
|
19
|
+
[class~="bento-section"],
|
|
20
|
+
[class~="bento-grid"],
|
|
21
|
+
[class~="bento-stack"],
|
|
22
|
+
[class~="bento-cluster"],
|
|
23
|
+
[class~="bento-split"],
|
|
24
|
+
[class~="max-page"],
|
|
25
|
+
[class~="max-container"],
|
|
26
|
+
[class~="max-section"],
|
|
27
|
+
[class~="max-grid"],
|
|
28
|
+
[class~="max-stack"],
|
|
29
|
+
[class~="max-cluster"],
|
|
30
|
+
[class~="max-split"],
|
|
31
|
+
[class~="bau-page"],
|
|
32
|
+
[class~="bau-container"],
|
|
33
|
+
[class~="bau-section"],
|
|
34
|
+
[class~="bau-grid"],
|
|
35
|
+
[class~="bau-stack"],
|
|
36
|
+
[class~="bau-cluster"],
|
|
37
|
+
[class~="bau-split"],
|
|
38
|
+
[class~="tactile-page"],
|
|
39
|
+
[class~="tactile-container"],
|
|
40
|
+
[class~="tactile-section"],
|
|
41
|
+
[class~="tactile-grid"],
|
|
42
|
+
[class~="tactile-stack"],
|
|
43
|
+
[class~="tactile-cluster"],
|
|
44
|
+
[class~="tactile-split"],
|
|
45
|
+
[class~="neo-page"],
|
|
46
|
+
[class~="neo-container"],
|
|
47
|
+
[class~="neo-section"],
|
|
48
|
+
[class~="neo-grid"],
|
|
49
|
+
[class~="neo-stack"],
|
|
50
|
+
[class~="neo-cluster"],
|
|
51
|
+
[class~="neo-split"],
|
|
52
|
+
[class~="retro-page"],
|
|
53
|
+
[class~="retro-container"],
|
|
54
|
+
[class~="retro-section"],
|
|
55
|
+
[class~="retro-grid"],
|
|
56
|
+
[class~="retro-stack"],
|
|
57
|
+
[class~="retro-cluster"],
|
|
58
|
+
[class~="retro-split"],
|
|
59
|
+
[class~="brutal-page"],
|
|
60
|
+
[class~="brutal-container"],
|
|
61
|
+
[class~="brutal-section"],
|
|
62
|
+
[class~="brutal-grid"],
|
|
63
|
+
[class~="brutal-stack"],
|
|
64
|
+
[class~="brutal-cluster"],
|
|
65
|
+
[class~="cyber-page"],
|
|
66
|
+
[class~="cyber-container"],
|
|
67
|
+
[class~="cyber-section"],
|
|
68
|
+
[class~="cyber-grid"],
|
|
69
|
+
[class~="cyber-stack"],
|
|
70
|
+
[class~="cyber-cluster"],
|
|
71
|
+
[class~="y2k-page"],
|
|
72
|
+
[class~="y2k-container"],
|
|
73
|
+
[class~="y2k-section"],
|
|
74
|
+
[class~="y2k-grid"],
|
|
75
|
+
[class~="y2k-stack"],
|
|
76
|
+
[class~="y2k-cluster"],
|
|
77
|
+
[class~="rg-page"],
|
|
78
|
+
[class~="rg-container"],
|
|
79
|
+
[class~="rg-section"],
|
|
80
|
+
[class~="rg-grid"],
|
|
81
|
+
[class~="rg-stack"],
|
|
82
|
+
[class~="rg-cluster"]
|
|
83
|
+
) {
|
|
84
|
+
max-inline-size: 100%;
|
|
85
|
+
min-inline-size: 0;
|
|
86
|
+
overflow-wrap: anywhere;
|
|
87
|
+
}
|
|
88
|
+
}
|