@digigov/css 2.0.0-rc.2 → 2.0.0-rc.21

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 (143) hide show
  1. package/dist/base/index.css +1 -1
  2. package/dist/base.js +1 -1
  3. package/dist/components.js +1 -1
  4. package/dist/digigov.css +3 -3
  5. package/dist/utilities/index.css +1 -1
  6. package/dist/utilities.js +1 -1
  7. package/index.js +99 -69
  8. package/package.json +14 -10
  9. package/postcss.config.js +4 -3
  10. package/src/base/base.css +1 -1
  11. package/src/base/index.css +6 -5
  12. package/src/base/postcss.config.js +11 -10
  13. package/src/base/tailwind.config.js +4 -11
  14. package/src/components/accordion.css +61 -54
  15. package/src/components/admin-header.css +2 -19
  16. package/src/components/admin-layout.css +13 -22
  17. package/src/components/autocomplete.css +89 -46
  18. package/src/components/back-to-top.css +3 -4
  19. package/src/components/blockquote.common.css +14 -0
  20. package/src/components/blockquote.css +9 -0
  21. package/src/components/blockquote.native.css +11 -0
  22. package/src/components/bottom-info.css +2 -1
  23. package/src/components/breadcrumbs.css +17 -8
  24. package/src/components/button.common.css +62 -0
  25. package/src/components/button.css +57 -71
  26. package/src/components/button.native.css +56 -0
  27. package/src/components/card.common.css +33 -0
  28. package/src/components/card.css +65 -52
  29. package/src/components/card.native.css +29 -0
  30. package/src/components/checkboxes.common.css +16 -0
  31. package/src/components/checkboxes.css +26 -31
  32. package/src/components/checkboxes.native.css +28 -0
  33. package/src/components/chip.css +28 -29
  34. package/src/components/code.css +127 -0
  35. package/src/components/components.css +2 -2
  36. package/src/components/copy-to-clipboard.css +27 -26
  37. package/src/components/copy-to-clipboard.native.css +28 -0
  38. package/src/components/details.common.css +26 -0
  39. package/src/components/details.css +14 -15
  40. package/src/components/details.native.css +26 -0
  41. package/src/components/dev-theme.css +2 -3
  42. package/src/components/drawer.css +47 -48
  43. package/src/components/dropdown.common.css +23 -0
  44. package/src/components/dropdown.css +57 -48
  45. package/src/components/dropdown.native.css +28 -0
  46. package/src/components/experimental.css +12 -12
  47. package/src/components/fillable.css +5 -5
  48. package/src/components/filter.css +15 -20
  49. package/src/components/footer.css +35 -21
  50. package/src/components/form.common.css +82 -0
  51. package/src/components/form.css +87 -49
  52. package/src/components/form.native.css +133 -0
  53. package/src/components/full-page-background.css +1 -1
  54. package/src/components/header.common.css +36 -0
  55. package/src/components/header.css +44 -43
  56. package/src/components/header.native.css +34 -0
  57. package/src/components/hidden.css +17 -17
  58. package/src/components/index.css +49 -47
  59. package/src/components/kitchensink.css +33 -33
  60. package/src/components/layout.common.css +36 -0
  61. package/src/components/layout.css +41 -42
  62. package/src/components/layout.native.css +39 -0
  63. package/src/components/loader.css +28 -28
  64. package/src/components/masthead.css +56 -55
  65. package/src/components/misc.css +37 -15
  66. package/src/components/modal.common.css +17 -0
  67. package/src/components/modal.css +31 -20
  68. package/src/components/modal.native.css +18 -0
  69. package/src/components/nav.common.css +22 -0
  70. package/src/components/nav.css +72 -67
  71. package/src/components/nav.native.css +41 -0
  72. package/src/components/notification-banner.common.css +46 -0
  73. package/src/components/notification-banner.css +23 -19
  74. package/src/components/notification-banner.native.css +42 -0
  75. package/src/components/pagination.css +30 -31
  76. package/src/components/panel.common.css +30 -0
  77. package/src/components/panel.css +10 -18
  78. package/src/components/panel.native.css +20 -0
  79. package/src/components/phase-banner.common.css +23 -0
  80. package/src/components/phase-banner.css +11 -10
  81. package/src/components/phase-banner.native.css +31 -0
  82. package/src/components/postcss.config.js +7 -6
  83. package/src/components/radios.common.css +16 -0
  84. package/src/components/radios.css +27 -30
  85. package/src/components/radios.native.css +24 -0
  86. package/src/components/skeleton.css +85 -0
  87. package/src/components/skiplink.css +2 -2
  88. package/src/components/stack.css +63 -63
  89. package/src/components/stepnav.css +35 -32
  90. package/src/components/summary-list.common.css +92 -0
  91. package/src/components/summary-list.css +101 -27
  92. package/src/components/summary-list.native.css +93 -0
  93. package/src/components/svg-icons.common.css +56 -0
  94. package/src/components/svg-icons.css +78 -80
  95. package/src/components/svg-icons.native.css +55 -0
  96. package/src/components/table.css +163 -182
  97. package/src/components/tabs.css +52 -67
  98. package/src/components/task-list.css +28 -23
  99. package/src/components/test.css +7 -0
  100. package/src/components/timeline.css +20 -18
  101. package/src/components/typography.common.css +135 -0
  102. package/src/components/typography.css +98 -189
  103. package/src/components/typography.native.css +97 -0
  104. package/src/components/warning-text.common.css +23 -0
  105. package/src/components/warning-text.css +11 -8
  106. package/src/components/warning-text.native.css +22 -0
  107. package/src/index.native.css +21 -0
  108. package/src/pages/index.js +1 -1
  109. package/src/utilities/gap.css +141 -0
  110. package/src/utilities/index.css +6 -1655
  111. package/src/utilities/index.native.css +6 -0
  112. package/src/utilities/layout.css +231 -0
  113. package/src/utilities/layout.native.css +278 -0
  114. package/src/utilities/margin.css +4299 -0
  115. package/src/utilities/padding.css +4299 -0
  116. package/src/utilities/postcss.config.js +7 -6
  117. package/src/utilities/print.css +11 -0
  118. package/src/utilities/utilities.css +3 -1660
  119. package/tailwind.config.js +101 -104
  120. package/theming.js +121 -0
  121. package/defaultTheme/accordion.json +0 -8
  122. package/defaultTheme/back-to-top.json +0 -27
  123. package/defaultTheme/brandConfig.json +0 -135
  124. package/defaultTheme/breadcrumbs.json +0 -8
  125. package/defaultTheme/button.json +0 -81
  126. package/defaultTheme/card.json +0 -12
  127. package/defaultTheme/footer.json +0 -8
  128. package/defaultTheme/form.json +0 -15
  129. package/defaultTheme/globals.json +0 -71
  130. package/defaultTheme/index.js +0 -27
  131. package/defaultTheme/misc.json +0 -48
  132. package/defaultTheme/panel.json +0 -43
  133. package/defaultTheme/phase-banner.json +0 -8
  134. package/defaultTheme/radios.json +0 -8
  135. package/defaultTheme/summary-list.json +0 -8
  136. package/defaultTheme/typography.json +0 -295
  137. package/src/pages/admin-filtering-data.js +0 -160
  138. package/src/pages/admin.js +0 -61
  139. package/src/pages/dropdown.js +0 -249
  140. package/src/pages/form.js +0 -400
  141. package/src/pages/pagination.js +0 -124
  142. package/src/pages/table.js +0 -308
  143. package/themes.plugin.js +0 -148
