@wui-js/plugins 0.4.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.
@@ -0,0 +1,663 @@
1
+ /*
2
+ * @file wuiplugin-themes-0.3.css
3
+ * @version 0.3
4
+ * @author Sergio E. Belmar V. (wuijs.project@gmail.com)
5
+ * @copyright Sergio E. Belmar V. (wuijs.project@gmail.com)
6
+ */
7
+
8
+ /* wuiplugin-themes */
9
+
10
+ .wuiplugin-themes {
11
+
12
+ /* wui-scrolly */
13
+
14
+ --wui-scrolly-paging-bgcolor-hidden: rgb(from var(--wuiplugin-theme-graycolor-low) r g b / 20%);
15
+ --wui-scrolly-paging-bgcolor-visible: rgb(from var(--wuiplugin-theme-graycolor-low) r g b / 80%);
16
+
17
+ /* wui-icon */
18
+
19
+ --wui-icon-bgcolor-out: rgb(from var(--wuiplugin-theme-bgcolor-icon) r g b / 70%);
20
+ --wui-icon-bgcolor-over: var(--wuiplugin-theme-bgcolor-icon);
21
+
22
+ /* wui-loader */
23
+
24
+ --wui-loader-color: var(--wuiplugin-theme-bgcolor-icon);
25
+
26
+ /* wui-tooltip */
27
+
28
+ --wui-tooltip-open-delay: .2s;
29
+ --wui-tooltip-bgcolor: var(--wuiplugin-theme-bgcolor-highcontrast);
30
+ --wui-tooltip-textcolor: var(--wuiplugin-theme-graycolor-max);
31
+
32
+ /* wui-modal */
33
+
34
+ --wui-modal-overlay-bgcolor: rgb(from var(--wuiplugin-theme-bgcolor-overlay) r g b / 20%);
35
+ --wui-modal-box-borderradius: var(--wuiplugin-theme-borderradius-high);
36
+ --wui-modal-box-bgcolor: rgb(from var(--wuiplugin-theme-bgcolor-box) r g b / 100%);
37
+ --wui-modal-back-textcolor: var(--wuiplugin-theme-utilitycolor-hightlight);
38
+ --wui-modal-close-bgcolor: var(--wuiplugin-theme-bgcolor-icon);
39
+ --wui-modal-topbar-height: 4px;
40
+ --wui-modal-title-textfont: var(--wuiplugin-theme-titlefont);
41
+ --wui-modal-title-textcase: none;
42
+ --wui-modal-title-textcolor: var(--wuiplugin-theme-graycolor-min);
43
+ --wui-modal-body-scroll-bgcolor-out: rgb(from var(--wuiplugin-theme-bgcolor-scroll) r g b / 20%);
44
+ --wui-modal-body-scroll-bgcolor-over: rgb(from var(--wuiplugin-theme-bgcolor-scroll) r g b / 40%);
45
+ --wui-modal-footer-bordercolor: transparent;
46
+ --wui-modal-button-submit-bgcolor-mobile: rgb(from var(--wuiplugin-theme-shadowcolor-low) r g b / 20%);
47
+ --wui-modal-button-submit-textcolor-mobile: var(--wuiplugin-theme-utilitycolor-hightlight);
48
+ --wui-modal-button-warning-textcolor-mobile: var(--wuiplugin-theme-utilitycolor-warning);
49
+ --wui-modal-message-box-width: 280px;
50
+ --wui-modal-message-box-bgcolor: rgb(from var(--wuiplugin-theme-bgcolor-box) r g b / 100%);
51
+ --wui-modal-message-box-textcolor: var(--wuiplugin-theme-textcolor-active);
52
+ --wui-modal-message-mobile-box-width: 280px;
53
+ --wui-modal-message-mobile-footer-bordercolor: var(--wuiplugin-theme-bordercolor-high);
54
+ --wui-modal-message-mobile-button-bordercolor: var(--wuiplugin-theme-bordercolor-high);
55
+ --wui-modal-message-linkcolor: var(--wuiplugin-theme-utilitycolor-hightlight);
56
+ --wui-modal-page-box-width: 800px;
57
+ --wui-modal-page-box-height: 90%;
58
+ --wui-modal-page-box-borderradius: var(--wuiplugin-theme-borderradius-low);
59
+ --wui-modal-page-box-maxheight: 640px;
60
+ --wui-modal-page-box-bgcolor: rgb(from var(--wuiplugin-theme-bgcolor-box) r g b / 100%);
61
+ --wui-modal-page-header-topbar-bgcolor: var(--wuiplugin-theme-bordercolor-high);
62
+ --wui-modal-page-header-bordercolor: var(--wuiplugin-theme-bordercolor-high);
63
+ --wui-modal-slidepage-box-margin: 10px;
64
+ --wui-modal-smallpage-box-width: 340px;
65
+ --wui-modal-smallpage-box-height: 280px;
66
+
67
+ /* wui-paging */
68
+
69
+ --wui-paging-page-transition-time: .4s;
70
+ --wui-paging-page-bgcolor: transparent;
71
+ --wui-paging-page-scroll-bgcolor-out: rgb(from var(--wuiplugin-theme-bgcolor-scroll) r g b / 20%);
72
+ --wui-paging-page-scroll-bgcolor-over: rgb(from var(--wuiplugin-theme-bgcolor-scroll) r g b / 40%);
73
+
74
+ /* wui-slider */
75
+
76
+ --wui-slider-paging-bgcolor-hidden: rgb(from var(--wuiplugin-theme-graycolor-max) r g b / 20%);
77
+ --wui-slider-paging-bgcolor-visible: rgb(from var(--wuiplugin-theme-graycolor-max) r g b / 80%);
78
+
79
+ /* wui-tabs */
80
+
81
+ --wui-tabs-tab-bgcolor-out: var(--wuiplugin-theme-bgcolor-out);
82
+ --wui-tabs-tab-bgcolor-over: var(--wuiplugin-theme-bgcolor-over);
83
+ --wui-tabs-tab-iconcolor-out: var(--wuiplugin-theme-utilitycolor-hightlight);
84
+ --wui-tabs-tab-iconcolor-over: var(--wuiplugin-theme-utilitycolor-hightlight);
85
+ --wui-tabs-tab-iconcolor-mobile: var(--wuiplugin-theme-utilitycolor-hightlight);
86
+ --wui-tabs-tab-textcolor-out: var(--wuiplugin-theme-textcolor-active);
87
+ --wui-tabs-tab-textcolor-over: var(--wuiplugin-theme-utilitycolor-hightlight);
88
+
89
+ /* wui-menubar */
90
+
91
+ --wui-menubar-shadowcolor: var(--wuiplugin-theme-shadowcolor-low);
92
+ --wui-menubar-margin: 10px;
93
+ --wui-menubar-borderradius: var(--wuiplugin-theme-borderradius-low);
94
+ --wui-menubar-bar-bordercolor: var(--wuiplugin-theme-bordercolor-low);
95
+ --wui-menubar-bar-bgcolor-top: var(--wuiplugin-theme-bordercolor-low);
96
+ --wui-menubar-bar-bgcolor-bottom: var(--wuiplugin-theme-bordercolor-low);
97
+ --wui-menubar-bar-button-bgcolor-out: transparent;
98
+ --wui-menubar-bar-button-bgcolor-over: rgb(from var(--wuiplugin-theme-bordercolor-high) r g b / 40%);
99
+ --wui-menubar-bar-button-bgcolor-selected: var(--wuiplugin-theme-utilitycolor-hightlight);
100
+ --wui-menubar-bar-button-bgcolor-disabled: transparent;
101
+ --wui-menubar-bar-button-iconsize: 24px;
102
+ --wui-menubar-bar-button-iconcolor-out: rgb(from var(--wuiplugin-theme-bgcolor-icon) r g b / 70%);
103
+ --wui-menubar-bar-button-iconcolor-over: var(--wuiplugin-theme-bgcolor-icon);
104
+ --wui-menubar-bar-button-iconcolor-selected: var(--wuiplugin-theme-bgcolor-over);
105
+ --wui-menubar-bar-button-iconcolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
106
+ --wui-menubar-bar-button-textcolor-out: var(--wuiplugin-theme-textcolor-active);
107
+ --wui-menubar-bar-button-textcolor-over: var(--wuiplugin-theme-textcolor-focus);
108
+ --wui-menubar-bar-button-textcolor-selected: var(--wuiplugin-theme-bgcolor-over);
109
+ --wui-menubar-bar-button-textcolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
110
+ --wui-menubar-expander-bgcolor-out: transparent;
111
+ --wui-menubar-expander-bgcolor-over: rgb(from var(--wuiplugin-theme-bordercolor-high) r g b / 40%);
112
+ --wui-menubar-expander-iconsize: 16px;
113
+ --wui-menubar-expander-iconcolor-out: var(--wuiplugin-theme-graycolor-low);
114
+ --wui-menubar-expander-iconcolor-over: var(--wuiplugin-theme-graycolor-min);
115
+ --wui-menubar-expander-expandicon-src: none;
116
+ --wui-menubar-expander-contracticon-src: none;
117
+ --wui-menubar-opener-iconsize: 16px;
118
+ --wui-menubar-opener-openicon-src: none;
119
+ --wui-menubar-opener-closeicon-src: none;
120
+ --wui-menubar-submenu-bordercolor: var(--wuiplugin-theme-bordercolor-low);
121
+ --wui-menubar-submenu-bgcolor: var(--wuiplugin-theme-bgcolor-out);
122
+ --wui-menubar-submenu-button-bgcolor-out: transparent;
123
+ --wui-menubar-submenu-button-bgcolor-over: rgb(from var(--wuiplugin-theme-bordercolor-high) r g b / 40%);
124
+ --wui-menubar-submenu-button-bgcolor-selected: var(--wuiplugin-theme-utilitycolor-hightlight);
125
+ --wui-menubar-submenu-button-bgcolor-disabled: transparent;
126
+ --wui-menubar-submenu-button-iconsize: 24px;
127
+ --wui-menubar-submenu-button-iconcolor-out: rgb(from var(--wuiplugin-theme-bgcolor-icon) r g b / 70%);
128
+ --wui-menubar-submenu-button-iconcolor-over: var(--wuiplugin-theme-bgcolor-icon);
129
+ --wui-menubar-submenu-button-iconcolor-selected: var(--wuiplugin-theme-bgcolor-over);
130
+ --wui-menubar-submenu-button-iconcolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
131
+ --wui-menubar-submenu-button-textcolor-out: var(--wuiplugin-theme-textcolor-active);
132
+ --wui-menubar-submenu-button-textcolor-over: var(--wuiplugin-theme-textcolor-focus);
133
+ --wui-menubar-submenu-button-textcolor-selected: var(--wuiplugin-theme-bgcolor-over);
134
+ --wui-menubar-submenu-button-textcolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
135
+ --wui-menubar-tooltip-bgcolor: #000;
136
+ --wui-menubar-tooltip-textcolor: #fff;
137
+ --wui-menubar-bubble-bgcolor: var(--wuiplugin-theme-utilitycolor-warning);
138
+ --wui-menubar-bubble-textcolor: #fff;
139
+ --wui-menubar-mobile-opener-closeicon-src: none;
140
+
141
+ /* wui-list */
142
+
143
+ --wui-list-shadowcolor: var(--wuiplugin-theme-shadowcolor-low);
144
+ --wui-list-borderradius: var(--wuiplugin-theme-borderradius-low);
145
+ --wui-list-borderwidth: 0;
146
+ --wui-list-bordercolor: var(--wuiplugin-theme-bordercolor-low);
147
+ --wui-list-scroll-bgcolor-out: rgb(from var(--wuiplugin-theme-bgcolor-scroll) r g b / 20%);
148
+ --wui-list-scroll-bgcolor-over: rgb(from var(--wuiplugin-theme-bgcolor-scroll) r g b / 40%);
149
+ --wui-list-row-height: 44px;
150
+ --wui-list-row-borderwidth: 1px;
151
+ --wui-list-row-bordercolor-out: var(--wuiplugin-theme-bordercolor-low);
152
+ --wui-list-row-bordercolor-over: var(--wuiplugin-theme-bordercolor-low);
153
+ --wui-list-row-bgcolor-out: var(--wuiplugin-theme-bgcolor-out);
154
+ --wui-list-row-bgcolor-over: var(--wuiplugin-theme-bgcolor-over);
155
+ --wui-list-row-textcolor-out: var(--wuiplugin-theme-textcolor-active);
156
+ --wui-list-row-textcolor-over: var(--wuiplugin-theme-textcolor-focus);
157
+ --wui-list-row-textcolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
158
+ --wui-list-innerrow-borderwidth: 1px;
159
+ --wui-list-innerrow-bordercolor: var(--wuiplugin-theme-bordercolor-low);
160
+ --wui-list-innerrow-bgcolor: rgb(from var(--wuiplugin-theme-bgcolor-over) r g b / 20%);
161
+ --wui-list-innerrow-textcolor: rgb(from var(--wuiplugin-theme-textcolor-active) r g b / 60%);
162
+ --wui-list-buttons-bgcolor: transparent;
163
+ --wui-list-button-size: 48px;
164
+ --wui-list-button-hmargin: 8px;
165
+ --wui-list-button-borderradius: var(--wuiplugin-theme-borderradius-round);
166
+ --wui-list-button-bgcolor-enabled: var(--wuiplugin-theme-utilitycolor-hightlight);
167
+ --wui-list-button-bgcolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
168
+
169
+ /* wui-table */
170
+
171
+ --wui-table-shadowcolor: var(--wuiplugin-theme-shadowcolor-low);
172
+ --wui-table-borderradius: var(--wuiplugin-theme-borderradius-low);
173
+ --wui-table-scroll-bgcolor-out: rgb(from var(--wuiplugin-theme-bgcolor-scroll) r g b / 20%);
174
+ --wui-table-scroll-bgcolor-over: rgb(from var(--wuiplugin-theme-bgcolor-scroll) r g b / 40%);
175
+ --wui-table-column-bordercolor-width: 1px;
176
+ --wui-table-column-bordercolor-out: rgb(from var(--wuiplugin-theme-utilitycolor-hightlight) r g b / 10%);
177
+ --wui-table-column-bordercolor-over: var(--wuiplugin-theme-utilitycolor-hightlight);
178
+ --wui-table-column-bordercolor-selected: var(--wuiplugin-theme-utilitycolor-hightlight);
179
+ --wui-table-column-bgcolor-out: var(--wuiplugin-theme-bgcolor-over);
180
+ --wui-table-column-bgcolor-over: var(--wuiplugin-theme-bgcolor-over);
181
+ --wui-table-column-bgcolor-selected: var(--wuiplugin-theme-utilitycolor-hightlight);
182
+ --wui-table-column-textcolor-out: var(--wuiplugin-theme-graycolor-low);
183
+ --wui-table-column-textcolor-over: var(--wuiplugin-theme-graycolor-min);
184
+ --wui-table-column-textcolor-selected: var(--wuiplugin-theme-utilitycolor-hightlight);
185
+ --wui-table-column-textcolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
186
+ --wui-table-column-sorter-iconsize: 16px;
187
+ --wui-table-column-sorter-iconcolor-out: var(--wuiplugin-theme-graycolor-low);
188
+ --wui-table-column-sorter-iconcolor-over: var(--wuiplugin-theme-graycolor-min);
189
+ --wui-table-column-sorter-iconcolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
190
+ --wui-table-column-sorter-ascicon-src: none;
191
+ --wui-table-column-sorter-descicon-src: none;
192
+ --wui-table-column-resizer-bordercolor-out: rgb(from var(--wuiplugin-theme-utilitycolor-hightlight) r g b / 10%);
193
+ --wui-table-column-resizer-bordercolor-over: rgb(from var(--wuiplugin-theme-utilitycolor-hightlight) r g b / 10%);
194
+ --wui-table-column-dragger-bordercolor-over: var(--wuiplugin-theme-graycolor-low);
195
+ --wui-table-column-dragger-bgcolor-drop: rgb(from var(--wuiplugin-theme-utilitycolor-hightlight) r g b / 10%);
196
+ --wui-table-row-bordercolor-width: 1px;
197
+ --wui-table-row-bordercolor-out: var(--wuiplugin-theme-bordercolor-low);
198
+ --wui-table-row-bordercolor-over: var(--wuiplugin-theme-bordercolor-low);
199
+ --wui-table-row-bordercolor-selected: var(--wuiplugin-theme-utilitycolor-hightlight);
200
+ --wui-table-row-bordercolor-disabled: var(--wuiplugin-theme-bordercolor-low);
201
+ --wui-table-row-bgcolor-out: var(--wuiplugin-theme-bgcolor-out);
202
+ --wui-table-row-bgcolor-over: var(--wuiplugin-theme-bgcolor-over);
203
+ --wui-table-row-bgcolor-selected: var(--wuiplugin-theme-utilitycolor-hightlight);
204
+ --wui-table-row-bgcolor-disabled: transparent;
205
+ --wui-table-row-textcolor-out: var(--wuiplugin-theme-textcolor-active);
206
+ --wui-table-row-textcolor-over: var(--wuiplugin-theme-textcolor-focus);
207
+ --wui-table-row-textcolor-selected: var(--wuiplugin-theme-bgcolor-over);
208
+ --wui-table-row-textcolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
209
+
210
+ /* wui-form */
211
+
212
+ --wui-form-header-bordercolor: var(--wuiplugin-theme-bordercolor-high);
213
+ --wui-form-header-titlecolor: var(--wuiplugin-theme-textcolor-title);
214
+ --wui-form-body-scroll-bgcolor-out: rgb(from var(--wuiplugin-theme-bgcolor-scroll) r g b / 20%);
215
+ --wui-form-body-scroll-bgcolor-over: rgb(from var(--wuiplugin-theme-bgcolor-scroll) r g b / 40%);
216
+ --wui-form-line-bordercolor: var(--wuiplugin-theme-bordercolor-high);
217
+ --wui-form-fieldset-bgcolor: var(--wuiplugin-theme-graycolor-max);
218
+ --wui-form-legend-texttransform: uppercase;
219
+ --wui-form-legend-textcolor: rgb(from var(--wuiplugin-theme-textcolor-active) r g b / 60%);
220
+ --wui-form-label-textcolor-out: var(--wuiplugin-theme-textcolor-active);
221
+ --wui-form-label-textcolor-focus: var(--wuiplugin-theme-utilitycolor-hightlight);
222
+ --wui-form-label-textcolor-notempty: rgb(from var(--wuiplugin-theme-textcolor-active) r g b / 40%);
223
+ --wui-form-label-textcolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
224
+ --wui-form-input-height: 30px;
225
+ --wui-form-input-borderwidth: 1px;
226
+ --wui-form-input-borderradius: var(--wuiplugin-theme-borderradius-low);
227
+ --wui-form-input-bordercolor-out: rgb(from var(--wuiplugin-theme-utilitycolor-hightlight) r g b / 20%);
228
+ --wui-form-input-bordercolor-focus: var(--wuiplugin-theme-utilitycolor-hightlight);
229
+ --wui-form-input-bordercolor-invalid: var(--wuiplugin-theme-utilitycolor-warning);
230
+ --wui-form-input-bordercolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
231
+ --wui-form-input-bgcolor-out: var(--wuiplugin-theme-bgcolor-over);
232
+ --wui-form-input-bgcolor-focus: var(--wuiplugin-theme-bgcolor-over);
233
+ --wui-form-input-bgcolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
234
+ --wui-form-input-textcolor-out: var(--wuiplugin-theme-textcolor-active);
235
+ --wui-form-input-textcolor-over: var(--wuiplugin-theme-textcolor-focus);
236
+ --wui-form-input-textcolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
237
+ --wui-form-date-opener-iconsize: var(--wuiplugin-theme-input-opener-iconsize);
238
+ --wui-form-date-opener-iconcolor-out: var(--wuiplugin-theme-graycolor-min);
239
+ --wui-form-date-opener-iconcolor-over: var(--wuiplugin-theme-utilitycolor-hightlight);
240
+ --wui-form-date-opener-iconcolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
241
+ --wui-form-date-opener-openicon-src: none;
242
+ --wui-form-date-opener-closeicon-src: none;
243
+ --wui-form-time-opener-iconsize: var(--wuiplugin-theme-input-opener-iconsize);
244
+ --wui-form-time-opener-iconcolor-out: var(--wuiplugin-theme-graycolor-min);
245
+ --wui-form-time-opener-iconcolor-over: var(--wuiplugin-theme-utilitycolor-hightlight);
246
+ --wui-form-time-opener-iconcolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
247
+ --wui-form-time-opener-openicon-src: none;
248
+ --wui-form-time-opener-closeicon-src: none;
249
+ --wui-form-range-thumb-size: 20px;
250
+ --wui-form-range-thumb-bgcolor-out: var(--wuiplugin-theme-utilitycolor-hightlight);
251
+ --wui-form-range-thumb-bgcolor-over: var(--wuiplugin-theme-utilitycolor-hightlight);
252
+ --wui-form-range-thumb-bgcolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
253
+ --wui-form-range-trackbar-height: 7px;
254
+ --wui-form-range-trackbar-borderwidth: 1px;
255
+ --wui-form-range-trackbar-bordercolor-out: var(--wuiplugin-theme-bordercolor-low);
256
+ --wui-form-range-trackbar-bordercolor-focus: var(--wuiplugin-theme-utilitycolor-hightlight);
257
+ --wui-form-range-trackbar-bordercolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
258
+ --wui-form-range-trackbar-bgcolor-out: var(--wuiplugin-theme-bgcolor-over);
259
+ --wui-form-range-trackbar-bgcolor-focus: var(--wuiplugin-theme-bgcolor-over);
260
+ --wui-form-range-trackbar-bgcolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
261
+ --wui-form-select-opener-iconsize: var(--wuiplugin-theme-input-opener-iconsize);
262
+ --wui-form-select-opener-iconcolor-out: var(--wuiplugin-theme-graycolor-min);
263
+ --wui-form-select-opener-iconcolor-over: var(--wuiplugin-theme-utilitycolor-hightlight);
264
+ --wui-form-select-opener-iconcolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
265
+ --wui-form-select-opener-openicon-src: none;
266
+ --wui-form-select-opener-closeicon-src: none;
267
+ --wui-form-data-textcolor-out: var(--wuiplugin-theme-utilitycolor-hightlight);
268
+ --wui-form-data-textcolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
269
+ --wui-form-progress-borderwidth: 1px;
270
+ --wui-form-progress-bordercolor: var(--wuiplugin-theme-bordercolor-low);
271
+ --wui-form-progress-valuecolor: var(--wuiplugin-theme-utilitycolor-hightlight);
272
+ --wui-form-progress-bgcolor: var(--wuiplugin-theme-bgcolor-over);
273
+ --wui-form-text-textcolor-out: var(--wuiplugin-theme-graycolor-half);
274
+ --wui-form-text-textcolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
275
+ --wui-form-text-linkcolor-out: var(--wuiplugin-theme-utilitycolor-hightlight);
276
+ --wui-form-text-linkcolor-highlight: var(--wuiplugin-theme-utilitycolor-hightlight);
277
+ --wui-form-message-shadowcolor: var(--wuiplugin-theme-shadowcolor-low);
278
+ --wui-form-message-bgcolor: var(--wuiplugin-theme-bgcolor-out);
279
+ --wui-form-message-textcolor: var(--wuiplugin-theme-textcolor-active);
280
+ --wui-form-message-highlight-bgcolor: var(--wuiplugin-theme-utilitycolor-hightlight);
281
+ --wui-form-message-highlight-textcolor: var(--wuiplugin-theme-graycolor-max);
282
+ --wui-form-mobile-field-bordercolor: rgb(from var(--wuiplugin-theme-utilitycolor-hightlight) r g b / 10%);
283
+ --wui-form-mobile-label-textcolor: var(--wuiplugin-theme-graycolor-low);
284
+ --wui-form-mobile-input-height: 40px;
285
+ --wui-form-mobile-input-bgcolor: rgb(from var(--wuiplugin-theme-utilitycolor-hightlight) r g b / 4%);
286
+ --wui-form-mobile-input-height: 34px;
287
+ --wui-form-mobile-input-borderradius: var(--wuiplugin-theme-borderradius-half);
288
+
289
+ /* wui-selectpicker */
290
+
291
+ --wui-selectpicker-borderradius: var(--wuiplugin-theme-borderradius-low);
292
+ --wui-selectpicker-borderwidth: 0px;
293
+ --wui-selectpicker-bordercolor: transparent;
294
+ --wui-selectpicker-bgcolor: var(--wuiplugin-theme-bgcolor-over);
295
+ --wui-selectpicker-opener-iconsize: var(--wuiplugin-theme-input-opener-iconsize);
296
+ --wui-selectpicker-opener-iconcolor-out: var(--wuiplugin-theme-graycolor-min);
297
+ --wui-selectpicker-opener-iconcolor-over: var(--wuiplugin-theme-utilitycolor-hightlight);
298
+ --wui-selectpicker-opener-iconcolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
299
+ --wui-selectpicker-opener-openicon-src: none;
300
+ --wui-selectpicker-opener-closeicon-src: none;
301
+ --wui-selectpicker-viewinput-paddingleft: 10px;
302
+ --wui-selectpicker-viewinput-textcolor-out: var(--wui-form-input-textcolor-out);
303
+ --wui-selectpicker-viewinput-textcolor-over: var(--wui-form-input-textcolor-over);
304
+ --wui-selectpicker-viewinput-textcolor-disabled: var(--wui-form-input-textcolor-disabled);
305
+ --wui-selectpicker-box-shadowcolor: var(--wuiplugin-theme-shadowcolor-low);
306
+ --wui-selectpicker-box-borderradius: var(--wuiplugin-theme-borderradius-half);
307
+ --wui-selectpicker-box-bordercolor: var(--wuiplugin-theme-bordercolor-low);
308
+ --wui-selectpicker-box-bgcolor: var(--wuiplugin-theme-bgcolor-out);
309
+ --wui-selectpicker-box-scroll-bgcolor-out: rgb(from var(--wuiplugin-theme-bgcolor-scroll) r g b / 20%);
310
+ --wui-selectpicker-box-scroll-bgcolor-over: rgb(from var(--wuiplugin-theme-bgcolor-scroll) r g b / 40%);
311
+ --wui-selectpicker-box-option-borderradius: var(--wuiplugin-theme-borderradius-low);
312
+ --wui-selectpicker-box-option-bordercolor-out: var(--wuiplugin-theme-bordercolor-low);
313
+ --wui-selectpicker-box-option-bordercolor-over: var(--wuiplugin-theme-bordercolor-low);
314
+ --wui-selectpicker-box-option-bgcolor-out: transparent;
315
+ --wui-selectpicker-box-option-bgcolor-over: var(--wuiplugin-theme-bgcolor-over);
316
+ --wui-selectpicker-box-option-iconsize: 24px;
317
+ --wui-selectpicker-box-option-iconcolor-out: var(--wuiplugin-theme-utilitycolor-hightlight);
318
+ --wui-selectpicker-box-option-iconcolor-over: var(--wuiplugin-theme-utilitycolor-hightlight);
319
+ --wui-selectpicker-box-option-iconcolor-selected: var(--wuiplugin-theme-utilitycolor-hightlight);
320
+ --wui-selectpicker-box-option-iconcolor-disabled: rgb(from var(--wuiplugin-theme-utilitycolor-disabled) r g b / 40%);
321
+ --wui-selectpicker-box-option-checkicon-src: none;
322
+ --wui-selectpicker-box-option-textcolor-empty: rgb(from var(--wuiplugin-theme-textcolor-active) r g b / 60%);
323
+ --wui-selectpicker-box-option-textcolor-out: var(--wuiplugin-theme-textcolor-active);
324
+ --wui-selectpicker-box-option-textcolor-over: var(--wuiplugin-theme-textcolor-active);
325
+ --wui-selectpicker-box-option-textcolor-selected: var(--wuiplugin-theme-utilitycolor-hightlight);
326
+ --wui-selectpicker-box-option-textcolor-disabled: rgb(from var(--wuiplugin-theme-utilitycolor-disabled) r g b / 40%);
327
+ --wui-selectpicker-box-button-bordercolor: var(--wuiplugin-theme-bordercolor-low);
328
+ --wui-selectpicker-box-button-textcolor-out: var(--wuiplugin-theme-utilitycolor-hightlight);
329
+ --wui-selectpicker-box-button-textcolor-over: var(--wuiplugin-theme-utilitycolor-hightlight);
330
+ --wui-selectpicker-mobile-overlay-bgcolor: rgb(from var(--wuiplugin-theme-bgcolor-overlay) r g b / 20%);
331
+ --wui-selectpicker-mobile-box-width: 280px;
332
+ --wui-selectpicker-mobile-box-borderradius: var(--wui-modal-box-borderradius);
333
+
334
+ /* wui-datepicker */
335
+
336
+ --wui-datepicker-borderradius: var(--wuiplugin-theme-borderradius-low);
337
+ --wui-datepicker-borderwidth: 0px;
338
+ --wui-datepicker-bordercolor: transparent;
339
+ --wui-datepicker-bgcolor: var(--wuiplugin-theme-bgcolor-over);
340
+ --wui-datepicker-opener-iconsize: var(--wuiplugin-theme-input-opener-iconsize);
341
+ --wui-datepicker-opener-iconcolor-out: var(--wuiplugin-theme-graycolor-min);
342
+ --wui-datepicker-opener-iconcolor-over: var(--wuiplugin-theme-utilitycolor-hightlight);
343
+ --wui-datepicker-opener-iconcolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
344
+ --wui-datepicker-opener-openicon-src: none;
345
+ --wui-datepicker-opener-closeicon-src: none;
346
+ --wui-datepicker-viewinput-paddingleft: 10px;
347
+ --wui-datepicker-viewinput-textcolor-out: var(--wui-form-input-textcolor-out);
348
+ --wui-datepicker-viewinput-textcolor-over: var(--wui-form-input-textcolor-over);
349
+ --wui-datepicker-viewinput-textcolor-disabled: var(--wui-form-input-textcolor-disabled);
350
+ --wui-datepicker-box-shadowcolor: var(--wuiplugin-theme-shadowcolor-low);
351
+ --wui-datepicker-box-borderradius: var(--wuiplugin-theme-borderradius-half);
352
+ --wui-datepicker-box-bordercolor: var(--wuiplugin-theme-bordercolor-low);
353
+ --wui-datepicker-box-bgcolor: rgb(from var(--wuiplugin-theme-bgcolor-out) r g b / 100%);
354
+ --wui-datepicker-box-period-iconsize: 20px;
355
+ --wui-datepicker-box-period-iconcolor-out: var(--wuiplugin-theme-graycolor-min);
356
+ --wui-datepicker-box-period-iconcolor-over: var(--wuiplugin-theme-utilitycolor-hightlight);
357
+ --wui-datepicker-box-period-iconcolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
358
+ --wui-datepicker-box-period-upicon-src: none;
359
+ --wui-datepicker-box-period-downicon-src: none;
360
+ --wui-datepicker-box-paging-iconsize: 26px;
361
+ --wui-datepicker-box-paging-iconcolor-out: var(--wuiplugin-theme-utilitycolor-hightlight);
362
+ --wui-datepicker-box-paging-iconcolor-over: var(--wuiplugin-theme-utilitycolor-hightlight);
363
+ --wui-datepicker-box-paging-iconcolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
364
+ --wui-datepicker-box-paging-previcon-src: none;
365
+ --wui-datepicker-box-paging-nexticon-src: none;
366
+ --wui-datepicker-box-month-titlecolor: var(--wuiplugin-theme-graycolor-half);
367
+ --wui-datepicker-box-month-bgcolor-today: var(--wuiplugin-theme-bordercolor-low);
368
+ --wui-datepicker-box-month-bgcolor-over: rgb(from var(--wuiplugin-theme-utilitycolor-hightlight) r g b / 20%);
369
+ --wui-datepicker-box-month-bgcolor-selected: var(--wuiplugin-theme-utilitycolor-hightlight);
370
+ --wui-datepicker-box-month-textcolor-out: var(--wuiplugin-theme-graycolor-min);
371
+ --wui-datepicker-box-month-textcolor-over: var(--wuiplugin-theme-utilitycolor-hightlight);
372
+ --wui-datepicker-box-month-textcolor-selected: var(--wuiplugin-theme-graycolor-max);
373
+ --wui-datepicker-box-day-bgcolor-today: var(--wuiplugin-theme-bordercolor-low);
374
+ --wui-datepicker-box-day-bgcolor-over: rgb(from var(--wuiplugin-theme-utilitycolor-hightlight) r g b / 20%);
375
+ --wui-datepicker-box-day-bgcolor-selected: var(--wuiplugin-theme-utilitycolor-hightlight);
376
+ --wui-datepicker-box-day-textcolor-out: var(--wuiplugin-theme-graycolor-min);
377
+ --wui-datepicker-box-day-textcolor-over: var(--wuiplugin-theme-utilitycolor-hightlight);
378
+ --wui-datepicker-box-day-textcolor-selected: var(--wuiplugin-theme-graycolor-max);
379
+ --wui-datepicker-box-button-textcolor-out: var(--wuiplugin-theme-utilitycolor-hightlight);
380
+ --wui-datepicker-box-button-textcolor-over: var(--wuiplugin-theme-utilitycolor-hightlight);
381
+ --wui-datepicker-mobile-overlay-bgcolor: rgb(from var(--wuiplugin-theme-bgcolor-overlay) r g b / 20%);
382
+
383
+ /* wui-timepicker */
384
+
385
+ --wui-timepicker-borderradius: var(--wuiplugin-theme-borderradius-low);
386
+ --wui-timepicker-borderwidth: 0px;
387
+ --wui-timepicker-bordercolor: transparent;
388
+ --wui-timepicker-bgcolor: var(--wuiplugin-theme-bgcolor-over);
389
+ --wui-timepicker-opener-iconsize: var(--wuiplugin-theme-input-opener-iconsize);
390
+ --wui-timepicker-opener-iconcolor-out: var(--wuiplugin-theme-graycolor-min);
391
+ --wui-timepicker-opener-iconcolor-over: var(--wuiplugin-theme-utilitycolor-hightlight);
392
+ --wui-timepicker-opener-iconcolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
393
+ --wui-timepicker-opener-openicon-src: none;
394
+ --wui-timepicker-opener-closeicon-src: none;
395
+ --wui-timepicker-viewinput-paddingleft: 10px;
396
+ --wui-timepicker-viewinput-textcolor-out: var(--wui-form-input-textcolor-out);
397
+ --wui-timepicker-viewinput-textcolor-over: var(--wui-form-input-textcolor-over);
398
+ --wui-timepicker-viewinput-textcolor-disabled: var(--wui-form-input-textcolor-disabled);
399
+ --wui-timepicker-box-shadowcolor: var(--wuiplugin-theme-shadowcolor-low);
400
+ --wui-timepicker-box-borderradius: var(--wuiplugin-theme-borderradius-half);
401
+ --wui-timepicker-box-bordercolor: var(--wuiplugin-theme-bordercolor-low);
402
+ --wui-timepicker-box-bgcolor: rgb(from var(--wuiplugin-theme-graycolor-max) r g b / 80%);
403
+ --wui-timepicker-box-scroll-bgcolor-out: rgb(from var(--wuiplugin-theme-bgcolor-scroll) r g b / 20%);
404
+ --wui-timepicker-box-scroll-bgcolor-over: rgb(from var(--wuiplugin-theme-bgcolor-scroll) r g b / 40%);
405
+ --wui-timepicker-box-option-bgcolor-now: var(--wuiplugin-theme-bordercolor-low);
406
+ --wui-timepicker-box-option-bgcolor-over: rgb(from var(--wuiplugin-theme-utilitycolor-hightlight) r g b / 20%);
407
+ --wui-timepicker-box-option-bgcolor-selected: var(--wuiplugin-theme-utilitycolor-hightlight);
408
+ --wui-timepicker-box-option-textcolor-out: var(--wuiplugin-theme-graycolor-min);
409
+ --wui-timepicker-box-option-textcolor-over: var(--wuiplugin-theme-utilitycolor-hightlight);
410
+ --wui-timepicker-box-option-textcolor-selected: var(--wuiplugin-theme-graycolor-max);
411
+ --wui-timepicker-box-button-textcolor-out: var(--wuiplugin-theme-utilitycolor-hightlight);
412
+ --wui-timepicker-box-button-textcolor-over: var(--wuiplugin-theme-utilitycolor-hightlight);
413
+ --wui-timepicker-mobile-overlay-bgcolor: rgb(from var(--wuiplugin-theme-bgcolor-overlay) r g b / 20%);
414
+
415
+ /* wui-colorpicker */
416
+
417
+ --wui-colorpicker-opener-iconsize: var(--wuiplugin-theme-input-opener-iconsize);
418
+ --wui-colorpicker-opener-iconcolor-out: var(--wuiplugin-theme-graycolor-min);
419
+ --wui-colorpicker-opener-iconcolor-over: var(--wuiplugin-theme-utilitycolor-hightlight);
420
+ --wui-colorpicker-opener-iconcolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
421
+ --wui-colorpicker-opener-openicon-src: none;
422
+ --wui-colorpicker-opener-closeicon-src: none;
423
+ --wui-colorpicker-viewbutton-size: 30px;
424
+ --wui-colorpicker-viewbutton-bordercolor-out: rgb(from var(--wuiplugin-theme-utilitycolor-hightlight) r g b / 20%);
425
+ --wui-colorpicker-viewbutton-bordercolor-over: var(--wuiplugin-theme-utilitycolor-hightlight);
426
+ --wui-colorpicker-viewbutton-bordercolor-invalid: var(--wuiplugin-theme-utilitycolor-warning);
427
+ --wui-colorpicker-viewbutton-bordercolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
428
+ --wui-colorpicker-viewbutton-bgcolor-out: transparent;
429
+ --wui-colorpicker-viewbutton-bgcolor-over: transparent;
430
+ --wui-colorpicker-viewbutton-bgcolor-disabled: transparent;
431
+ --wui-colorpicker-viewcolor-borderwidth: 1px;
432
+ --wui-colorpicker-viewcolor-bordercolor: rgb(from var(--wuiplugin-theme-utilitycolor-hightlight) r g b / 20%);
433
+ --wui-colorpicker-viewcolor-emptyicon-src: none;
434
+ --wui-colorpicker-box-shadowcolor: var(--wuiplugin-theme-shadowcolor-low);
435
+ --wui-colorpicker-box-borderradius: var(--wuiplugin-theme-borderradius-half);
436
+ --wui-colorpicker-box-bordercolor: var(--wuiplugin-theme-bordercolor-low);
437
+ --wui-colorpicker-box-bgcolor: rgb(from var(--wuiplugin-theme-graycolor-max) r g b / 80%);
438
+ --wui-colorpicker-box-scroll-bgcolor-out: rgb(from var(--wuiplugin-theme-bgcolor-scroll) r g b / 20%);
439
+ --wui-colorpicker-box-scroll-bgcolor-over: rgb(from var(--wuiplugin-theme-bgcolor-scroll) r g b / 40%);
440
+ --wui-colorpicker-box-tab-textcolor-out: var(--wuiplugin-theme-textcolor-active);
441
+ --wui-colorpicker-box-tab-textcolor-selected: var(--wuiplugin-theme-utilitycolor-hightlight);
442
+ --wui-colorpicker-box-option-bordercolor-out: var(--wuiplugin-theme-bordercolor-low);
443
+ --wui-colorpicker-box-option-bordercolor-over: var(--wuiplugin-theme-bordercolor-low);
444
+ --wui-colorpicker-box-option-bgcolor-out: transparent;
445
+ --wui-colorpicker-box-option-bgcolor-over: var(--wuiplugin-theme-bgcolor-over);
446
+ --wui-colorpicker-box-option-bgcolor-selected: var(--wuiplugin-theme-utilitycolor-hightlight);
447
+ --wui-colorpicker-box-option-textcolor-out: var(--wuiplugin-theme-graycolor-min);
448
+ --wui-colorpicker-box-option-textcolor-over: var(--wuiplugin-theme-utilitycolor-hightlight);
449
+ --wui-colorpicker-box-option-textcolor-selected: var(--wuiplugin-theme-graycolor-max);
450
+ --wui-colorpicker-box-preview-textcolor-out: var(--wuiplugin-theme-graycolor-min);
451
+ --wui-colorpicker-box-preview-textcolor-empty: rgb(from var(--wuiplugin-theme-textcolor-active) r g b / 60%);
452
+ --wui-colorpicker-box-button-textcolor-out: var(--wuiplugin-theme-utilitycolor-hightlight);
453
+ --wui-colorpicker-box-button-textcolor-over: var(--wuiplugin-theme-utilitycolor-hightlight);
454
+ --wui-colorpicker-mobile-overlay-bgcolor: rgb(from var(--wuiplugin-theme-bgcolor-overlay) r g b / 20%);
455
+
456
+ /* wui-switch */
457
+
458
+ --wui-switch-button-size: 30px;
459
+ --wui-switch-bordercolor-out: rgb(from var(--wuiplugin-theme-utilitycolor-hightlight) r g b / 20%);
460
+ --wui-switch-bordercolor-over: var(--wuiplugin-theme-utilitycolor-hightlight);
461
+ --wui-switch-bordercolor-activated: var(--wuiplugin-theme-utilitycolor-hightlight);
462
+ --wui-switch-bordercolor-invalid: var(--wuiplugin-theme-utilitycolor-warning);
463
+ --wui-switch-bordercolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
464
+ --wui-switch-bgcolor-out: rgb(from var(--wuiplugin-theme-utilitycolor-hightlight) r g b / 4%);
465
+ --wui-switch-bgcolor-over: rgb(from var(--wuiplugin-theme-utilitycolor-hightlight) r g b / 4%);
466
+ --wui-switch-bgcolor-activated: var(--wuiplugin-theme-utilitycolor-hightlight);
467
+ --wui-switch-bgcolor-disabled: rgb(from var(--wuiplugin-theme-utilitycolor-disabled) r g b / 20%);
468
+ --wui-switch-button-bordercolor-out: rgb(from var(--wuiplugin-theme-utilitycolor-hightlight) r g b / 20%);
469
+ --wui-switch-button-bordercolor-over: var(--wuiplugin-theme-utilitycolor-hightlight);
470
+ --wui-switch-button-bordercolor-activated: var(--wuiplugin-theme-utilitycolor-hightlight);
471
+ --wui-switch-button-bordercolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
472
+ --wui-switch-button-bgcolor-out: var(--wuiplugin-theme-bgcolor-over);
473
+ --wui-switch-button-bgcolor-over: rgb(from var(--wuiplugin-theme-utilitycolor-hightlight) r g b / 4%);
474
+ --wui-switch-button-bgcolor-activated: var(--wuiplugin-theme-bgcolor-over);
475
+ --wui-switch-button-bgcolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
476
+
477
+ /* wui-intensity */
478
+
479
+ --wui-intensity-height: 30px;
480
+ --wui-intensity-borderradius: var(--wuiplugin-theme-borderradius-half);
481
+ --wui-intensity-bordercolor-out: rgb(from var(--wuiplugin-theme-utilitycolor-hightlight) r g b / 20%);
482
+ --wui-intensity-bordercolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
483
+ --wui-intensity-bgcolor-none: var(--wuiplugin-theme-bgcolor-over);
484
+ --wui-intensity-bgcolor-low: var(--wuiplugin-theme-intencitycolor-low);
485
+ --wui-intensity-bgcolor-half: var(--wuiplugin-theme-intencitycolor-half);
486
+ --wui-intensity-bgcolor-high: var(--wuiplugin-theme-intencitycolor-high);
487
+
488
+ /* wui-button */
489
+
490
+ --wui-button-default-minwidth: 200px;
491
+ --wui-button-default-height: 34px;
492
+ --wui-button-default-bordercolor-out: rgb(from var(--wuiplugin-theme-utilitycolor-hightlight) r g b / 20%);
493
+ --wui-button-default-bordercolor-over: var(--wuiplugin-theme-utilitycolor-hightlight);
494
+ --wui-button-default-bordercolor-selected: var(--wuiplugin-theme-utilitycolor-hightlight);
495
+ --wui-button-default-bordercolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
496
+ --wui-button-default-bgcolor-out: transparent;
497
+ --wui-button-default-bgcolor-over: transparent;
498
+ --wui-button-default-bgcolor-selected: var(--wuiplugin-theme-utilitycolor-hightlight);
499
+ --wui-button-default-bgcolor-disabled: transparent;
500
+ --wui-button-default-textcolor-out: var(--wuiplugin-theme-utilitycolor-hightlight);
501
+ --wui-button-default-textcolor-over: var(--wuiplugin-theme-utilitycolor-hightlight);
502
+ --wui-button-default-textcolor-selected: var(--wuiplugin-theme-graycolor-max);
503
+ --wui-button-default-textcolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
504
+ --wui-button-default-textsize: 15px;
505
+ --wui-button-submit-minwidth: 200px;
506
+ --wui-button-submit-height: 34px;
507
+ --wui-button-submit-bordercolor-out: rgb(from var(--wuiplugin-theme-utilitycolor-hightlight) r g b / 20%);
508
+ --wui-button-submit-bordercolor-over: var(--wuiplugin-theme-utilitycolor-hightlight);
509
+ --wui-button-submit-bordercolor-selected: var(--wuiplugin-theme-utilitycolor-hightlight);
510
+ --wui-button-submit-bordercolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
511
+ --wui-button-submit-bgcolor-out: var(--wuiplugin-theme-utilitycolor-hightlight);
512
+ --wui-button-submit-bgcolor-over: var(--wuiplugin-theme-utilitycolor-hightlight);
513
+ --wui-button-submit-bgcolor-selected: var(--wuiplugin-theme-utilitycolor-hightlight);
514
+ --wui-button-submit-bgcolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
515
+ --wui-button-submit-textcolor-out: var(--wuiplugin-theme-graycolor-max);
516
+ --wui-button-submit-textcolor-over: var(--wuiplugin-theme-graycolor-max);
517
+ --wui-button-submit-textcolor-selected: var(--wuiplugin-theme-graycolor-max);
518
+ --wui-button-submit-textcolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
519
+ --wui-button-submit-textsize: 15px;
520
+ --wui-button-warning-bordercolor-out: rgb(from var(--wuiplugin-theme-utilitycolor-warning) r g b / 25%);
521
+ --wui-button-warning-bordercolor-over: var(--wuiplugin-theme-utilitycolor-warning);
522
+ --wui-button-warning-bordercolor-selected: var(--wuiplugin-theme-utilitycolor-warning);
523
+ --wui-button-warning-bordercolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
524
+ --wui-button-warning-bgcolor-out: var(--wuiplugin-theme-utilitycolor-warning);
525
+ --wui-button-warning-bgcolor-over: var(--wuiplugin-theme-utilitycolor-warning);
526
+ --wui-button-warning-bgcolor-selected: var(--wuiplugin-theme-utilitycolor-warning);
527
+ --wui-button-warning-bgcolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
528
+ --wui-button-warning-textcolor-out: var(--wuiplugin-theme-graycolor-max);
529
+ --wui-button-warning-textcolor-over: var(--wuiplugin-theme-graycolor-max);
530
+ --wui-button-warning-textcolor-selected: var(--wuiplugin-theme-graycolor-max);
531
+ --wui-button-warning-textcolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
532
+ --wui-button-icon-float-padding: 5px;
533
+ --wui-button-mobile-default-height: 40px;
534
+ --wui-button-mobile-submit-height: 40px;
535
+ --wui-button-mobile-icon-float-padding: 10px;
536
+ --wui-button-form-default-minwidth: 100px;
537
+
538
+ /* wuiplugin-selector */
539
+
540
+ --wuiplugin-selector-box-width: 280px;
541
+ --wuiplugin-selector-box-bgcolor: var(--wuiplugin-theme-bgcolor-out);
542
+ --wuiplugin-selector-option-bordercolor-out: var(--wuiplugin-theme-bordercolor-low);
543
+ --wuiplugin-selector-option-bordercolor-over: var(--wuiplugin-theme-bordercolor-low);
544
+ --wuiplugin-selector-option-bgcolor-out: transparent;
545
+ --wuiplugin-selector-option-bgcolor-over: var(--wuiplugin-theme-bgcolor-over);
546
+ --wuiplugin-selector-option-iconcolor-out: var(--wuiplugin-theme-utilitycolor-hightlight);
547
+ --wuiplugin-selector-option-iconcolor-over: var(--wuiplugin-theme-utilitycolor-hightlight);
548
+ --wuiplugin-selector-option-iconcolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
549
+ --wuiplugin-selector-option-textcolor-out: var(--wuiplugin-theme-textcolor-active);
550
+ --wuiplugin-selector-option-textcolor-over: var(--wuiplugin-theme-utilitycolor-hightlight);
551
+ --wuiplugin-selector-option-textcolor-selected: var(--wuiplugin-theme-utilitycolor-hightlight);
552
+ --wuiplugin-selector-option-textcolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled);
553
+ --wuiplugin-selector-option-checker-bordercolor-out: var(--wuiplugin-theme-utilitycolor-hightlight);
554
+ --wuiplugin-selector-option-checker-bordercolor-selected: var(--wuiplugin-theme-utilitycolor-hightlight);
555
+ --wuiplugin-selector-option-checker-bgcolor-out: transparent;
556
+ --wuiplugin-selector-option-checker-bgcolor-selected: var(--wuiplugin-theme-utilitycolor-hightlight);
557
+ --wuiplugin-selector-button-bordercolor: var(--wuiplugin-theme-bordercolor-low);
558
+ }
559
+
560
+ .wuiplugin-themes {
561
+ -webkit-transition: none;
562
+ -moz-transition: none;
563
+ transition: none;
564
+ }
565
+
566
+ .wuiplugin-themes.system {
567
+ color-scheme: light dark;
568
+ --wuiplugin-theme-graycolor-max: light-dark(var(--wuiplugin-theme-graycolor-max-light), var(--wuiplugin-theme-graycolor-max-dark));
569
+ --wuiplugin-theme-graycolor-high: light-dark(var(--wuiplugin-theme-graycolor-high-light), var(--wuiplugin-theme-graycolor-high-dark));
570
+ --wuiplugin-theme-graycolor-half: light-dark(var(--wuiplugin-theme-graycolor-half-light), var(--wuiplugin-theme-graycolor-half-dark));
571
+ --wuiplugin-theme-graycolor-low: light-dark(var(--wuiplugin-theme-graycolor-low-light), var(--wuiplugin-theme-graycolor-low-dark));
572
+ --wuiplugin-theme-graycolor-min: light-dark(var(--wuiplugin-theme-graycolor-min-light), var(--wuiplugin-theme-graycolor-min-dark));
573
+ --wuiplugin-theme-shadowcolor-low: light-dark(var(--wuiplugin-theme-shadowcolor-low-light), var(--wuiplugin-theme-shadowcolor-low-dark));
574
+ --wuiplugin-theme-shadowcolor-high: light-dark(var(--wuiplugin-theme-shadowcolor-high-light), var(--wuiplugin-theme-shadowcolor-high-dark));
575
+ --wuiplugin-theme-bordercolor-max: light-dark(var(--wuiplugin-theme-bordercolor-max-light), var(--wuiplugin-theme-bordercolor-max-dark));
576
+ --wuiplugin-theme-bordercolor-high: light-dark(var(--wuiplugin-theme-bordercolor-high-light), var(--wuiplugin-theme-bordercolor-high-dark));
577
+ --wuiplugin-theme-bordercolor-low: light-dark(var(--wuiplugin-theme-bordercolor-low-light), var(--wuiplugin-theme-bordercolor-low-dark));
578
+ --wuiplugin-theme-bgcolor-overlay: light-dark(var(--wuiplugin-theme-bgcolor-overlay-light), var(--wuiplugin-theme-bgcolor-overlay-dark));
579
+ --wuiplugin-theme-bgcolor-box: light-dark(var(--wuiplugin-theme-bgcolor-box-light), var(--wuiplugin-theme-bgcolor-box-dark));
580
+ --wuiplugin-theme-bgcolor-out: light-dark(var(--wuiplugin-theme-bgcolor-out-light), var(--wuiplugin-theme-bgcolor-out-dark));
581
+ --wuiplugin-theme-bgcolor-over: light-dark(var(--wuiplugin-theme-bgcolor-over-light), var(--wuiplugin-theme-bgcolor-over-dark));
582
+ --wuiplugin-theme-bgcolor-scroll: light-dark(var(--wuiplugin-theme-bgcolor-scroll-light), var(--wuiplugin-theme-bgcolor-scroll-dark));
583
+ --wuiplugin-theme-bgcolor-icon: light-dark(var(--wuiplugin-theme-bgcolor-icon-light), var(--wuiplugin-theme-bgcolor-icon-dark));
584
+ --wuiplugin-theme-bgcolor-highcontrast: light-dark(var(--wuiplugin-theme-bgcolor-highcontrast-light), var(--wuiplugin-theme-bgcolor-highcontrast-dark));
585
+ --wuiplugin-theme-textcolor-title: light-dark(var(--wuiplugin-theme-textcolor-title-light), var(--wuiplugin-theme-textcolor-title-dark));
586
+ --wuiplugin-theme-textcolor-active: light-dark(var(--wuiplugin-theme-textcolor-active-light), var(--wuiplugin-theme-textcolor-active-dark));
587
+ --wuiplugin-theme-textcolor-focus: light-dark(var(--wuiplugin-theme-textcolor-focus-light), var(--wuiplugin-theme-textcolor-focus-dark));
588
+ --wuiplugin-theme-utilitycolor-hightlight: light-dark(var(--wuiplugin-theme-utilitycolor-hightlight-light), var(--wuiplugin-theme-utilitycolor-hightlight-dark));
589
+ --wuiplugin-theme-utilitycolor-warning: light-dark(var(--wuiplugin-theme-utilitycolor-warning-light), var(--wuiplugin-theme-utilitycolor-warning-dark));
590
+ --wuiplugin-theme-utilitycolor-disabled: light-dark(var(--wuiplugin-theme-utilitycolor-disabled-light), var(--wuiplugin-theme-utilitycolor-disabled-dark));
591
+ --wuiplugin-theme-intencitycolor-low: light-dark(var(--wuiplugin-theme-intencitycolor-low-light), var(--wuiplugin-theme-intencitycolor-low-dark));
592
+ --wuiplugin-theme-intencitycolor-half: light-dark(var(--wuiplugin-theme-intencitycolor-half-light), var(--wuiplugin-theme-intencitycolor-half-dark));
593
+ --wuiplugin-theme-intencitycolor-high: light-dark(var(--wuiplugin-theme-intencitycolor-high-light), var(--wuiplugin-theme-intencitycolor-high-dark));
594
+ }
595
+
596
+ .wuiplugin-themes.light {
597
+ color-scheme: light;
598
+ --wuiplugin-theme-graycolor-max: var(--wuiplugin-theme-graycolor-max-light);
599
+ --wuiplugin-theme-graycolor-high: var(--wuiplugin-theme-graycolor-high-light);
600
+ --wuiplugin-theme-graycolor-half: var(--wuiplugin-theme-graycolor-half-light);
601
+ --wuiplugin-theme-graycolor-low: var(--wuiplugin-theme-graycolor-low-light);
602
+ --wuiplugin-theme-graycolor-min: var(--wuiplugin-theme-graycolor-min-light);
603
+ --wuiplugin-theme-shadowcolor-low: var(--wuiplugin-theme-shadowcolor-low-light);
604
+ --wuiplugin-theme-shadowcolor-high: var(--wuiplugin-theme-shadowcolor-high-light);
605
+ --wuiplugin-theme-bordercolor-max: var(--wuiplugin-theme-bordercolor-max-light);
606
+ --wuiplugin-theme-bordercolor-high: var(--wuiplugin-theme-bordercolor-high-light);
607
+ --wuiplugin-theme-bordercolor-low: var(--wuiplugin-theme-bordercolor-low-light);
608
+ --wuiplugin-theme-bgcolor-overlay: var(--wuiplugin-theme-bgcolor-overlay-light);
609
+ --wuiplugin-theme-bgcolor-box: var(--wuiplugin-theme-bgcolor-box-light);
610
+ --wuiplugin-theme-bgcolor-out: var(--wuiplugin-theme-bgcolor-out-light);
611
+ --wuiplugin-theme-bgcolor-over: var(--wuiplugin-theme-bgcolor-over-light);
612
+ --wuiplugin-theme-bgcolor-scroll: var(--wuiplugin-theme-bgcolor-scroll-light);
613
+ --wuiplugin-theme-bgcolor-icon: var(--wuiplugin-theme-bgcolor-icon-light);
614
+ --wuiplugin-theme-bgcolor-highcontrast: var(--wuiplugin-theme-bgcolor-highcontrast-light);
615
+ --wuiplugin-theme-textcolor-title: var(--wuiplugin-theme-textcolor-title-light);
616
+ --wuiplugin-theme-textcolor-active: var(--wuiplugin-theme-textcolor-active-light);
617
+ --wuiplugin-theme-textcolor-focus: var(--wuiplugin-theme-textcolor-focus-light);
618
+ --wuiplugin-theme-utilitycolor-hightlight: var(--wuiplugin-theme-utilitycolor-hightlight-light);
619
+ --wuiplugin-theme-utilitycolor-warning: var(--wuiplugin-theme-utilitycolor-warning-light);
620
+ --wuiplugin-theme-utilitycolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled-light);
621
+ --wuiplugin-theme-intencitycolor-low: var(--wuiplugin-theme-intencitycolor-low-light);
622
+ --wuiplugin-theme-intencitycolor-half: var(--wuiplugin-theme-intencitycolor-half-light);
623
+ --wuiplugin-theme-intencitycolor-high: var(--wuiplugin-theme-intencitycolor-high-light);
624
+ }
625
+
626
+ .wuiplugin-themes.dark {
627
+ color-scheme: dark;
628
+ --wuiplugin-theme-graycolor-max: var(--wuiplugin-theme-graycolor-max-dark);
629
+ --wuiplugin-theme-graycolor-high: var(--wuiplugin-theme-graycolor-high-dark);
630
+ --wuiplugin-theme-graycolor-half: var(--wuiplugin-theme-graycolor-half-dark);
631
+ --wuiplugin-theme-graycolor-low: var(--wuiplugin-theme-graycolor-low-dark);
632
+ --wuiplugin-theme-graycolor-min: var(--wuiplugin-theme-graycolor-min-dark);
633
+ --wuiplugin-theme-shadowcolor-low: var(--wuiplugin-theme-shadowcolor-low-dark);
634
+ --wuiplugin-theme-shadowcolor-high: var(--wuiplugin-theme-shadowcolor-high-dark);
635
+ --wuiplugin-theme-bordercolor-max: var(--wuiplugin-theme-bordercolor-max-dark);
636
+ --wuiplugin-theme-bordercolor-high: var(--wuiplugin-theme-bordercolor-high-dark);
637
+ --wuiplugin-theme-bordercolor-low: var(--wuiplugin-theme-bordercolor-low-dark);
638
+ --wuiplugin-theme-bgcolor-highcontrast: var(--wuiplugin-theme-bgcolor-highcontrast-dark);
639
+ --wuiplugin-theme-bgcolor-overlay: var(--wuiplugin-theme-bgcolor-overlay-dark);
640
+ --wuiplugin-theme-bgcolor-box: var(--wuiplugin-theme-bgcolor-box-dark);
641
+ --wuiplugin-theme-bgcolor-out: var(--wuiplugin-theme-bgcolor-out-dark);
642
+ --wuiplugin-theme-bgcolor-over: var(--wuiplugin-theme-bgcolor-over-dark);
643
+ --wuiplugin-theme-bgcolor-scroll: var(--wuiplugin-theme-bgcolor-scroll-dark);
644
+ --wuiplugin-theme-bgcolor-icon: var(--wuiplugin-theme-bgcolor-icon-dark);
645
+ --wuiplugin-theme-textcolor-title: var(--wuiplugin-theme-textcolor-title-dark);
646
+ --wuiplugin-theme-textcolor-active: var(--wuiplugin-theme-textcolor-active-dark);
647
+ --wuiplugin-theme-textcolor-focus: var(--wuiplugin-theme-textcolor-focus-dark);
648
+ --wuiplugin-theme-utilitycolor-hightlight: var(--wuiplugin-theme-utilitycolor-hightlight-dark);
649
+ --wuiplugin-theme-utilitycolor-warning: var(--wuiplugin-theme-utilitycolor-warning-dark);
650
+ --wuiplugin-theme-utilitycolor-disabled: var(--wuiplugin-theme-utilitycolor-disabled-dark);
651
+ --wuiplugin-theme-intencitycolor-low: var(--wuiplugin-theme-intencitycolor-low-dark);
652
+ --wuiplugin-theme-intencitycolor-half: var(--wuiplugin-theme-intencitycolor-half-dark);
653
+ --wuiplugin-theme-intencitycolor-high: var(--wuiplugin-theme-intencitycolor-high-dark);
654
+ }
655
+
656
+ .wuiplugin-themes.transition,
657
+ .wuiplugin-themes.transition * {
658
+ --delay: var(--wuiplugin-theme-transition-delay);
659
+ --transition: background-color var(--delay) ease;
660
+ -webkit-transition: var(--transition) !important;
661
+ -moz-transition: var(--transition) !important;
662
+ transition: var(--transition) !important;
663
+ }