@medyll/idae-slotui-svelte 0.63.0 → 0.64.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.
Files changed (62) hide show
  1. package/dist/base/cartouche/Cartouche.svelte +13 -9
  2. package/dist/base/cartouche/cartouche.scss +23 -23
  3. package/dist/base/titleBar/TitleBar.svelte +3 -1
  4. package/dist/base/titleBar/title-bar.scss +3 -1
  5. package/dist/controls/button/Button.svelte +466 -516
  6. package/dist/controls/button/ButtonAction.svelte +462 -512
  7. package/dist/controls/button/button.scss +20 -38
  8. package/dist/controls/checkbox/Checkbox.svelte +16 -14
  9. package/dist/controls/checkbox/checkbox.scss +14 -11
  10. package/dist/controls/slider/Slider.svelte +9 -9
  11. package/dist/controls/slider/slider.scss +9 -7
  12. package/dist/controls/textfield/TextField.svelte +2 -2
  13. package/dist/csss/csss.scss +3 -1
  14. package/dist/data/dataList/DataList.svelte +2 -2
  15. package/dist/data/dataList/datalist.scss +1 -1
  16. package/dist/data/finder/Finder.svelte +2 -2
  17. package/dist/index.d.ts +3 -4
  18. package/dist/index.js +3 -4
  19. package/dist/navigation/drawer/Drawer.svelte +10 -8
  20. package/dist/navigation/drawer/drawer.scss +17 -13
  21. package/dist/slotui-css/button.css +462 -512
  22. package/dist/slotui-css/button.min.css +462 -512
  23. package/dist/slotui-css/cartouche.css +13 -9
  24. package/dist/slotui-css/cartouche.min.css +13 -9
  25. package/dist/slotui-css/checkbox.css +16 -14
  26. package/dist/slotui-css/checkbox.min.css +16 -14
  27. package/dist/slotui-css/csss.css +5 -5
  28. package/dist/slotui-css/csss.min.css +5 -5
  29. package/dist/slotui-css/datalist.css +2 -2
  30. package/dist/slotui-css/datalist.min.css +2 -2
  31. package/dist/slotui-css/drawer.css +10 -8
  32. package/dist/slotui-css/drawer.min.css +10 -8
  33. package/dist/slotui-css/finder.css +2 -2
  34. package/dist/slotui-css/finder.min.css +2 -2
  35. package/dist/slotui-css/marquee.css +6 -6
  36. package/dist/slotui-css/marquee.min.css +6 -6
  37. package/dist/slotui-css/menu-list.css +16 -17
  38. package/dist/slotui-css/menu-list.min.css +16 -17
  39. package/dist/slotui-css/menu.css +4 -5
  40. package/dist/slotui-css/menu.min.css +4 -5
  41. package/dist/slotui-css/slider.css +9 -9
  42. package/dist/slotui-css/slider.min.css +9 -9
  43. package/dist/slotui-css/slotui-css.css +554 -597
  44. package/dist/slotui-css/slotui-min-css.css +554 -597
  45. package/dist/slotui-css/textfield.css +2 -2
  46. package/dist/slotui-css/textfield.min.css +2 -2
  47. package/dist/slotui-css/title-bar.css +3 -1
  48. package/dist/slotui-css/title-bar.min.css +3 -1
  49. package/dist/slotui-css/tree.css +4 -5
  50. package/dist/slotui-css/tree.min.css +4 -5
  51. package/dist/styles/slotui-mixins.scss +21 -22
  52. package/dist/ui/marquee/Marquee.svelte +6 -6
  53. package/dist/ui/menu/MenuTitle.svelte +4 -5
  54. package/dist/ui/menu/menu.scss +1 -0
  55. package/dist/ui/menuList/MenuList.svelte +16 -17
  56. package/dist/ui/menuList/MenuListItem.svelte +17 -19
  57. package/dist/ui/menuList/MenuListTitle.svelte +16 -17
  58. package/dist/ui/menuList/menu-list.scss +2 -2
  59. package/dist/ui/tree/Tree.svelte +5 -6
  60. package/dist/utils/content/Content.svelte +8 -8
  61. package/package.json +3 -3
  62. package/dist/slotui-css/slotui-combined.css +0 -5075
package/dist/slotui-css/button.css CHANGED
@@ -24,256 +24,218 @@
24
24
  background-color: rgba(255, 255, 255, 0.5);
25
25
  }
26
26
 
