@db-ux/core-foundations 4.0.1 → 4.0.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 (61) hide show
  1. package/CHANGELOG.md +28 -0
  2. package/agent/_instructions.md +43 -3
  3. package/agent/css/Variables.md +3 -1
  4. package/agent/scss/Variables.md +1 -1
  5. package/agent/tailwind/Variables.md +127 -66
  6. package/build/styles/absolute.css +2 -0
  7. package/build/styles/density/classes/all.css +2 -0
  8. package/build/styles/density/classes/expressive.css +2 -0
  9. package/build/styles/density/classes/functional.css +2 -0
  10. package/build/styles/density/classes/regular.css +2 -0
  11. package/build/styles/fonts/_index.scss +1 -0
  12. package/build/styles/fonts/_variables.scss +23 -0
  13. package/build/styles/fonts/classes/all.css +3 -0
  14. package/build/styles/fonts/classes/body/2xl.css +3 -0
  15. package/build/styles/fonts/classes/body/2xs.css +3 -0
  16. package/build/styles/fonts/classes/body/3xl.css +3 -0
  17. package/build/styles/fonts/classes/body/3xs.css +3 -0
  18. package/build/styles/fonts/classes/body/all.css +3 -0
  19. package/build/styles/fonts/classes/body/lg.css +3 -0
  20. package/build/styles/fonts/classes/body/md.css +3 -0
  21. package/build/styles/fonts/classes/body/sm.css +3 -0
  22. package/build/styles/fonts/classes/body/xl.css +3 -0
  23. package/build/styles/fonts/classes/body/xs.css +3 -0
  24. package/build/styles/fonts/classes/headline/2xl.css +3 -0
  25. package/build/styles/fonts/classes/headline/2xs.css +3 -0
  26. package/build/styles/fonts/classes/headline/3xl.css +3 -0
  27. package/build/styles/fonts/classes/headline/3xs.css +3 -0
  28. package/build/styles/fonts/classes/headline/all.css +3 -0
  29. package/build/styles/fonts/classes/headline/lg.css +3 -0
  30. package/build/styles/fonts/classes/headline/md.css +3 -0
  31. package/build/styles/fonts/classes/headline/sm.css +3 -0
  32. package/build/styles/fonts/classes/headline/xl.css +3 -0
  33. package/build/styles/fonts/classes/headline/xs.css +3 -0
  34. package/build/styles/index.css +2 -0
  35. package/build/styles/relative.css +2 -0
  36. package/build/styles/rollup.css +2 -0
  37. package/build/styles/webpack.css +2 -0
  38. package/build/tailwind/tailwind-tokens.json +1717 -0
  39. package/build/tailwind/theme/_variables.scss +14 -0
  40. package/build/tailwind/theme/colors/blue.css +154 -0
  41. package/build/tailwind/theme/colors/brand.css +160 -0
  42. package/build/tailwind/theme/colors/burgundy.css +160 -0
  43. package/build/tailwind/theme/colors/critical.css +160 -0
  44. package/build/tailwind/theme/colors/cyan.css +154 -0
  45. package/build/tailwind/theme/colors/green.css +160 -0
  46. package/build/tailwind/theme/colors/index.css +19 -0
  47. package/build/tailwind/theme/colors/informational.css +172 -0
  48. package/build/tailwind/theme/colors/light-green.css +166 -0
  49. package/build/tailwind/theme/colors/neutral.css +160 -0
  50. package/build/tailwind/theme/colors/orange.css +160 -0
  51. package/build/tailwind/theme/colors/pink.css +154 -0
  52. package/build/tailwind/theme/colors/red.css +154 -0
  53. package/build/tailwind/theme/colors/successful.css +166 -0
  54. package/build/tailwind/theme/colors/turquoise.css +160 -0
  55. package/build/tailwind/theme/colors/violet.css +160 -0
  56. package/build/tailwind/theme/colors/warning.css +160 -0
  57. package/build/tailwind/theme/colors/yellow.css +160 -0
  58. package/build/tailwind/theme/dimensions.css +28 -0
  59. package/build/tailwind/theme/index.css +46 -1
  60. package/package.json +3 -3
  61. /package/build/tailwind/theme/{colors.css → colors/colors.css} +0 -0