@@ -1,15 +0,0 @@
1
- {
2
- "label": {
3
- "font-size": {
4
- "xs": "var(--text-base)",
5
- "md": "var(--text-lg)"
6
- },
7
- "line-height": {
8
- "xs": "var(--line-h-base)",
9
- "md": "var(--line-h-lg)"
10
- },
11
- "letter-spacing": {
12
- "xs": "var(--letter-spacing-normal)"
13
- }
14
- }
15
- }
@@ -1,71 +0,0 @@
1
- {
2
-
3
- "text-sm-default": "0.875rem",
4
- "text-base-default": "1rem",
5
- "text-lg-default": "1.1875rem",
6
- "text-xl-default": "1.25rem",
7
- "text-2xl-default": "1.5rem",
8
- "text-3xl-default": "1.875rem",
9
- "text-4xl-default": "2.25rem",
10
- "text-5xl-default": "3rem",
11
-
12
- "text-sm-large": "1rem",
13
- "text-base-large": "1.25rem",
14
- "text-lg-large": "1.4rem",
15
- "text-xl-large": "1.6rem",
16
- "text-2xl-large": "1.875rem",
17
- "text-3xl-large": "2.25rem",
18
- "text-4xl-large": "2.5rem",
19
- "text-5xl-large": "3rem",
20
-
21
- "text-sm": "var(--text-sm-default)",
22
- "text-base": "var(--text-base-default)",
23
- "text-lg": "var(--text-lg-default)",
24
- "text-xl": "var(--text-xl-default)",
25
- "text-2xl": "var(--text-2xl-default)",
26
- "text-3xl": "var(--text-3xl-default)",
27
- "text-4xl": "var(--text-4xl-default)",
28
- "text-5xl": "var(--text-5xl-default)",
29
-
30
- "line-h-sm-default": "1.375",
31
- "line-h-base-default": "1.375",
32
- "line-h-lg-default": "1.375",
33
- "line-h-xl-default": "1.25",
34
- "line-h-2xl-default": "1.25",
35
- "line-h-3xl-default": "1.25",
36
- "line-h-4xl-default": "1.25",
37
- "line-h-5xl-default": "1.25",
38
-
39
- "line-h-sm-large": "2",
40
- "line-h-base-large": "2",
41
- "line-h-lg-large": "2",
42
- "line-h-xl-large": "1.75",
43
- "line-h-2xl-large": "1.75",
44
- "line-h-3xl-large": "1.5",
45
- "line-h-4xl-large": "1.5",
46
- "line-h-5xl-large": "1.25",
47
-
48
- "line-h-sm": "var(--line-h-sm-default)",
49
- "line-h-base": "var(--line-h-base-default)",
50
- "line-h-lg": "var(--line-h-lg-default)",
51
- "line-h-xl": "var(--line-h-xl-default)",
52
- "line-h-2xl": "var(--line-h-2xl-default)",
53
- "line-h-3xl": "var(--line-h-3xl-default)",
54
- "line-h-4xl": "var(--line-h-4xl-default)",
55
- "line-h-5xl": "var(--line-h-5xl-default)",
56
-
57
- "letter-spacing-normal-default": "normal",
58
- "letter-spacing-wide-default": "0.025rem",
59
- "letter-spacing-wider-default": "0.05rem",
60
- "letter-spacing-widest-default": "0.075rem",
61
-
62
- "letter-spacing-normal-extra": "0.05rem",
63
- "letter-spacing-wide-extra": "0.075rem",
64
- "letter-spacing-wider-extra": "0.01rem",
65
- "letter-spacing-widest-extra": "0.125rem",
66
-
67
- "letter-spacing-normal": "var(--letter-spacing-normal-default)",
68
- "letter-spacing-wide": "var(--letter-spacing-wide-default)",
69
- "letter-spacing-wider": "var(--letter-spacing-wider-default)",
70
- "letter-spacing-widest": "var(--letter-spacing-widest-default)"
71
- }
@@ -1,27 +0,0 @@
1
- const extractFromLeo = require("../leoTheme");
2
- const brandConfig = require("./brandConfig.json");
3
-
4
- module.exports = {
5
- name: "light",
6
- variables: {
7
- globals: {
8
- ...require("./globals.json"),
9
- },
10
- components: {
11
- ...require("./accordion.json"),
12
- ...require("./breadcrumbs.json"),
13
- ...require("./back-to-top.json"),
14
- ...require("./button.json"),
15
- ...require("./card.json"),
16
- ...require("./form.json"),
17
- ...require("./footer.json"),
18
- ...require("./misc.json"),
19
- ...require("./panel.json"),
20
- ...require("./phase-banner.json"),
21
- ...require("./radios.json"),
22
- ...require("./summary-list.json"),
23
- ...require("./typography.json"),
24
- },
25
- },
26
- colors: extractFromLeo(brandConfig, "light"),
27
- };
@@ -1,48 +0,0 @@
1
- {
2
- "warning-text": {
3
- "font-size": {
4
- "xs": "var(--text-base)",
5
- "md": "var(--text-lg)"
6
- }
7
- },
8
- "details": {
9
- "font-size": {
10
- "xs": "var(--text-base)",
11
- "md": "var(--text-lg)"
12
- },
13
- "line-height": {
14
- "xs": "var(--line-h-base)",
15
- "md": "var(--line-h-lg)"
16
- }
17
- },
18
- "details__summary": {
19
- "font-size": {
20
- "xs": "var(--text-base)",
21
- "md": "var(--text-lg)"
22
- },
23
- "line-height": {
24
- "xs": "var(--line-h-base)",
25
- "md": "var(--line-h-lg)"
26
- }
27
- },
28
- "details__summary--lg": {
29
- "font-size": {
30
- "xs": "var(--text-lg)",
31
- "md": "var(--text-xl)"
32
- },
33
- "line-height": {
34
- "xs": "var(--line-h-lg)",
35
- "md": "var(--line-h-xl)"
36
- }
37
- },
38
- "blockquote": {
39
- "font-size": {
40
- "xs": "var(--text-base)",
41
- "md": "var(--text-lg)"
42
- },
43
- "line-height": {
44
- "xs": "var(--line-h-base)",
45
- "md": "var(--line-h-lg)"
46
- }
47
- }
48
- }
@@ -1,43 +0,0 @@
1
- {
2
- "panel__title": {
3
- "font-size": {
4
- "xs": "var(--text-4xl)",
5
- "md": "var(--text-5xl)",
6
- "print": "var(--text-4xl)"
7
- },
8
- "line-height": {
9
- "xs": "var(--line-h-4xl)",
10
- "md": "var(--line-h-5xl)",
11
- "print": "var(--line-h-4xl)"
12
- },
13
- "margin-bottom": {
14
- "xs": "1rem",
15
- "md": "1.5rem",
16
- "print": "1.5rem"
17
- },
18
- "font-weight": {
19
- "xs": "700"
20
- },
21
- "letter-spacing": {
22
- "xs": "var(--letter-spacing-normal)"
23
- }
24
- },
25
- "panel__body": {
26
- "font-size": {
27
- "xs": "var(--text-2xl)",
28
- "md": "var(--text-4xl)",
29
- "print": "var(--text-2xl)"
30
- },
31
- "line-height": {
32
- "xs": "var(--line-h-2xl)",
33
- "md": "var(--line-h-4xl)",
34
- "print": "var(--line-h-2xl)"
35
- },
36
- "margin": {
37
- "xs": "auto"
38
- },
39
- "letter-spacing": {
40
- "xs": "var(--letter-spacing-normal)"
41
- }
42
- }
43
- }
@@ -1,8 +0,0 @@
1
- {
2
- "phase-banner__content": {
3
- "font-size": {
4
- "xs": "var(--text-base)",
5
- "md": "var(--text-lg)"
6
- }
7
- }
8
- }
@@ -1,8 +0,0 @@
1
- {
2
- "radios__label": {
3
- "font-size": {
4
- "xs": "var(--text-base)",
5
- "md": "var(--text-lg)"
6
- }
7
- }
8
- }
@@ -1,8 +0,0 @@
1
- {
2
- "summary-list": {
3
- "font-size": {
4
- "xs": "var(--text-base)",
5
- "md": "var(--text-lg)"
6
- }
7
- }
8
- }
@@ -1,295 +0,0 @@
1
- {
2
- "heading-xl": {
3
- "font-size": {
4
- "xs": "var(--text-3xl)",
5
- "md": "var(--text-5xl)"
6
- },
7
- "line-height": {
8
- "xs": "var(--line-h-3xl)",
9
- "md": "var(--line-h-5xl)"
10
- },
11
- "margin-bottom": {
12
- "xs": "2rem",
13
- "md": "3rem"
14
- },
15
- "font-weight": {
16
- "xs": "700"
17
- },
18
- "letter-spacing": {
19
- "xs": "var(--letter-spacing-normal)"
20
- }
21
- },
22
- "heading-lg": {
23
- "font-size": {
24
- "xs": "var(--text-2xl)",
25
- "md": "var(--text-4xl)"
26
- },
27
- "line-height": {
28
- "xs": "var(--line-h-2xl)",
29
- "md": "var(--line-h-4xl)"
30
- },
31
- "margin-bottom": {
32
- "xs": "2rem",
33
- "md": "2.5rem"
34
- },
35
- "font-weight": {
36
- "xs": "700"
37
- },
38
- "letter-spacing": {
39
- "xs": "var(--letter-spacing-normal)"
40
- }
41
- },
42
- "heading-md": {
43
- "font-size": {
44
- "xs": "var(--text-xl)",
45
- "md": "var(--text-2xl)"
46
- },
47
- "line-height": {
48
- "xs": "var(--line-h-xl)",
49
- "md": "var(--line-h-2xl)"
50
- },
51
- "margin-bottom": {
52
- "xs": "1.5rem",
53
- "md": "2rem"
54
- },
55
- "font-weight": {
56
- "xs": "700"
57
- },
58
- "letter-spacing": {
59
- "xs": "var(--letter-spacing-normal)"
60
- }
61
- },
62
- "heading-sm": {
63
- "font-size": {
64
- "xs": "var(--text-base)",
65
- "md": "var(--text-lg)"
66
- },
67
- "line-height": {
68
- "xs": "var(--line-h-base)",
69
- "md": "var(--line-h-lg)"
70
- },
71
- "margin-bottom": {
72
- "xs": "0.75rem",
73
- "md": "1.25rem"
74
- },
75
- "font-weight": {
76
- "xs": "700"
77
- },
78
- "letter-spacing": {
79
- "xs": "var(--letter-spacing-normal)"
80
- }
81
- },
82
- "heading-xs": {
83
- "font-size": {
84
- "xs": "var(--text-sm)",
85
- "md": "var(--text-base)"
86
- },
87
- "line-height": {
88
- "xs": "var(--line-h-sm)",
89
- "md": "var(--line-h-base)"
90
- },
91
- "margin-bottom": {
92
- "xs": "0.5rem",
93
- "md": "1rem"
94
- },
95
- "font-weight": {
96
- "xs": "700"
97
- },
98
- "letter-spacing": {
99
- "xs": "var(--letter-spacing-normal)"
100
- }
101
- },
102
- "caption-xl": {
103
- "font-size": {
104
- "xs": "var(--text-xl)",
105
- "md": "var(--text-2xl)"
106
- },
107
- "line-height": {
108
- "xs": "var(--line-h-xl)",
109
- "md": "var(--line-h-2xl)"
110
- },
111
- "margin-bottom": {
112
- "xs": "0.25rem",
113
- "md": "0.5rem"
114
- },
115
- "color": {
116
- "xs": "var(--color-base-800)"
117
- },
118
- "font-weight": {
119
- "xs": "400"
120
- },
121
- "letter-spacing": {
122
- "xs": "var(--letter-spacing-normal)"
123
- }
124
- },
125
- "caption-lg": {
126
- "font-size": {
127
- "xs": "var(--text-lg)",
128
- "md": "var(--text-xl)"
129
- },
130
- "line-height": {
131
- "xs": "var(--line-h-lg)",
132
- "md": "var(--line-h-xl)"
133
- },
134
- "margin-bottom": {
135
- "xs": "0rem"
136
- },
137
- "color": {
138
- "xs": "var(--color-base-800)"
139
- },
140
- "font-weight": {
141
- "xs": "400"
142
- },
143
- "letter-spacing": {
144
- "xs": "var(--letter-spacing-normal)"
145
- }
146
- },
147
- "caption-md": {
148
- "font-size": {
149
- "xs": "var(--text-base)",
150
- "md": "var(--text-lg)"
151
- },
152
- "line-height": {
153
- "xs": "var(--line-h-base)",
154
- "md": "var(--line-h-lg)"
155
- },
156
- "margin-bottom": {
157
- "xs": "0rem"
158
- },
159
- "color": {
160
- "xs": "var(--color-base-800)"
161
- },
162
- "font-weight": {
163
- "xs": "400"
164
- },
165
- "letter-spacing": {
166
- "xs": "var(--letter-spacing-normal)"
167
- }
168
- },
169
- "body": {
170
- "font-size": {
171
- "xs": "var(--text-base)",
172
- "md": "var(--text-lg)"
173
- },
174
- "line-height": {
175
- "xs": "var(--line-h-base)",
176
- "md": "var(--line-h-lg)"
177
- },
178
- "margin-bottom": {
179
- "xs": "1rem",
180
- "md": "2rem"
181
- },
182
- "color": {
183
- "xs": "var(--color-base-content)"
184
- },
185
- "letter-spacing": {
186
- "xs": "var(--letter-spacing-normal)"
187
- }
188
- },
189
- "body-lg": {
190
- "font-size": {
191
- "xs": "var(--text-lg)",
192
- "lg": "var(--text-2xl)"
193
- },
194
- "line-height": {
195
- "xs": "var(--line-h-lg)",
196
- "lg": "var(--line-h-2xl)"
197
- }
198
- },
199
- "body-sm": {
200
- "font-size": {
201
- "xs": "var(--text-sm)",
202
- "lg": "var(--text-base)"
203
- },
204
- "line-height": {
205
- "xs": "var(--line-h-sm)",
206
- "lg": "var(--text-base)"
207
- }
208
- },
209
- "hint": {
210
- "font-size": {
211
- "xs": "var(--text-base)",
212
- "md": "var(--text-lg)"
213
- },
214
- "line-height": {
215
- "xs": "var(--line-h-base)",
216
- "md": "var(--line-h-lg)"
217
- },
218
- "margin-bottom": {
219
- "xs": "1rem"
220
- },
221
- "color": {
222
- "xs": "var(--color-base-800)"
223
- },
224
- "letter-spacing": {
225
- "xs": "var(--letter-spacing-normal)"
226
- }
227
- },
228
- "hint-lg": {
229
- "font-size": {
230
- "xs": "var(--text-lg)",
231
- "lg": "var(--text-2xl)"
232
- },
233
- "line-height": {
234
- "xs": "var(--line-h-lg)",
235
- "lg": "var(--line-h-2xl)"
236
- }
237
- },
238
- "hint-sm": {
239
- "font-size": {
240
- "xs": "var(--text-sm)",
241
- "lg": "var(--text-base)"
242
- },
243
- "line-height": {
244
- "xs": "var(--line-h-sm)",
245
- "lg": "var(--text-base)"
246
- }
247
- },
248
- "link": {
249
- "color": {
250
- "xs": "var(--color-link)"
251
- },
252
- "color-active": {
253
- "xs": "var(--color-link-active)"
254
- },
255
- "color-hover": {
256
- "xs": "var(--color-link-hover)"
257
- },
258
- "padding": {
259
- "xs": "0px"
260
- },
261
- "font-size": {
262
- "xs": "var(--text-base)",
263
- "md": "var(--text-lg)"
264
- },
265
- "line-height": {
266
- "xs": "var(--line-h-base)",
267
- "md": "var(--line-h-lg)"
268
- },
269
- "letter-spacing": {
270
- "xs": "var(--letter-spacing-normal)"
271
- }
272
- },
273
- "back-link": {
274
- "font-size": {
275
- "xs": "var(--text-base)",
276
- "md": "var(--text-lg)"
277
- },
278
- "letter-spacing": {
279
- "xs": "var(--letter-spacing-normal)"
280
- }
281
- },
282
- "list": {
283
- "font-size": {
284
- "xs": "var(--text-base)",
285
- "md": "var(--text-lg)"
286
- },
287
- "line-height": {
288
- "xs": "var(--line-h-base)",
289
- "md": "var(--line-h-lg)"
290
- },
291
- "letter-spacing": {
292
- "xs": "var(--letter-spacing-normal)"
293
- }
294
- }
295
- }