27
- :global(button),
28
- :global(.button),
29
- :global(input[type="button"]),
30
- :global(input[type="submit"]) {
31
- /* :focus {
32
- outline: 1px solid var(--sld-button-focus-border-color);
33
- outline-offset: 2px;
34
- box-shadow: var(--sld-button-focus-shadow);
35
- }
36
- :focus-visible {
37
- outline: 1px solid var(--sld-button-focus-border-color);
38
- outline-offset: -2px;
39
- box-shadow: var(--sld-button-focus-shadow);
40
- }
41
- :hover {
42
- background-color: var(--sld-button-hover-background);
43
- box-shadow: var(--sld-button-hover-shadow);
44
- }
45
- :active {
46
- transform: translateY(1px);
47
- box-shadow: var(--sld-button-active-shadow);
48
- }
49
- :focus:not(:focus-visible) {
50
- box-shadow: var(--sld-button-focus-shadow);
51
- } */
52
- }
53
- :global(button),
54
- :global(.button),
55
- :global(input[type="button"]),
56
- :global(input[type="submit"]) {
57
- --preset-width: var(--sld-width-small);
58
- }
59
- :global(button),
60
- :global(.button),
61
- :global(input[type="button"]),
62
- :global(input[type="submit"]) {
27
+ .slotui-button,
28
+ button.slotui-button,
29
+ input[type=button].slotui-button,
30
+ input[type=submit].slotui-button {
63
31
  width: var(--sld-width-small);
64
32
  }
65
- :global(button)[width=tiny], :global(button).width-tiny,
66
- :global(.button)[width=tiny],
67
- :global(.button).width-tiny,
68
- :global(input[type="button"])[width=tiny],
69
- :global(input[type="button"]).width-tiny,
70
- :global(input[type="submit"])[width=tiny],
71
- :global(input[type="submit"]).width-tiny {
33
+ .slotui-button,
34
+ button.slotui-button,
35
+ input[type=button].slotui-button,
36
+ input[type=submit].slotui-button {
37
+ --preset-width: var(--sld-width-small);
38
+ }
39
+ .slotui-button[width=tiny], .slotui-button.width-tiny,
40
+ button.slotui-button[width=tiny],
41
+ button.slotui-button.width-tiny,
42
+ input[type=button].slotui-button[width=tiny],
43
+ input[type=button].slotui-button.width-tiny,
44
+ input[type=submit].slotui-button[width=tiny],
45
+ input[type=submit].slotui-button.width-tiny {
72
46
  --preset-width: var(--sld-width-tiny);
73
47
  width: var(--sld-width-tiny) !important;
74
48
  }
75
- :global(button)[width=mini], :global(button).width-mini,
76
- :global(.button)[width=mini],
77
- :global(.button).width-mini,
78
- :global(input[type="button"])[width=mini],
79
- :global(input[type="button"]).width-mini,
80
- :global(input[type="submit"])[width=mini],
81
- :global(input[type="submit"]).width-mini {
49
+ .slotui-button[width=mini], .slotui-button.width-mini,
50
+ button.slotui-button[width=mini],
51
+ button.slotui-button.width-mini,
52
+ input[type=button].slotui-button[width=mini],
53
+ input[type=button].slotui-button.width-mini,
54
+ input[type=submit].slotui-button[width=mini],
55
+ input[type=submit].slotui-button.width-mini {
82
56
  --preset-width: var(--sld-width-mini);
83
57
  width: var(--sld-width-mini) !important;
84
58
  }
85
- :global(button)[width=small], :global(button).width-small,
86
- :global(.button)[width=small],
87
- :global(.button).width-small,
88
- :global(input[type="button"])[width=small],
89
- :global(input[type="button"]).width-small,
90
- :global(input[type="submit"])[width=small],
91
- :global(input[type="submit"]).width-small {
59
+ .slotui-button[width=small], .slotui-button.width-small,
60
+ button.slotui-button[width=small],
61
+ button.slotui-button.width-small,
62
+ input[type=button].slotui-button[width=small],
63
+ input[type=button].slotui-button.width-small,
64
+ input[type=submit].slotui-button[width=small],
65
+ input[type=submit].slotui-button.width-small {
92
66
  --preset-width: var(--sld-width-small);
93
67
  width: var(--sld-width-small) !important;
94
68
  }
95
- :global(button)[width=med], :global(button).width-med,
96
- :global(.button)[width=med],
97
- :global(.button).width-med,
98
- :global(input[type="button"])[width=med],
99
- :global(input[type="button"]).width-med,
100
- :global(input[type="submit"])[width=med],
101
- :global(input[type="submit"]).width-med {
69
+ .slotui-button[width=med], .slotui-button.width-med,
70
+ button.slotui-button[width=med],
71
+ button.slotui-button.width-med,
72
+ input[type=button].slotui-button[width=med],
73
+ input[type=button].slotui-button.width-med,
74
+ input[type=submit].slotui-button[width=med],
75
+ input[type=submit].slotui-button.width-med {
102
76
  --preset-width: var(--sld-width-med);
103
77
  width: var(--sld-width-med) !important;
104
78
  }
105
- :global(button)[width=kind], :global(button).width-kind,
106
- :global(.button)[width=kind],
107
- :global(.button).width-kind,
108
- :global(input[type="button"])[width=kind],
109
- :global(input[type="button"]).width-kind,
110
- :global(input[type="submit"])[width=kind],
111
- :global(input[type="submit"]).width-kind {
79
+ .slotui-button[width=kind], .slotui-button.width-kind,
80
+ button.slotui-button[width=kind],
81
+ button.slotui-button.width-kind,
82
+ input[type=button].slotui-button[width=kind],
83
+ input[type=button].slotui-button.width-kind,
84
+ input[type=submit].slotui-button[width=kind],
85
+ input[type=submit].slotui-button.width-kind {
112
86
  --preset-width: var(--sld-width-kind);
113
87
  width: var(--sld-width-kind) !important;
114
88
  }
115
- :global(button)[width=full], :global(button).width-full,
116
- :global(.button)[width=full],
117
- :global(.button).width-full,
118
- :global(input[type="button"])[width=full],
119
- :global(input[type="button"]).width-full,
120
- :global(input[type="submit"])[width=full],
121
- :global(input[type="submit"]).width-full {
89
+ .slotui-button[width=full], .slotui-button.width-full,
90
+ button.slotui-button[width=full],
91
+ button.slotui-button.width-full,
92
+ input[type=button].slotui-button[width=full],
93
+ input[type=button].slotui-button.width-full,
94
+ input[type=submit].slotui-button[width=full],
95
+ input[type=submit].slotui-button.width-full {
122
96
  --preset-width: var(--sld-width-full);
123
97
  width: var(--sld-width-full) !important;
124
98
  }
125
- :global(button)[width=auto], :global(button).width-auto,
126
- :global(.button)[width=auto],
127
- :global(.button).width-auto,
128
- :global(input[type="button"])[width=auto],
129
- :global(input[type="button"]).width-auto,
130
- :global(input[type="submit"])[width=auto],
131
- :global(input[type="submit"]).width-auto {
99
+ .slotui-button[width=auto], .slotui-button.width-auto,
100
+ button.slotui-button[width=auto],
101
+ button.slotui-button.width-auto,
102
+ input[type=button].slotui-button[width=auto],
103
+ input[type=button].slotui-button.width-auto,
104
+ input[type=submit].slotui-button[width=auto],
105
+ input[type=submit].slotui-button.width-auto {
132
106
  --preset-width: var(--sld-width-auto);
133
107
  width: var(--sld-width-auto) !important;
134
108
  }
135
- :global(button)[width=default], :global(button).width-default,
136
- :global(.button)[width=default],
137
- :global(.button).width-default,
138
- :global(input[type="button"])[width=default],
139
- :global(input[type="button"]).width-default,
140
- :global(input[type="submit"])[width=default],
141
- :global(input[type="submit"]).width-default {
109
+ .slotui-button[width=default], .slotui-button.width-default,
110
+ button.slotui-button[width=default],
111
+ button.slotui-button.width-default,
112
+ input[type=button].slotui-button[width=default],
113
+ input[type=button].slotui-button.width-default,
114
+ input[type=submit].slotui-button[width=default],
115
+ input[type=submit].slotui-button.width-default {
142
116
  --preset-width: var(--sld-width-default);
143
117
  width: var(--sld-width-default) !important;
144
118
  }
145
- :global(button),
146
- :global(.button),
147
- :global(input[type="button"]),
148
- :global(input[type="submit"]) {
119
+ .slotui-button,
120
+ button.slotui-button,
121
+ input[type=button].slotui-button,
122
+ input[type=submit].slotui-button {
149
123
  min-height: var(--preset-tall-small);
150
124
  height: var(--preset-tall-small);
151
125
  }
152
- :global(button),
153
- :global(.button),
154
- :global(input[type="button"]),
155
- :global(input[type="submit"]) {
126
+ .slotui-button,
127
+ button.slotui-button,
128
+ input[type=button].slotui-button,
129
+ input[type=submit].slotui-button {
156
130
  --preset-tall: var(--sld-tall-small);
157
131
  }
158
- :global(button)[tall=tiny], :global(button).tall-tiny,
159
- :global(.button)[tall=tiny],
160
- :global(.button).tall-tiny,
161
- :global(input[type="button"])[tall=tiny],
162
- :global(input[type="button"]).tall-tiny,
163
- :global(input[type="submit"])[tall=tiny],
164
- :global(input[type="submit"]).tall-tiny {
132
+ .slotui-button[tall=tiny], .slotui-button.tall-tiny,
133
+ button.slotui-button[tall=tiny],
134
+ button.slotui-button.tall-tiny,
135
+ input[type=button].slotui-button[tall=tiny],
136
+ input[type=button].slotui-button.tall-tiny,
137
+ input[type=submit].slotui-button[tall=tiny],
138
+ input[type=submit].slotui-button.tall-tiny {
165
139
  min-height: var(--sld-tall-tiny) !important;
166
140
  }
167
- :global(button)[tall=mini], :global(button).tall-mini,
168
- :global(.button)[tall=mini],
169
- :global(.button).tall-mini,
170
- :global(input[type="button"])[tall=mini],
171
- :global(input[type="button"]).tall-mini,
172
- :global(input[type="submit"])[tall=mini],
173
- :global(input[type="submit"]).tall-mini {
141
+ .slotui-button[tall=mini], .slotui-button.tall-mini,
142
+ button.slotui-button[tall=mini],
143
+ button.slotui-button.tall-mini,
144
+ input[type=button].slotui-button[tall=mini],
145
+ input[type=button].slotui-button.tall-mini,
146
+ input[type=submit].slotui-button[tall=mini],
147
+ input[type=submit].slotui-button.tall-mini {
174
148
  min-height: var(--sld-tall-mini) !important;
175
149
  }
176
- :global(button)[tall=small], :global(button).tall-small,
177
- :global(.button)[tall=small],
178
- :global(.button).tall-small,
179
- :global(input[type="button"])[tall=small],
180
- :global(input[type="button"]).tall-small,
181
- :global(input[type="submit"])[tall=small],
182
- :global(input[type="submit"]).tall-small {
150
+ .slotui-button[tall=small], .slotui-button.tall-small,
151
+ button.slotui-button[tall=small],
152
+ button.slotui-button.tall-small,
153
+ input[type=button].slotui-button[tall=small],
154
+ input[type=button].slotui-button.tall-small,
155
+ input[type=submit].slotui-button[tall=small],
156
+ input[type=submit].slotui-button.tall-small {
183
157
  min-height: var(--sld-tall-small) !important;
184
158
  }
185
- :global(button)[tall=med], :global(button).tall-med,
186
- :global(.button)[tall=med],
187
- :global(.button).tall-med,
188
- :global(input[type="button"])[tall=med],
189
- :global(input[type="button"]).tall-med,
190
- :global(input[type="submit"])[tall=med],
191
- :global(input[type="submit"]).tall-med {
159
+ .slotui-button[tall=med], .slotui-button.tall-med,
160
+ button.slotui-button[tall=med],
161
+ button.slotui-button.tall-med,
162
+ input[type=button].slotui-button[tall=med],
163
+ input[type=button].slotui-button.tall-med,
164
+ input[type=submit].slotui-button[tall=med],
165
+ input[type=submit].slotui-button.tall-med {
192
166
  min-height: var(--sld-tall-med) !important;
193
167
  }
194
- :global(button)[tall=kind], :global(button).tall-kind,
195
- :global(.button)[tall=kind],
196
- :global(.button).tall-kind,
197
- :global(input[type="button"])[tall=kind],
198
- :global(input[type="button"]).tall-kind,
199
- :global(input[type="submit"])[tall=kind],
200
- :global(input[type="submit"]).tall-kind {
168
+ .slotui-button[tall=kind], .slotui-button.tall-kind,
169
+ button.slotui-button[tall=kind],
170
+ button.slotui-button.tall-kind,
171
+ input[type=button].slotui-button[tall=kind],
172
+ input[type=button].slotui-button.tall-kind,
173
+ input[type=submit].slotui-button[tall=kind],
174
+ input[type=submit].slotui-button.tall-kind {
201
175
  min-height: var(--sld-tall-kind) !important;
202
176
  }
203
- :global(button)[tall=auto], :global(button).tall-auto,
204
- :global(.button)[tall=auto],
205
- :global(.button).tall-auto,
206
- :global(input[type="button"])[tall=auto],
207
- :global(input[type="button"]).tall-auto,
208
- :global(input[type="submit"])[tall=auto],
209
- :global(input[type="submit"]).tall-auto {
177
+ .slotui-button[tall=auto], .slotui-button.tall-auto,
178
+ button.slotui-button[tall=auto],
179
+ button.slotui-button.tall-auto,
180
+ input[type=button].slotui-button[tall=auto],
181
+ input[type=button].slotui-button.tall-auto,
182
+ input[type=submit].slotui-button[tall=auto],
183
+ input[type=submit].slotui-button.tall-auto {
210
184
  min-height: var(--sld-tall-auto) !important;
211
185
  }
212
- :global(button)[tall=default], :global(button).tall-default,
213
- :global(.button)[tall=default],
214
- :global(.button).tall-default,
215
- :global(input[type="button"])[tall=default],
216
- :global(input[type="button"]).tall-default,
217
- :global(input[type="submit"])[tall=default],
218
- :global(input[type="submit"]).tall-default {
186
+ .slotui-button[tall=default], .slotui-button.tall-default,
187
+ button.slotui-button[tall=default],
188
+ button.slotui-button.tall-default,
189
+ input[type=button].slotui-button[tall=default],
190
+ input[type=button].slotui-button.tall-default,
191
+ input[type=submit].slotui-button[tall=default],
192
+ input[type=submit].slotui-button.tall-default {
219
193
  min-height: var(--sld-tall-default) !important;
220
194
  }
221
- :global(button)[variant*=square], :global(button)[square=true], :global(button).square,
222
- :global(.button)[variant*=square],
223
- :global(.button)[square=true],
224
- :global(.button).square,
225
- :global(input[type="button"])[variant*=square],
226
- :global(input[type="button"])[square=true],
227
- :global(input[type="button"]).square,
228
- :global(input[type="submit"])[variant*=square],
229
- :global(input[type="submit"])[square=true],
230
- :global(input[type="submit"]).square {
195
+ .slotui-button[variant*=square],
196
+ button.slotui-button[variant*=square],
197
+ input[type=button].slotui-button[variant*=square],
198
+ input[type=submit].slotui-button[variant*=square] {
231
199
  aspect-ratio: 1/1 !important;
232
200
  height: auto;
233
201
  }
234
- :global(button)[variant*=rounded], :global(button)[rounded=true], :global(button).rounded,
235
- :global(.button)[variant*=rounded],
236
- :global(.button)[rounded=true],
237
- :global(.button).rounded,
238
- :global(input[type="button"])[variant*=rounded],
239
- :global(input[type="button"])[rounded=true],
240
- :global(input[type="button"]).rounded,
241
- :global(input[type="submit"])[variant*=rounded],
242
- :global(input[type="submit"])[rounded=true],
243
- :global(input[type="submit"]).rounded {
202
+ .slotui-button[variant*=rounded],
203
+ button.slotui-button[variant*=rounded],
204
+ input[type=button].slotui-button[variant*=rounded],
205
+ input[type=submit].slotui-button[variant*=rounded] {
244
206
  border-radius: 50%;
245
207
  }
246
- :global(button).elevation-0, :global(button)[elevation-0],
247
- :global(.button).elevation-0,
248
- :global(.button)[elevation-0],
249
- :global(input[type="button"]).elevation-0,
250
- :global(input[type="button"])[elevation-0],
251
- :global(input[type="submit"]).elevation-0,
252
- :global(input[type="submit"])[elevation-0] {
208
+ .slotui-button.elevation-0, .slotui-button[elevation-0],
209
+ button.slotui-button.elevation-0,
210
+ button.slotui-button[elevation-0],
211
+ input[type=button].slotui-button.elevation-0,
212
+ input[type=button].slotui-button[elevation-0],
213
+ input[type=submit].slotui-button.elevation-0,
214
+ input[type=submit].slotui-button[elevation-0] {
253
215
  box-shadow: var(--sld-elevation-0);
254
216
  }
255
- :global(button).elevation-through, :global(button)[elevation-through],
256
- :global(.button).elevation-through,
257
- :global(.button)[elevation-through],
258
- :global(input[type="button"]).elevation-through,
259
- :global(input[type="button"])[elevation-through],
260
- :global(input[type="submit"]).elevation-through,
261
- :global(input[type="submit"])[elevation-through] {
217
+ .slotui-button.elevation-through, .slotui-button[elevation-through],
218
+ button.slotui-button.elevation-through,
219
+ button.slotui-button[elevation-through],
220
+ input[type=button].slotui-button.elevation-through,
221
+ input[type=button].slotui-button[elevation-through],
222
+ input[type=submit].slotui-button.elevation-through,
223
+ input[type=submit].slotui-button[elevation-through] {
262
224
  box-shadow: var(--sld-elevation-through);
263
225
  }
264
- :global(button).elevation-5, :global(button)[elevation-5],
265
- :global(.button).elevation-5,
266
- :global(.button)[elevation-5],
267
- :global(input[type="button"]).elevation-5,
268
- :global(input[type="button"])[elevation-5],
269
- :global(input[type="submit"]).elevation-5,
270
- :global(input[type="submit"])[elevation-5] {
226
+ .slotui-button.elevation-5, .slotui-button[elevation-5],
227
+ button.slotui-button.elevation-5,
228
+ button.slotui-button[elevation-5],
229
+ input[type=button].slotui-button.elevation-5,
230
+ input[type=button].slotui-button[elevation-5],
231
+ input[type=submit].slotui-button.elevation-5,
232
+ input[type=submit].slotui-button[elevation-5] {
271
233
  box-shadow: var(--sld-elevation-5);
272
234
  }
273
- :global(button),
274
- :global(.button),
275
- :global(input[type="button"]),
276
- :global(input[type="submit"]) {
235
+ .slotui-button,
236
+ button.slotui-button,
237
+ input[type=button].slotui-button,
238
+ input[type=submit].slotui-button {
277
239
  border: none;
278
240
  border-radius: 0;
279
241
  margin: 0;
@@ -291,10 +253,10 @@
291
253
  align-items: center;
292
254
  background: var(--sld-button-background);
293
255
  }
294
- :global(button) .button-start,
295
- :global(.button) .button-start,
296
- :global(input[type="button"]) .button-start,
297
- :global(input[type="submit"]) .button-start {
256
+ .slotui-button .start,
257
+ button.slotui-button .start,
258
+ input[type=button].slotui-button .start,
259
+ input[type=submit].slotui-button .start {
298
260
  position: relative;
299
261
  top: 0;
300
262
  left: 0;
@@ -304,33 +266,33 @@
304
266
  padding: 0 0.5rem;
305
267
  display: block;
306
268
  }
307
- :global(button) .button-start:empty,
308
- :global(.button) .button-start:empty,
309
- :global(input[type="button"]) .button-start:empty,
310
- :global(input[type="submit"]) .button-start:empty {
269
+ .slotui-button .start:empty,
270
+ button.slotui-button .start:empty,
271
+ input[type=button].slotui-button .start:empty,
272
+ input[type=submit].slotui-button .start:empty {
311
273
  display: none;
312
274
  }
313
- :global(button) .button-central,
314
- :global(.button) .button-central,
315
- :global(input[type="button"]) .button-central,
316
- :global(input[type="submit"]) .button-central {
275
+ .slotui-button .central,
276
+ button.slotui-button .central,
277
+ input[type=button].slotui-button .central,
278
+ input[type=submit].slotui-button .central {
317
279
  --preset-ellipsis-line: 1;
318
280
  }
319
- :global(button) .button-central[ellipsis], :global(button) .button-central.ellipsis,
320
- :global(.button) .button-central[ellipsis],
321
- :global(.button) .button-central.ellipsis,
322
- :global(input[type="button"]) .button-central[ellipsis],
323
- :global(input[type="button"]) .button-central.ellipsis,
324
- :global(input[type="submit"]) .button-central[ellipsis],
325
- :global(input[type="submit"]) .button-central.ellipsis {
281
+ .slotui-button .central[ellipsis], .slotui-button .central.ellipsis,
282
+ button.slotui-button .central[ellipsis],
283
+ button.slotui-button .central.ellipsis,
284
+ input[type=button].slotui-button .central[ellipsis],
285
+ input[type=button].slotui-button .central.ellipsis,
286
+ input[type=submit].slotui-button .central[ellipsis],
287
+ input[type=submit].slotui-button .central.ellipsis {
326
288
  white-space: nowrap;
327
289
  overflow: hidden;
328
290
  text-overflow: ellipsis;
329
291
  }
330
- :global(button) .button-central.ellipsis-line-1,
331
- :global(.button) .button-central.ellipsis-line-1,
332
- :global(input[type="button"]) .button-central.ellipsis-line-1,
333
- :global(input[type="submit"]) .button-central.ellipsis-line-1 {
292
+ .slotui-button .central.ellipsis-line-1,
293
+ button.slotui-button .central.ellipsis-line-1,
294
+ input[type=button].slotui-button .central.ellipsis-line-1,
295
+ input[type=submit].slotui-button .central.ellipsis-line-1 {
334
296
  display: -webkit-box;
335
297
  -webkit-line-clamp: 1;
336
298
  -webkit-box-orient: vertical;
@@ -339,10 +301,10 @@
339
301
  white-space: normal;
340
302
  --preset-ellipsis-line: 1;
341
303
  }
342
- :global(button) .button-central.ellipsis-line-2,
343
- :global(.button) .button-central.ellipsis-line-2,
344
- :global(input[type="button"]) .button-central.ellipsis-line-2,
345
- :global(input[type="submit"]) .button-central.ellipsis-line-2 {
304
+ .slotui-button .central.ellipsis-line-2,
305
+ button.slotui-button .central.ellipsis-line-2,
306
+ input[type=button].slotui-button .central.ellipsis-line-2,
307
+ input[type=submit].slotui-button .central.ellipsis-line-2 {
346
308
  display: -webkit-box;
347
309
  -webkit-line-clamp: 2;
348
310
  -webkit-box-orient: vertical;
@@ -351,10 +313,10 @@
351
313
  white-space: normal;
352
314
  --preset-ellipsis-line: 2;
353
315
  }
354
- :global(button) .button-central.ellipsis-line-3,
355
- :global(.button) .button-central.ellipsis-line-3,
356
- :global(input[type="button"]) .button-central.ellipsis-line-3,
357
- :global(input[type="submit"]) .button-central.ellipsis-line-3 {
316
+ .slotui-button .central.ellipsis-line-3,
317
+ button.slotui-button .central.ellipsis-line-3,
318
+ input[type=button].slotui-button .central.ellipsis-line-3,
319
+ input[type=submit].slotui-button .central.ellipsis-line-3 {
358
320
  display: -webkit-box;
359
321
  -webkit-line-clamp: 3;
360
322
  -webkit-box-orient: vertical;
@@ -363,10 +325,10 @@
363
325
  white-space: normal;
364
326
  --preset-ellipsis-line: 3;
365
327
  }
366
- :global(button) .button-central.ellipsis-line-4,
367
- :global(.button) .button-central.ellipsis-line-4,
368
- :global(input[type="button"]) .button-central.ellipsis-line-4,
369
- :global(input[type="submit"]) .button-central.ellipsis-line-4 {
328
+ .slotui-button .central.ellipsis-line-4,
329
+ button.slotui-button .central.ellipsis-line-4,
330
+ input[type=button].slotui-button .central.ellipsis-line-4,
331
+ input[type=submit].slotui-button .central.ellipsis-line-4 {
370
332
  display: -webkit-box;
371
333
  -webkit-line-clamp: 4;
372
334
  -webkit-box-orient: vertical;
@@ -375,10 +337,10 @@
375
337
  white-space: normal;
376
338
  --preset-ellipsis-line: 4;
377
339
  }
378
- :global(button) .button-central.ellipsis-line-5,
379
- :global(.button) .button-central.ellipsis-line-5,
380
- :global(input[type="button"]) .button-central.ellipsis-line-5,
381
- :global(input[type="submit"]) .button-central.ellipsis-line-5 {
340
+ .slotui-button .central.ellipsis-line-5,
341
+ button.slotui-button .central.ellipsis-line-5,
342
+ input[type=button].slotui-button .central.ellipsis-line-5,
343
+ input[type=submit].slotui-button .central.ellipsis-line-5 {
382
344
  display: -webkit-box;
383
345
  -webkit-line-clamp: 5;
384
346
  -webkit-box-orient: vertical;
@@ -387,10 +349,10 @@
387
349
  white-space: normal;
388
350
  --preset-ellipsis-line: 5;
389
351
  }
390
- :global(button) .button-central,
391
- :global(.button) .button-central,
392
- :global(input[type="button"]) .button-central,
393
- :global(input[type="submit"]) .button-central {
352
+ .slotui-button .central,
353
+ button.slotui-button .central,
354
+ input[type=button].slotui-button .central,
355
+ input[type=submit].slotui-button .central {
394
356
  display: block;
395
357
  max-width: 100%;
396
358
  max-height: 100%;
@@ -404,16 +366,16 @@
404
366
  text-align: var(--sld-button-text-align, center);
405
367
  overflow: hidden;
406
368
  }
407
- :global(button) .button-central:empty,
408
- :global(.button) .button-central:empty,
409
- :global(input[type="button"]) .button-central:empty,
410
- :global(input[type="submit"]) .button-central:empty {
369
+ .slotui-button .central:empty,
370
+ button.slotui-button .central:empty,
371
+ input[type=button].slotui-button .central:empty,
372
+ input[type=submit].slotui-button .central:empty {
411
373
  display: none;
412
374
  }
413
- :global(button) .button-end,
414
- :global(.button) .button-end,
415
- :global(input[type="button"]) .button-end,
416
- :global(input[type="submit"]) .button-end {
375
+ .slotui-button .end,
376
+ button.slotui-button .end,
377
+ input[type=button].slotui-button .end,
378
+ input[type=submit].slotui-button .end {
417
379
  position: relative;
418
380
  align-items: center;
419
381
  align-content: center;
@@ -421,36 +383,36 @@
421
383
  text-align: center;
422
384
  cursor: pointer;
423
385
  }
424
- :global(button) .button-end:empty,
425
- :global(.button) .button-end:empty,
426
- :global(input[type="button"]) .button-end:empty,
427
- :global(input[type="submit"]) .button-end:empty {
386
+ .slotui-button .end:empty,
387
+ button.slotui-button .end:empty,
388
+ input[type=button].slotui-button .end:empty,
389
+ input[type=submit].slotui-button .end:empty {
428
390
  display: none;
429
391
  }
430
- :global(button) .button-end:hover,
431
- :global(.button) .button-end:hover,
432
- :global(input[type="button"]) .button-end:hover,
433
- :global(input[type="submit"]) .button-end:hover {
392
+ .slotui-button .end:hover,
393
+ button.slotui-button .end:hover,
394
+ input[type=button].slotui-button .end:hover,
395
+ input[type=submit].slotui-button .end:hover {
434
396
  background-color: var(--sld-button-action-hover-background);
435
397
  }
436
- :global(button).loading, :global(button)[aria-busy=true],
437
- :global(.button).loading,
438
- :global(.button)[aria-busy=true],
439
- :global(input[type="button"]).loading,
440
- :global(input[type="button"])[aria-busy=true],
441
- :global(input[type="submit"]).loading,
442
- :global(input[type="submit"])[aria-busy=true] {
398
+ .slotui-button.loading, .slotui-button[aria-busy=true],
399
+ button.slotui-button.loading,
400
+ button.slotui-button[aria-busy=true],
401
+ input[type=button].slotui-button.loading,
402
+ input[type=button].slotui-button[aria-busy=true],
403
+ input[type=submit].slotui-button.loading,
404
+ input[type=submit].slotui-button[aria-busy=true] {
443
405
  position: relative;
444
406
  color: transparent;
445
407
  pointer-events: none;
446
408
  }
447
- :global(button).loading::after, :global(button)[aria-busy=true]::after,
448
- :global(.button).loading::after,
449
- :global(.button)[aria-busy=true]::after,
450
- :global(input[type="button"]).loading::after,
451
- :global(input[type="button"])[aria-busy=true]::after,
452
- :global(input[type="submit"]).loading::after,
453
- :global(input[type="submit"])[aria-busy=true]::after {
409
+ .slotui-button.loading::after, .slotui-button[aria-busy=true]::after,
410
+ button.slotui-button.loading::after,
411
+ button.slotui-button[aria-busy=true]::after,
412
+ input[type=button].slotui-button.loading::after,
413
+ input[type=button].slotui-button[aria-busy=true]::after,
414
+ input[type=submit].slotui-button.loading::after,
415
+ input[type=submit].slotui-button[aria-busy=true]::after {
454
416
  content: " ";
455
417
  position: absolute;
456
418
  width: 16px;
@@ -465,16 +427,16 @@
465
427
  border-radius: 50%;
466
428
  animation: button-spinner 0.6s linear infinite;
467
429
  }
468
- :global(button)[disabled], :global(button).disabled, :global(button)[aria-disabled=true],
469
- :global(.button)[disabled],
470
- :global(.button).disabled,
471
- :global(.button)[aria-disabled=true],
472
- :global(input[type="button"])[disabled],
473
- :global(input[type="button"]).disabled,
474
- :global(input[type="button"])[aria-disabled=true],
475
- :global(input[type="submit"])[disabled],
476
- :global(input[type="submit"]).disabled,
477
- :global(input[type="submit"])[aria-disabled=true] {
430
+ .slotui-button[disabled], .slotui-button.disabled, .slotui-button[aria-disabled=true],
431
+ button.slotui-button[disabled],
432
+ button.slotui-button.disabled,
433
+ button.slotui-button[aria-disabled=true],
434
+ input[type=button].slotui-button[disabled],
435
+ input[type=button].slotui-button.disabled,
436
+ input[type=button].slotui-button[aria-disabled=true],
437
+ input[type=submit].slotui-button[disabled],
438
+ input[type=submit].slotui-button.disabled,
439
+ input[type=submit].slotui-button[aria-disabled=true] {
478
440
  color: var(--color-gray-800);
479
441
  border-color: var(--color-gray-400);
480
442
  opacity: 0.6;
@@ -482,21 +444,21 @@
482
444
  box-shadow: none;
483
445
  pointer-events: none;
484
446
  }
485
- :global(button)[aria-pressed=true], :global(button).selected,
486
- :global(.button)[aria-pressed=true],
487
- :global(.button).selected,
488
- :global(input[type="button"])[aria-pressed=true],
489
- :global(input[type="button"]).selected,
490
- :global(input[type="submit"])[aria-pressed=true],
491
- :global(input[type="submit"]).selected {
447
+ .slotui-button[aria-pressed=true], .slotui-button.selected,
448
+ button.slotui-button[aria-pressed=true],
449
+ button.slotui-button.selected,
450
+ input[type=button].slotui-button[aria-pressed=true],
451
+ input[type=button].slotui-button.selected,
452
+ input[type=submit].slotui-button[aria-pressed=true],
453
+ input[type=submit].slotui-button.selected {
492
454
  box-shadow: var(--sld-elevation-3);
493
455
  background-color: var(--sld-color-secondary);
494
456
  font-weight: bold;
495
457
  }
496
- :global(button) .chip,
497
- :global(.button) .chip,
498
- :global(input[type="button"]) .chip,
499
- :global(input[type="submit"]) .chip {
458
+ .slotui-button .chip,
459
+ button.slotui-button .chip,
460
+ input[type=button].slotui-button .chip,
461
+ input[type=submit].slotui-button .chip {
500
462
  position: absolute;
501
463
  z-index: 2;
502
464
  height: 3px;
@@ -507,10 +469,10 @@
507
469
  border-radius: var(--sld-radius-large);
508
470
  bottom: 2px;
509
471
  }
510
- :global(button) .loadingButtonZone,
511
- :global(.button) .loadingButtonZone,
512
- :global(input[type="button"]) .loadingButtonZone,
513
- :global(input[type="submit"]) .loadingButtonZone {
472
+ .slotui-button .loadingButtonZone,
473
+ button.slotui-button .loadingButtonZone,
474
+ input[type=button].slotui-button .loadingButtonZone,
475
+ input[type=submit].slotui-button .loadingButtonZone {
514
476
  z-index: 10;
515
477
  position: absolute;
516
478
  top: 0;
@@ -522,121 +484,118 @@
522
484
  align-content: center;
523
485
  justify-content: space-around;
524
486
  }
525
- :global(button)[variant*=bordered], :global(button)[bordered=true], :global(button).bordered,
526
- :global(.button)[variant*=bordered],
527
- :global(.button)[bordered=true],
528
- :global(.button).bordered,
529
- :global(input[type="button"])[variant*=bordered],
530
- :global(input[type="button"])[bordered=true],
531
- :global(input[type="button"]).bordered,
532
- :global(input[type="submit"])[variant*=bordered],
533
- :global(input[type="submit"])[bordered=true],
534
- :global(input[type="submit"]).bordered {
487
+ .slotui-button[variant*=bordered], .slotui-button[bordered=true], .slotui-button.bordered,
488
+ button.slotui-button[variant*=bordered],
489
+ button.slotui-button[bordered=true],
490
+ button.slotui-button.bordered,
491
+ input[type=button].slotui-button[variant*=bordered],
492
+ input[type=button].slotui-button[bordered=true],
493
+ input[type=button].slotui-button.bordered,
494
+ input[type=submit].slotui-button[variant*=bordered],
495
+ input[type=submit].slotui-button[bordered=true],
496
+ input[type=submit].slotui-button.bordered {
535
497
  color: var(--sld-color-foreground);
536
498
  border: var(--sld-button-border-width) solid var(--sld-button-border-color);
537
499
  box-shadow: var(--sld-elevation-1);
538
500
  background-color: var(--sld-button-background);
539
501
  }
540
- :global(button)[variant*=bordered]:hover, :global(button)[bordered=true]:hover, :global(button).bordered:hover,
541
- :global(.button)[variant*=bordered]:hover,
542
- :global(.button)[bordered=true]:hover,
543
- :global(.button).bordered:hover,
544
- :global(input[type="button"])[variant*=bordered]:hover,
545
- :global(input[type="button"])[bordered=true]:hover,
546
- :global(input[type="button"]).bordered:hover,
547
- :global(input[type="submit"])[variant*=bordered]:hover,
548
- :global(input[type="submit"])[bordered=true]:hover,
549
- :global(input[type="submit"]).bordered:hover {
502
+ .slotui-button[variant*=bordered]:hover, .slotui-button[bordered=true]:hover, .slotui-button.bordered:hover,
503
+ button.slotui-button[variant*=bordered]:hover,
504
+ button.slotui-button[bordered=true]:hover,
505
+ button.slotui-button.bordered:hover,
506
+ input[type=button].slotui-button[variant*=bordered]:hover,
507
+ input[type=button].slotui-button[bordered=true]:hover,
508
+ input[type=button].slotui-button.bordered:hover,
509
+ input[type=submit].slotui-button[variant*=bordered]:hover,
510
+ input[type=submit].slotui-button[bordered=true]:hover,
511
+ input[type=submit].slotui-button.bordered:hover {
550
512
  border-color: var(--sld-color-primary);
551
513
  box-shadow: var(--sld-button-hover-shadow);
552
514
  }
553
- :global(button)[variant*=bordered]:focus, :global(button)[variant*=bordered]:active, :global(button)[bordered=true]:focus, :global(button)[bordered=true]:active, :global(button).bordered:focus, :global(button).bordered:active,
554
- :global(.button)[variant*=bordered]:focus,
555
- :global(.button)[variant*=bordered]:active,
556
- :global(.button)[bordered=true]:focus,
557
- :global(.button)[bordered=true]:active,
558
- :global(.button).bordered:focus,
559
- :global(.button).bordered:active,
560
- :global(input[type="button"])[variant*=bordered]:focus,
561
- :global(input[type="button"])[variant*=bordered]:active,
562
- :global(input[type="button"])[bordered=true]:focus,
563
- :global(input[type="button"])[bordered=true]:active,
564
- :global(input[type="button"]).bordered:focus,
565
- :global(input[type="button"]).bordered:active,
566
- :global(input[type="submit"])[variant*=bordered]:focus,
567
- :global(input[type="submit"])[variant*=bordered]:active,
568
- :global(input[type="submit"])[bordered=true]:focus,
569
- :global(input[type="submit"])[bordered=true]:active,
570
- :global(input[type="submit"]).bordered:focus,
571
- :global(input[type="submit"]).bordered:active {
515
+ .slotui-button[variant*=bordered]:focus, .slotui-button[variant*=bordered]:active, .slotui-button[bordered=true]:focus, .slotui-button[bordered=true]:active, .slotui-button.bordered:focus, .slotui-button.bordered:active,
516
+ button.slotui-button[variant*=bordered]:focus,
517
+ button.slotui-button[variant*=bordered]:active,
518
+ button.slotui-button[bordered=true]:focus,
519
+ button.slotui-button[bordered=true]:active,
520
+ button.slotui-button.bordered:focus,
521
+ button.slotui-button.bordered:active,
522
+ input[type=button].slotui-button[variant*=bordered]:focus,
523
+ input[type=button].slotui-button[variant*=bordered]:active,
524
+ input[type=button].slotui-button[bordered=true]:focus,
525
+ input[type=button].slotui-button[bordered=true]:active,
526
+ input[type=button].slotui-button.bordered:focus,
527
+ input[type=button].slotui-button.bordered:active,
528
+ input[type=submit].slotui-button[variant*=bordered]:focus,
529
+ input[type=submit].slotui-button[variant*=bordered]:active,
530
+ input[type=submit].slotui-button[bordered=true]:focus,
531
+ input[type=submit].slotui-button[bordered=true]:active,
532
+ input[type=submit].slotui-button.bordered:focus,
533
+ input[type=submit].slotui-button.bordered:active {
572
534
  border-color: var(--sld-button-active-border-color);
573
535
  box-shadow: var(--sld-button-active-shadow);
574
536
  }
575
- :global(button)[variant*=contained], :global(button)[contained=true], :global(button).contained,
576
- :global(.button)[variant*=contained],
577
- :global(.button)[contained=true],
578
- :global(.button).contained,
579
- :global(input[type="button"])[variant*=contained],
580
- :global(input[type="button"])[contained=true],
581
- :global(input[type="button"]).contained,
582
- :global(input[type="submit"])[variant*=contained],
583
- :global(input[type="submit"])[contained=true],
584
- :global(input[type="submit"]).contained {
537
+ .slotui-button[variant*=contained], .slotui-button[contained=true], .slotui-button.contained,
538
+ button.slotui-button[variant*=contained],
539
+ button.slotui-button[contained=true],
540
+ button.slotui-button.contained,
541
+ input[type=button].slotui-button[variant*=contained],
542
+ input[type=button].slotui-button[contained=true],
543
+ input[type=button].slotui-button.contained,
544
+ input[type=submit].slotui-button[variant*=contained],
545
+ input[type=submit].slotui-button[contained=true],
546
+ input[type=submit].slotui-button.contained {
585
547
  border: var(--sld-button-border-width) solid var(--sld-button-border-color);
586
548
  color: var(--sld-color-on-primary);
587
549
  background-color: var(--sld-button-contained-background);
588
550
  background-clip: padding-box;
589
551
  box-shadow: var(--sld-elevation-1);
590
552
  }
591
- :global(button)[variant*=contained]:hover, :global(button)[contained=true]:hover, :global(button).contained:hover,
592
- :global(.button)[variant*=contained]:hover,
593
- :global(.button)[contained=true]:hover,
594
- :global(.button).contained:hover,
595
- :global(input[type="button"])[variant*=contained]:hover,
596
- :global(input[type="button"])[contained=true]:hover,
597
- :global(input[type="button"]).contained:hover,
598
- :global(input[type="submit"])[variant*=contained]:hover,
599
- :global(input[type="submit"])[contained=true]:hover,
600
- :global(input[type="submit"]).contained:hover {
553
+ .slotui-button[variant*=contained]:hover, .slotui-button[contained=true]:hover, .slotui-button.contained:hover,
554
+ button.slotui-button[variant*=contained]:hover,
555
+ button.slotui-button[contained=true]:hover,
556
+ button.slotui-button.contained:hover,
557
+ input[type=button].slotui-button[variant*=contained]:hover,
558
+ input[type=button].slotui-button[contained=true]:hover,
559
+ input[type=button].slotui-button.contained:hover,
560
+ input[type=submit].slotui-button[variant*=contained]:hover,
561
+ input[type=submit].slotui-button[contained=true]:hover,
562
+ input[type=submit].slotui-button.contained:hover {
601
563
  background-color: var(--sld-color-secondary);
602
564
  color: var(--sld-color-on-secondary);
603
565
  }
604
- :global(button)[variant*=contained]:focus, :global(button)[variant*=contained]:active, :global(button)[contained=true]:focus, :global(button)[contained=true]:active, :global(button).contained:focus, :global(button).contained:active,
605
- :global(.button)[variant*=contained]:focus,
606
- :global(.button)[variant*=contained]:active,
607
- :global(.button)[contained=true]:focus,
608
- :global(.button)[contained=true]:active,
609
- :global(.button).contained:focus,
610
- :global(.button).contained:active,
611
- :global(input[type="button"])[variant*=contained]:focus,
612
- :global(input[type="button"])[variant*=contained]:active,
613
- :global(input[type="button"])[contained=true]:focus,
614
- :global(input[type="button"])[contained=true]:active,
615
- :global(input[type="button"]).contained:focus,
616
- :global(input[type="button"]).contained:active,
617
- :global(input[type="submit"])[variant*=contained]:focus,
618
- :global(input[type="submit"])[variant*=contained]:active,
619
- :global(input[type="submit"])[contained=true]:focus,
620
- :global(input[type="submit"])[contained=true]:active,
621
- :global(input[type="submit"]).contained:focus,
622
- :global(input[type="submit"]).contained:active {
566
+ .slotui-button[variant*=contained]:focus, .slotui-button[variant*=contained]:active, .slotui-button[contained=true]:focus, .slotui-button[contained=true]:active, .slotui-button.contained:focus, .slotui-button.contained:active,
567
+ button.slotui-button[variant*=contained]:focus,
568
+ button.slotui-button[variant*=contained]:active,
569
+ button.slotui-button[contained=true]:focus,
570
+ button.slotui-button[contained=true]:active,
571
+ button.slotui-button.contained:focus,
572
+ button.slotui-button.contained:active,
573
+ input[type=button].slotui-button[variant*=contained]:focus,
574
+ input[type=button].slotui-button[variant*=contained]:active,
575
+ input[type=button].slotui-button[contained=true]:focus,
576
+ input[type=button].slotui-button[contained=true]:active,
577
+ input[type=button].slotui-button.contained:focus,
578
+ input[type=button].slotui-button.contained:active,
579
+ input[type=submit].slotui-button[variant*=contained]:focus,
580
+ input[type=submit].slotui-button[variant*=contained]:active,
581
+ input[type=submit].slotui-button[contained=true]:focus,
582
+ input[type=submit].slotui-button[contained=true]:active,
583
+ input[type=submit].slotui-button.contained:focus,
584
+ input[type=submit].slotui-button.contained:active {
623
585
  background-color: var(--sld-color-tertiary);
624
586
  color: var(--sld-color-on-tertiary);
625
587
  box-shadow: var(--sld-button-active-shadow);
626
588
  }
627
- :global(button)[variant*=link], :global(button)[link=true], :global(button).link, :global(button)[role=link],
628
- :global(.button)[variant*=link],
629
- :global(.button)[link=true],
630
- :global(.button).link,
631
- :global(.button)[role=link],
632
- :global(input[type="button"])[variant*=link],
633
- :global(input[type="button"])[link=true],
634
- :global(input[type="button"]).link,
635
- :global(input[type="button"])[role=link],
636
- :global(input[type="submit"])[variant*=link],
637
- :global(input[type="submit"])[link=true],
638
- :global(input[type="submit"]).link,
639
- :global(input[type="submit"])[role=link] {
589
+ .slotui-button[variant*=link], .slotui-button.link, .slotui-button[role=link],
590
+ button.slotui-button[variant*=link],
591
+ button.slotui-button.link,
592
+ button.slotui-button[role=link],
593
+ input[type=button].slotui-button[variant*=link],
594
+ input[type=button].slotui-button.link,
595
+ input[type=button].slotui-button[role=link],
596
+ input[type=submit].slotui-button[variant*=link],
597
+ input[type=submit].slotui-button.link,
598
+ input[type=submit].slotui-button[role=link] {
640
599
  color: var(--sld-color-primary);
641
600
  text-decoration: underline;
642
601
  text-underline-offset: 0.35rem;
@@ -644,160 +603,151 @@
644
603
  cursor: pointer;
645
604
  border: none;
646
605
  }
647
- :global(button)[variant*=link]:hover, :global(button)[link=true]:hover, :global(button).link:hover, :global(button)[role=link]:hover,
648
- :global(.button)[variant*=link]:hover,
649
- :global(.button)[link=true]:hover,
650
- :global(.button).link:hover,
651
- :global(.button)[role=link]:hover,
652
- :global(input[type="button"])[variant*=link]:hover,
653
- :global(input[type="button"])[link=true]:hover,
654
- :global(input[type="button"]).link:hover,
655
- :global(input[type="button"])[role=link]:hover,
656
- :global(input[type="submit"])[variant*=link]:hover,
657
- :global(input[type="submit"])[link=true]:hover,
658
- :global(input[type="submit"]).link:hover,
659
- :global(input[type="submit"])[role=link]:hover {
606
+ .slotui-button[variant*=link]:hover, .slotui-button.link:hover, .slotui-button[role=link]:hover,
607
+ button.slotui-button[variant*=link]:hover,
608
+ button.slotui-button.link:hover,
609
+ button.slotui-button[role=link]:hover,
610
+ input[type=button].slotui-button[variant*=link]:hover,
611
+ input[type=button].slotui-button.link:hover,
612
+ input[type=button].slotui-button[role=link]:hover,
613
+ input[type=submit].slotui-button[variant*=link]:hover,
614
+ input[type=submit].slotui-button.link:hover,
615
+ input[type=submit].slotui-button[role=link]:hover {
660
616
  text-decoration: underline;
661
617
  }
662
- :global(button)[variant*=link]:focus, :global(button)[variant*=link]:active, :global(button)[link=true]:focus, :global(button)[link=true]:active, :global(button).link:focus, :global(button).link:active, :global(button)[role=link]:focus, :global(button)[role=link]:active,
663
- :global(.button)[variant*=link]:focus,
664
- :global(.button)[variant*=link]:active,
665
- :global(.button)[link=true]:focus,
666
- :global(.button)[link=true]:active,
667
- :global(.button).link:focus,
668
- :global(.button).link:active,
669
- :global(.button)[role=link]:focus,
670
- :global(.button)[role=link]:active,
671
- :global(input[type="button"])[variant*=link]:focus,
672
- :global(input[type="button"])[variant*=link]:active,
673
- :global(input[type="button"])[link=true]:focus,
674
- :global(input[type="button"])[link=true]:active,
675
- :global(input[type="button"]).link:focus,
676
- :global(input[type="button"]).link:active,
677
- :global(input[type="button"])[role=link]:focus,
678
- :global(input[type="button"])[role=link]:active,
679
- :global(input[type="submit"])[variant*=link]:focus,
680
- :global(input[type="submit"])[variant*=link]:active,
681
- :global(input[type="submit"])[link=true]:focus,
682
- :global(input[type="submit"])[link=true]:active,
683
- :global(input[type="submit"]).link:focus,
684
- :global(input[type="submit"]).link:active,
685
- :global(input[type="submit"])[role=link]:focus,
686
- :global(input[type="submit"])[role=link]:active {
618
+ .slotui-button[variant*=link]:focus, .slotui-button[variant*=link]:active, .slotui-button.link:focus, .slotui-button.link:active, .slotui-button[role=link]:focus, .slotui-button[role=link]:active,
619
+ button.slotui-button[variant*=link]:focus,
620
+ button.slotui-button[variant*=link]:active,
621
+ button.slotui-button.link:focus,
622
+ button.slotui-button.link:active,
623
+ button.slotui-button[role=link]:focus,
624
+ button.slotui-button[role=link]:active,
625
+ input[type=button].slotui-button[variant*=link]:focus,
626
+ input[type=button].slotui-button[variant*=link]:active,
627
+ input[type=button].slotui-button.link:focus,
628
+ input[type=button].slotui-button.link:active,
629
+ input[type=button].slotui-button[role=link]:focus,
630
+ input[type=button].slotui-button[role=link]:active,
631
+ input[type=submit].slotui-button[variant*=link]:focus,
632
+ input[type=submit].slotui-button[variant*=link]:active,
633
+ input[type=submit].slotui-button.link:focus,
634
+ input[type=submit].slotui-button.link:active,
635
+ input[type=submit].slotui-button[role=link]:focus,
636
+ input[type=submit].slotui-button[role=link]:active {
687
637
  text-decoration: underline;
688
638
  outline: none;
689
639
  box-shadow: none;
690
640
  }
691
- :global(button)[variant*=naked], :global(button)[naked=true], :global(button).naked,
692
- :global(.button)[variant*=naked],
693
- :global(.button)[naked=true],
694
- :global(.button).naked,
695
- :global(input[type="button"])[variant*=naked],
696
- :global(input[type="button"])[naked=true],
697
- :global(input[type="button"]).naked,
698
- :global(input[type="submit"])[variant*=naked],
699
- :global(input[type="submit"])[naked=true],
700
- :global(input[type="submit"]).naked {
641
+ .slotui-button[variant*=naked]:hover, .slotui-button[naked=true]:hover, .slotui-button.naked:hover,
642
+ button.slotui-button[variant*=naked]:hover,
643
+ button.slotui-button[naked=true]:hover,
644
+ button.slotui-button.naked:hover,
645
+ input[type=button].slotui-button[variant*=naked]:hover,
646
+ input[type=button].slotui-button[naked=true]:hover,
647
+ input[type=button].slotui-button.naked:hover,
648
+ input[type=submit].slotui-button[variant*=naked]:hover,
649
+ input[type=submit].slotui-button[naked=true]:hover,
650
+ input[type=submit].slotui-button.naked:hover {
651
+ border-color: var(--sld-hover-border-color);
652
+ background-color: var(--sld-background-disabled);
653
+ }
654
+ .slotui-button[variant*=naked], .slotui-button[naked=true], .slotui-button.naked,
655
+ button.slotui-button[variant*=naked],
656
+ button.slotui-button[naked=true],
657
+ button.slotui-button.naked,
658
+ input[type=button].slotui-button[variant*=naked],
659
+ input[type=button].slotui-button[naked=true],
660
+ input[type=button].slotui-button.naked,
661
+ input[type=submit].slotui-button[variant*=naked],
662
+ input[type=submit].slotui-button[naked=true],
663
+ input[type=submit].slotui-button.naked {
701
664
  color: inherit;
702
665
  background-color: transparent;
703
666
  border: 0px solid transparent;
704
667
  cursor: pointer;
705
668
  }
706
- :global(button)[variant*=naked]:hover, :global(button)[naked=true]:hover, :global(button).naked:hover,
707
- :global(.button)[variant*=naked]:hover,
708
- :global(.button)[naked=true]:hover,
709
- :global(.button).naked:hover,
710
- :global(input[type="button"])[variant*=naked]:hover,
711
- :global(input[type="button"])[naked=true]:hover,
712
- :global(input[type="button"]).naked:hover,
713
- :global(input[type="submit"])[variant*=naked]:hover,
714
- :global(input[type="submit"])[naked=true]:hover,
715
- :global(input[type="submit"]).naked:hover {
716
- border-color: var(--sld-hover-border-color);
717
- background-color: var(--sld-background-disabled);
718
- }
719
- :global(button)[variant*=naked]:hover, :global(button)[naked=true]:hover, :global(button).naked:hover,
720
- :global(.button)[variant*=naked]:hover,
721
- :global(.button)[naked=true]:hover,
722
- :global(.button).naked:hover,
723
- :global(input[type="button"])[variant*=naked]:hover,
724
- :global(input[type="button"])[naked=true]:hover,
725
- :global(input[type="button"]).naked:hover,
726
- :global(input[type="submit"])[variant*=naked]:hover,
727
- :global(input[type="submit"])[naked=true]:hover,
728
- :global(input[type="submit"]).naked:hover {
669
+ .slotui-button[variant*=naked]:hover, .slotui-button[naked=true]:hover, .slotui-button.naked:hover,
670
+ button.slotui-button[variant*=naked]:hover,
671
+ button.slotui-button[naked=true]:hover,
672
+ button.slotui-button.naked:hover,
673
+ input[type=button].slotui-button[variant*=naked]:hover,
674
+ input[type=button].slotui-button[naked=true]:hover,
675
+ input[type=button].slotui-button.naked:hover,
676
+ input[type=submit].slotui-button[variant*=naked]:hover,
677
+ input[type=submit].slotui-button[naked=true]:hover,
678
+ input[type=submit].slotui-button.naked:hover {
729
679
  background-color: var(--sld-button-hover-background);
730
680
  }
731
- :global(button)[variant*=naked]:active, :global(button)[variant*=naked]:focus, :global(button)[naked=true]:active, :global(button)[naked=true]:focus, :global(button).naked:active, :global(button).naked:focus,
732
- :global(.button)[variant*=naked]:active,
733
- :global(.button)[variant*=naked]:focus,
734
- :global(.button)[naked=true]:active,
735
- :global(.button)[naked=true]:focus,
736
- :global(.button).naked:active,
737
- :global(.button).naked:focus,
738
- :global(input[type="button"])[variant*=naked]:active,
739
- :global(input[type="button"])[variant*=naked]:focus,
740
- :global(input[type="button"])[naked=true]:active,
741
- :global(input[type="button"])[naked=true]:focus,
742
- :global(input[type="button"]).naked:active,
743
- :global(input[type="button"]).naked:focus,
744
- :global(input[type="submit"])[variant*=naked]:active,
745
- :global(input[type="submit"])[variant*=naked]:focus,
746
- :global(input[type="submit"])[naked=true]:active,
747
- :global(input[type="submit"])[naked=true]:focus,
748
- :global(input[type="submit"]).naked:active,
749
- :global(input[type="submit"]).naked:focus {
681
+ .slotui-button[variant*=naked]:active, .slotui-button[variant*=naked]:focus, .slotui-button[naked=true]:active, .slotui-button[naked=true]:focus, .slotui-button.naked:active, .slotui-button.naked:focus,
682
+ button.slotui-button[variant*=naked]:active,
683
+ button.slotui-button[variant*=naked]:focus,
684
+ button.slotui-button[naked=true]:active,
685
+ button.slotui-button[naked=true]:focus,
686
+ button.slotui-button.naked:active,
687
+ button.slotui-button.naked:focus,
688
+ input[type=button].slotui-button[variant*=naked]:active,
689
+ input[type=button].slotui-button[variant*=naked]:focus,
690
+ input[type=button].slotui-button[naked=true]:active,
691
+ input[type=button].slotui-button[naked=true]:focus,
692
+ input[type=button].slotui-button.naked:active,
693
+ input[type=button].slotui-button.naked:focus,
694
+ input[type=submit].slotui-button[variant*=naked]:active,
695
+ input[type=submit].slotui-button[variant*=naked]:focus,
696
+ input[type=submit].slotui-button[naked=true]:active,
697
+ input[type=submit].slotui-button[naked=true]:focus,
698
+ input[type=submit].slotui-button.naked:active,
699
+ input[type=submit].slotui-button.naked:focus {
750
700
  background-color: transparent;
751
701
  border: 0.5px solid transparent;
752
702
  color: inherit;
753
703
  }
754
- :global(button)[variant*=flat], :global(button)[flat=true], :global(button).flat,
755
- :global(.button)[variant*=flat],
756
- :global(.button)[flat=true],
757
- :global(.button).flat,
758
- :global(input[type="button"])[variant*=flat],
759
- :global(input[type="button"])[flat=true],
760
- :global(input[type="button"]).flat,
761
- :global(input[type="submit"])[variant*=flat],
762
- :global(input[type="submit"])[flat=true],
763
- :global(input[type="submit"]).flat {
704
+ .slotui-button[variant*=flat], .slotui-button[flat=true], .slotui-button.flat,
705
+ button.slotui-button[variant*=flat],
706
+ button.slotui-button[flat=true],
707
+ button.slotui-button.flat,
708
+ input[type=button].slotui-button[variant*=flat],
709
+ input[type=button].slotui-button[flat=true],
710
+ input[type=button].slotui-button.flat,
711
+ input[type=submit].slotui-button[variant*=flat],
712
+ input[type=submit].slotui-button[flat=true],
713
+ input[type=submit].slotui-button.flat {
764
714
  color: inherit;
765
715
  background-color: transparent;
766
716
  border: none;
767
717
  border-radius: 0;
768
718
  cursor: pointer;
769
719
  }
770
- :global(button)[variant*=flat]:hover, :global(button)[flat=true]:hover, :global(button).flat:hover,
771
- :global(.button)[variant*=flat]:hover,
772
- :global(.button)[flat=true]:hover,
773
- :global(.button).flat:hover,
774
- :global(input[type="button"])[variant*=flat]:hover,
775
- :global(input[type="button"])[flat=true]:hover,
776
- :global(input[type="button"]).flat:hover,
777
- :global(input[type="submit"])[variant*=flat]:hover,
778
- :global(input[type="submit"])[flat=true]:hover,
779
- :global(input[type="submit"]).flat:hover {
720
+ .slotui-button[variant*=flat]:hover, .slotui-button[flat=true]:hover, .slotui-button.flat:hover,
721
+ button.slotui-button[variant*=flat]:hover,
722
+ button.slotui-button[flat=true]:hover,
723
+ button.slotui-button.flat:hover,
724
+ input[type=button].slotui-button[variant*=flat]:hover,
725
+ input[type=button].slotui-button[flat=true]:hover,
726
+ input[type=button].slotui-button.flat:hover,
727
+ input[type=submit].slotui-button[variant*=flat]:hover,
728
+ input[type=submit].slotui-button[flat=true]:hover,
729
+ input[type=submit].slotui-button.flat:hover {
780
730
  background-color: var(--sld-button-hover-background);
781
731
  }
782
- :global(button)[variant*=flat]:active, :global(button)[variant*=flat]:focus, :global(button)[flat=true]:active, :global(button)[flat=true]:focus, :global(button).flat:active, :global(button).flat:focus,
783
- :global(.button)[variant*=flat]:active,
784
- :global(.button)[variant*=flat]:focus,
785
- :global(.button)[flat=true]:active,
786
- :global(.button)[flat=true]:focus,
787
- :global(.button).flat:active,
788
- :global(.button).flat:focus,
789
- :global(input[type="button"])[variant*=flat]:active,
790
- :global(input[type="button"])[variant*=flat]:focus,
791
- :global(input[type="button"])[flat=true]:active,
792
- :global(input[type="button"])[flat=true]:focus,
793
- :global(input[type="button"]).flat:active,
794
- :global(input[type="button"]).flat:focus,
795
- :global(input[type="submit"])[variant*=flat]:active,
796
- :global(input[type="submit"])[variant*=flat]:focus,
797
- :global(input[type="submit"])[flat=true]:active,
798
- :global(input[type="submit"])[flat=true]:focus,
799
- :global(input[type="submit"]).flat:active,
800
- :global(input[type="submit"]).flat:focus {
732
+ .slotui-button[variant*=flat]:active, .slotui-button[variant*=flat]:focus, .slotui-button[flat=true]:active, .slotui-button[flat=true]:focus, .slotui-button.flat:active, .slotui-button.flat:focus,
733
+ button.slotui-button[variant*=flat]:active,
734
+ button.slotui-button[variant*=flat]:focus,
735
+ button.slotui-button[flat=true]:active,
736
+ button.slotui-button[flat=true]:focus,
737
+ button.slotui-button.flat:active,
738
+ button.slotui-button.flat:focus,
739
+ input[type=button].slotui-button[variant*=flat]:active,
740
+ input[type=button].slotui-button[variant*=flat]:focus,
741
+ input[type=button].slotui-button[flat=true]:active,
742
+ input[type=button].slotui-button[flat=true]:focus,
743
+ input[type=button].slotui-button.flat:active,
744
+ input[type=button].slotui-button.flat:focus,
745
+ input[type=submit].slotui-button[variant*=flat]:active,
746
+ input[type=submit].slotui-button[variant*=flat]:focus,
747
+ input[type=submit].slotui-button[flat=true]:active,
748
+ input[type=submit].slotui-button[flat=true]:focus,
749
+ input[type=submit].slotui-button.flat:active,
750
+ input[type=submit].slotui-button.flat:focus {
801
751
  background-color: transparent;
802
752
  border: none;
803
753
  border-radius: 0;