@@ -0,0 +1,160 @@
1
+ /* The prefix for variables are predefined by Tailwind, stylelint would throw an error */
2
+ /* stylelint-disable-next-line scss/at-rule-no-unknown */
3
+ @theme {
4
+ /* stylelint-disable-next-line custom-property-pattern */
5
+ --color-*: initial; /* Color utilities like */
6
+
7
+ /* Basic-Level */
8
+ --color-yellow-bg-basic-level-1-default: var(
9
+ --db-yellow-bg-basic-level-1-default
10
+ );
11
+ --color-yellow-bg-basic-level-1-hovered: var(
12
+ --db-yellow-bg-basic-level-1-hovered
13
+ );
14
+ --color-yellow-bg-basic-level-1-pressed: var(
15
+ --db-yellow-bg-basic-level-1-pressed
16
+ );
17
+ --color-yellow-bg-basic-level-2-default: var(
18
+ --db-yellow-bg-basic-level-2-default
19
+ );
20
+ --color-yellow-bg-basic-level-2-hovered: var(
21
+ --db-yellow-bg-basic-level-2-hovered
22
+ );
23
+ --color-yellow-bg-basic-level-2-pressed: var(
24
+ --db-yellow-bg-basic-level-2-pressed
25
+ );
26
+ --color-yellow-bg-basic-level-3-default: var(
27
+ --db-yellow-bg-basic-level-3-default
28
+ );
29
+ --color-yellow-bg-basic-level-3-hovered: var(
30
+ --db-yellow-bg-basic-level-3-hovered
31
+ );
32
+ --color-yellow-bg-basic-level-3-pressed: var(
33
+ --db-yellow-bg-basic-level-3-pressed
34
+ );
35
+
36
+ /* Transparent */
37
+ --color-yellow-bg-basic-transparent-full-default: var(
38
+ --db-yellow-bg-basic-transparent-full-default
39
+ );
40
+ --color-yellow-bg-basic-transparent-semi-default: var(
41
+ --db-yellow-bg-basic-transparent-semi-default
42
+ );
43
+ --color-yellow-bg-basic-transparent-full-hovered: var(
44
+ --db-yellow-bg-basic-transparent-full-hovered
45
+ );
46
+ --color-yellow-bg-basic-transparent-full-pressed: var(
47
+ --db-yellow-bg-basic-transparent-full-pressed
48
+ );
49
+ --color-yellow-bg-basic-transparent-semi-hovered: var(
50
+ --db-yellow-bg-basic-transparent-semi-hovered
51
+ );
52
+ --color-yellow-bg-basic-transparent-semi-pressed: var(
53
+ --db-yellow-bg-basic-transparent-semi-pressed
54
+ );
55
+
56
+ /* Inverted */
57
+ --color-yellow-bg-inverted-contrast-max-default: var(
58
+ --db-yellow-bg-inverted-contrast-max-default
59
+ );
60
+ --color-yellow-bg-inverted-contrast-max-hovered: var(
61
+ --db-yellow-bg-inverted-contrast-max-hovered
62
+ );
63
+ --color-yellow-bg-inverted-contrast-max-pressed: var(
64
+ --db-yellow-bg-inverted-contrast-max-pressed
65
+ );
66
+ --color-yellow-bg-inverted-contrast-high-default: var(
67
+ --db-yellow-bg-inverted-contrast-high-default
68
+ );
69
+ --color-yellow-bg-inverted-contrast-high-hovered: var(
70
+ --db-yellow-bg-inverted-contrast-high-hovered
71
+ );
72
+ --color-yellow-bg-inverted-contrast-high-pressed: var(
73
+ --db-yellow-bg-inverted-contrast-high-pressed
74
+ );
75
+ --color-yellow-bg-inverted-contrast-low-default: var(
76
+ --db-yellow-bg-inverted-contrast-low-default
77
+ );
78
+ --color-yellow-bg-inverted-contrast-low-hovered: var(
79
+ --db-yellow-bg-inverted-contrast-low-hovered
80
+ );
81
+ --color-yellow-bg-inverted-contrast-low-pressed: var(
82
+ --db-yellow-bg-inverted-contrast-low-pressed
83
+ );
84
+
85
+ /* On Colors */
86
+
87
+ --color-yellow-on-bg-basic-emphasis-100-default: var(
88
+ --db-yellow-on-bg-basic-emphasis-100-default
89
+ );
90
+ --color-yellow-on-bg-basic-emphasis-100-hovered: var(
91
+ --db-yellow-on-bg-basic-emphasis-100-hovered
92
+ );
93
+ --color-yellow-on-bg-basic-emphasis-100-pressed: var(
94
+ --db-yellow-on-bg-basic-emphasis-100-pressed
95
+ );
96
+ --color-yellow-on-bg-basic-emphasis-90-default: var(
97
+ --db-yellow-on-bg-basic-emphasis-90-default
98
+ );
99
+ --color-yellow-on-bg-basic-emphasis-90-hovered: var(
100
+ --db-yellow-on-bg-basic-emphasis-90-hovered
101
+ );
102
+ --color-yellow-on-bg-basic-emphasis-90-pressed: var(
103
+ --db-yellow-on-bg-basic-emphasis-90-pressed
104
+ );
105
+ --color-yellow-on-bg-basic-emphasis-80-default: var(
106
+ --db-yellow-on-bg-basic-emphasis-80-default
107
+ );
108
+ --color-yellow-on-bg-basic-emphasis-80-hovered: var(
109
+ --db-yellow-on-bg-basic-emphasis-80-hovered
110
+ );
111
+ --color-yellow-on-bg-basic-emphasis-80-pressed: var(
112
+ --db-yellow-on-bg-basic-emphasis-80-pressed
113
+ );
114
+ --color-yellow-on-bg-basic-emphasis-70-default: var(
115
+ --db-yellow-on-bg-basic-emphasis-70-default
116
+ );
117
+ --color-yellow-on-bg-basic-emphasis-70-hovered: var(
118
+ --db-yellow-on-bg-basic-emphasis-70-hovered
119
+ );
120
+ --color-yellow-on-bg-basic-emphasis-70-pressed: var(
121
+ --db-yellow-on-bg-basic-emphasis-70-pressed
122
+ );
123
+ --color-yellow-on-bg-basic-emphasis-60-default: var(
124
+ --db-yellow-on-bg-basic-emphasis-60-default
125
+ );
126
+ --color-yellow-on-bg-basic-emphasis-60-hovered: var(
127
+ --db-yellow-on-bg-basic-emphasis-60-hovered
128
+ );
129
+ --color-yellow-on-bg-basic-emphasis-60-pressed: var(
130
+ --db-yellow-on-bg-basic-emphasis-60-pressed
131
+ );
132
+ --color-yellow-on-bg-basic-emphasis-50-default: var(
133
+ --db-yellow-on-bg-basic-emphasis-50-default
134
+ );
135
+ --color-yellow-on-bg-basic-emphasis-50-hovered: var(
136
+ --db-yellow-on-bg-basic-emphasis-50-hovered
137
+ );
138
+ --color-yellow-on-bg-basic-emphasis-50-pressed: var(
139
+ --db-yellow-on-bg-basic-emphasis-50-pressed
140
+ );
141
+
142
+ /* On Inverted */
143
+ --color-yellow-on-bg-inverted-default: var(
144
+ --db-yellow-on-bg-inverted-default
145
+ );
146
+ --color-yellow-on-bg-inverted-hovered: var(
147
+ --db-yellow-on-bg-inverted-hovered
148
+ );
149
+ --color-yellow-on-bg-inverted-pressed: var(
150
+ --db-yellow-on-bg-inverted-pressed
151
+ );
152
+
153
+ /* On Origin */
154
+ --color-yellow-on-origin-default: var(--db-yellow-on-origin-default);
155
+ --color-yellow-on-origin-hovered: var(--db-yellow-on-origin-hovered);
156
+ --color-yellow-on-origin-pressed: var(--db-yellow-on-origin-pressed);
157
+ --color-yellow-origin-default: var(--db-yellow-origin-default);
158
+ --color-yellow-origin-hovered: var(--db-yellow-origin-hovered);
159
+ --color-yellow-origin-pressed: var(--db-yellow-origin-pressed);
160
+ }
@@ -26,6 +26,20 @@
26
26
  --spacing-siz-xl: var(--db-sizing-xl);
27
27
  --spacing-siz-2xl: var(--db-sizing-2xl);
28
28
  --spacing-siz-3xl: var(--db-sizing-3xl);
29
+ --spacing-screen-xs: var(--db-screen-xs);
30
+ --spacing-screen-sm: var(--db-screen-sm);
31
+ --spacing-screen-md: var(--db-screen-md);
32
+ --spacing-screen-lg: var(--db-screen-lg);
33
+ --spacing-screen-xl: var(--db-screen-xl);
34
+ --spacing-container-3xs: var(--db-container-3xs);
35
+ --spacing-container-2xs: var(--db-container-2xs);
36
+ --spacing-container-xs: var(--db-container-xs);
37
+ --spacing-container-sm: var(--db-container-sm);
38
+ --spacing-container-md: var(--db-container-md);
39
+ --spacing-container-lg: var(--db-container-lg);
40
+ --spacing-container-xl: var(--db-container-xl);
41
+ --spacing-container-2xl: var(--db-container-2xl);
42
+ --spacing-container-3xl: var(--db-container-3xl);
29
43
  --gap-3xs: var(--db-spacing-fixed-3xs);
30
44
  --gap-2xs: var(--db-spacing-fixed-2xs);
31
45
  --gap-xs: var(--db-spacing-fixed-xs);
@@ -95,6 +109,20 @@
95
109
  --spacing-siz-xl: var(--db-sizing-xl);
96
110
  --spacing-siz-2xl: var(--db-sizing-2xl);
97
111
  --spacing-siz-3xl: var(--db-sizing-3xl);
112
+ --spacing-screen-xs: var(--db-screen-xs);
113
+ --spacing-screen-sm: var(--db-screen-sm);
114
+ --spacing-screen-md: var(--db-screen-md);
115
+ --spacing-screen-lg: var(--db-screen-lg);
116
+ --spacing-screen-xl: var(--db-screen-xl);
117
+ --spacing-container-3xs: var(--db-container-3xs);
118
+ --spacing-container-2xs: var(--db-container-2xs);
119
+ --spacing-container-xs: var(--db-container-xs);
120
+ --spacing-container-sm: var(--db-container-sm);
121
+ --spacing-container-md: var(--db-container-md);
122
+ --spacing-container-lg: var(--db-container-lg);
123
+ --spacing-container-xl: var(--db-container-xl);
124
+ --spacing-container-2xl: var(--db-container-2xl);
125
+ --spacing-container-3xl: var(--db-container-3xl);
98
126
  --gap-3xs: var(--db-spacing-fixed-3xs);
99
127
  --gap-2xs: var(--db-spacing-fixed-2xs);
100
128
  --gap-xs: var(--db-spacing-fixed-xs);
@@ -1,7 +1,7 @@
1
1
  /* stylelint-disable custom-property-pattern, custom-property-empty-line-before, import-notation, scss/at-rule-no-unknown */
2
2
 
3
3
  /* The prefix for variables are predefined by Tailwind, stylelint would throw an error */
4
- @import "./colors.css";
4
+ @import "./colors/index.css";
5
5
  @import "./revert-theme.css";
6
6
  @import "./dimensions.css";
7
7
 
@@ -77,6 +77,51 @@
77
77
  font: var(--db-type-headline-3xl);
78
78
  }
79
79
 
80
+ @utility text-head-light-3xs {
81
+ font: var(--db-type-headline-3xs);
82
+ font-weight: 300;
83
+ }
84
+
85
+ @utility text-head-light-2xs {
86
+ font: var(--db-type-headline-2xs);
87
+ font-weight: 300;
88
+ }
89
+
90
+ @utility text-head-light-xs {
91
+ font: var(--db-type-headline-xs);
92
+ font-weight: 300;
93
+ }
94
+
95
+ @utility text-head-light-sm {
96
+ font: var(--db-type-headline-sm);
97
+ font-weight: 300;
98
+ }
99
+
100
+ @utility text-head-light-md {
101
+ font: var(--db-type-headline-md);
102
+ font-weight: 300;
103
+ }
104
+
105
+ @utility text-head-light-lg {
106
+ font: var(--db-type-headline-lg);
107
+ font-weight: 300;
108
+ }
109
+
110
+ @utility text-head-light-xl {
111
+ font: var(--db-type-headline-xl);
112
+ font-weight: 300;
113
+ }
114
+
115
+ @utility text-head-light-2xl {
116
+ font: var(--db-type-headline-2xl);
117
+ font-weight: 300;
118
+ }
119
+
120
+ @utility text-head-light-3xl {
121
+ font: var(--db-type-headline-3xl);
122
+ font-weight: 300;
123
+ }
124
+
80
125
  @layer base {
81
126
  p {
82
127
  font: var(--db-type-body-md);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@db-ux/core-foundations",
3
- "version": "4.0.1",
3
+ "version": "4.0.2",
4
4
  "type": "module",
5
5
  "description": "Provides basic tokens and assets based on DB UX Design System (Version 3).",
6
6
  "repository": {
@@ -53,7 +53,7 @@
53
53
  "devDependencies": {
54
54
  "@csstools/normalize.css": "12.1.1",
55
55
  "@db-ux/icon-font-tools": "0.3.4",
56
- "@playwright/test": "1.55.1",
56
+ "@playwright/test": "1.56.0",
57
57
  "cpr": "3.0.1",
58
58
  "cssnano": "7.1.1",
59
59
  "dotenv": "17.2.3",
@@ -63,7 +63,7 @@
63
63
  "sass": "1.85.0",
64
64
  "tsx": "4.20.6",
65
65
  "typescript": "5.9.3",
66
- "vite": "7.1.9"
66
+ "vite": "7.1.10"
67
67
  },
68
68
  "publishConfig": {
69
69
  "registry": "https://registry.npmjs.org/",