css-zero 0.0.97 → 1.0.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (39) hide show
  1. checksums.yaml +4 -4
  2. data/README.md +1 -1
  3. data/app/assets/stylesheets/{borders.css → css-zero/borders.css} +3 -3
  4. data/app/assets/stylesheets/{effects.css → css-zero/effects.css} +3 -3
  5. data/app/assets/stylesheets/{filters.css → css-zero/filters.css} +3 -3
  6. data/app/assets/stylesheets/{zutilities.css → css-zero/utilities.css} +2 -2
  7. data/app/assets/stylesheets/css-zero/variables.css +9 -0
  8. data/lib/css_zero/version.rb +1 -1
  9. data/lib/generators/css_zero/add/resources.yml +3 -5
  10. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/accordion.css +1 -1
  11. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/badge.css +3 -3
  12. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/button.css +3 -4
  13. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/card.css +1 -1
  14. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/combobox.css +130 -0
  15. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/command.css +1 -1
  16. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/datepicker.css +195 -0
  17. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/flash.css +1 -1
  18. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/input.css +10 -10
  19. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/prose.css +2 -2
  20. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/switch.css +1 -2
  21. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/table.css +1 -1
  22. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/tabs.css +7 -1
  23. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/trix.css +197 -0
  24. data/lib/generators/css_zero/install/templates/app/assets/stylesheets/application.css +11 -11
  25. data/lib/generators/css_zero/install/templates/app/views/layouts/application.html.erb +10 -6
  26. data/lib/generators/css_zero/scaffold/templates/_form.html.erb.tt +0 -3
  27. metadata +17 -18
  28. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/flatpickr.css +0 -795
  29. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/tom-select.css +0 -411
  30. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/zcombobox.css +0 -124
  31. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/zdatepicker.css +0 -177
  32. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/ztrix.css +0 -170
  33. /data/app/assets/stylesheets/{animations.css → css-zero/animations.css} +0 -0
  34. /data/app/assets/stylesheets/{colors.css → css-zero/colors.css} +0 -0
  35. /data/app/assets/stylesheets/{_reset.css → css-zero/reset.css} +0 -0
  36. /data/app/assets/stylesheets/{sizes.css → css-zero/sizes.css} +0 -0
  37. /data/app/assets/stylesheets/{transform.css → css-zero/transform.css} +0 -0
  38. /data/app/assets/stylesheets/{transition.css → css-zero/transition.css} +0 -0
  39. /data/app/assets/stylesheets/{typography.css → css-zero/typography.css} +0 -0
@@ -1,411 +0,0 @@
1
- /**
2
- * tom-select.css (v2.3.1)
3
- * Copyright (c) contributors
4
- *
5
- * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this
6
- * file except in compliance with the License. You may obtain a copy of the License at:
7
- * http://www.apache.org/licenses/LICENSE-2.0
8
- *
9
- * Unless required by applicable law or agreed to in writing, software distributed under
10
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF
11
- * ANY KIND, either express or implied. See the License for the specific language
12
- * governing permissions and limitations under the License.
13
- *
14
- */
15
- .ts-control {
16
- border: 1px solid #d0d0d0;
17
- padding: 8px 8px;
18
- width: 100%;
19
- overflow: hidden;
20
- position: relative;
21
- z-index: 1;
22
- box-sizing: border-box;
23
- box-shadow: none;
24
- border-radius: 3px;
25
- display: flex;
26
- flex-wrap: wrap;
27
- }
28
- .ts-wrapper.multi.has-items .ts-control {
29
- padding: calc(8px - 2px - 0) 8px calc(8px - 2px - 3px - 0);
30
- }
31
- .full .ts-control {
32
- background-color: #fff;
33
- }
34
- .disabled .ts-control, .disabled .ts-control * {
35
- cursor: default !important;
36
- }
37
- .focus .ts-control {
38
- box-shadow: none;
39
- }
40
- .ts-control > * {
41
- vertical-align: baseline;
42
- display: inline-block;
43
- }
44
- .ts-wrapper.multi .ts-control > div {
45
- cursor: pointer;
46
- margin: 0 3px 3px 0;
47
- padding: 2px 6px;
48
- background: #f2f2f2;
49
- color: #303030;
50
- border: 0 solid #d0d0d0;
51
- }
52
- .ts-wrapper.multi .ts-control > div.active {
53
- background: #e8e8e8;
54
- color: #303030;
55
- border: 0 solid #cacaca;
56
- }
57
- .ts-wrapper.multi.disabled .ts-control > div, .ts-wrapper.multi.disabled .ts-control > div.active {
58
- color: #7d7d7d;
59
- background: white;
60
- border: 0 solid white;
61
- }
62
- .ts-control > input {
63
- flex: 1 1 auto;
64
- min-width: 7rem;
65
- display: inline-block !important;
66
- padding: 0 !important;
67
- min-height: 0 !important;
68
- max-height: none !important;
69
- max-width: 100% !important;
70
- margin: 0 !important;
71
- text-indent: 0 !important;
72
- border: 0 none !important;
73
- background: none !important;
74
- line-height: inherit !important;
75
- -webkit-user-select: auto !important;
76
- -moz-user-select: auto !important;
77
- -ms-user-select: auto !important;
78
- user-select: auto !important;
79
- box-shadow: none !important;
80
- }
81
- .ts-control > input::-ms-clear {
82
- display: none;
83
- }
84
- .ts-control > input:focus {
85
- outline: none !important;
86
- }
87
- .has-items .ts-control > input {
88
- margin: 0 4px !important;
89
- }
90
- .ts-control.rtl {
91
- text-align: right;
92
- }
93
- .ts-control.rtl.single .ts-control:after {
94
- left: 15px;
95
- right: auto;
96
- }
97
- .ts-control.rtl .ts-control > input {
98
- margin: 0 4px 0 -2px !important;
99
- }
100
- .disabled .ts-control {
101
- opacity: 0.5;
102
- background-color: #fafafa;
103
- }
104
- .input-hidden .ts-control > input {
105
- opacity: 0;
106
- position: absolute;
107
- left: -10000px;
108
- }
109
-
110
- .ts-dropdown {
111
- position: absolute;
112
- top: 100%;
113
- left: 0;
114
- width: 100%;
115
- z-index: 10;
116
- border: 1px solid #d0d0d0;
117
- background: #fff;
118
- margin: 0.25rem 0 0;
119
- border-top: 0 none;
120
- box-sizing: border-box;
121
- box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
122
- border-radius: 0 0 3px 3px;
123
- }
124
- .ts-dropdown [data-selectable] {
125
- cursor: pointer;
126
- overflow: hidden;
127
- }
128
- .ts-dropdown [data-selectable] .highlight {
129
- background: rgba(125, 168, 208, 0.2);
130
- border-radius: 1px;
131
- }
132
- .ts-dropdown .option,
133
- .ts-dropdown .optgroup-header,
134
- .ts-dropdown .no-results,
135
- .ts-dropdown .create {
136
- padding: 5px 8px;
137
- }
138
- .ts-dropdown .option, .ts-dropdown [data-disabled], .ts-dropdown [data-disabled] [data-selectable].option {
139
- cursor: inherit;
140
- opacity: 0.5;
141
- }
142
- .ts-dropdown [data-selectable].option {
143
- opacity: 1;
144
- cursor: pointer;
145
- }
146
- .ts-dropdown .optgroup:first-child .optgroup-header {
147
- border-top: 0 none;
148
- }
149
- .ts-dropdown .optgroup-header {
150
- color: #303030;
151
- background: #fff;
152
- cursor: default;
153
- }
154
- .ts-dropdown .active {
155
- background-color: #f5fafd;
156
- color: #495c68;
157
- }
158
- .ts-dropdown .active.create {
159
- color: #495c68;
160
- }
161
- .ts-dropdown .create {
162
- color: rgba(48, 48, 48, 0.5);
163
- }
164
- .ts-dropdown .spinner {
165
- display: inline-block;
166
- width: 30px;
167
- height: 30px;
168
- margin: 5px 8px;
169
- }
170
- .ts-dropdown .spinner::after {
171
- content: " ";
172
- display: block;
173
- width: 24px;
174
- height: 24px;
175
- margin: 3px;
176
- border-radius: 50%;
177
- border: 5px solid #d0d0d0;
178
- border-color: #d0d0d0 transparent #d0d0d0 transparent;
179
- animation: lds-dual-ring 1.2s linear infinite;
180
- }
181
- @keyframes lds-dual-ring {
182
- 0% {
183
- transform: rotate(0deg);
184
- }
185
- 100% {
186
- transform: rotate(360deg);
187
- }
188
- }
189
-
190
- .ts-dropdown-content {
191
- overflow: hidden auto;
192
- max-height: 200px;
193
- scroll-behavior: smooth;
194
- }
195
-
196
- .ts-wrapper.plugin-drag_drop .ts-dragging {
197
- color: transparent !important;
198
- }
199
- .ts-wrapper.plugin-drag_drop .ts-dragging > * {
200
- visibility: hidden !important;
201
- }
202
-
203
- .plugin-checkbox_options:not(.rtl) .option input {
204
- margin-right: 0.5rem;
205
- }
206
-
207
- .plugin-checkbox_options.rtl .option input {
208
- margin-left: 0.5rem;
209
- }
210
-
211
- /* stylelint-disable function-name-case */
212
- .plugin-clear_button {
213
- --ts-pr-clear-button: 1em;
214
- }
215
- .plugin-clear_button .clear-button {
216
- opacity: 0;
217
- position: absolute;
218
- top: 50%;
219
- transform: translateY(-50%);
220
- right: calc(8px - 6px);
221
- margin-right: 0 !important;
222
- background: transparent !important;
223
- transition: opacity 0.5s;
224
- cursor: pointer;
225
- }
226
- .plugin-clear_button.form-select .clear-button, .plugin-clear_button.single .clear-button {
227
- right: max(var(--ts-pr-caret), 8px);
228
- }
229
- .plugin-clear_button.focus.has-items .clear-button, .plugin-clear_button:not(.disabled):hover.has-items .clear-button {
230
- opacity: 1;
231
- }
232
-
233
- .ts-wrapper .dropdown-header {
234
- position: relative;
235
- padding: 10px 8px;
236
- border-bottom: 1px solid #d0d0d0;
237
- background: color-mix(#fff, #d0d0d0, 85%);
238
- border-radius: 3px 3px 0 0;
239
- }
240
- .ts-wrapper .dropdown-header-close {
241
- position: absolute;
242
- right: 8px;
243
- top: 50%;
244
- color: #303030;
245
- opacity: 0.4;
246
- margin-top: -12px;
247
- line-height: 20px;
248
- font-size: 20px !important;
249
- }
250
- .ts-wrapper .dropdown-header-close:hover {
251
- color: black;
252
- }
253
-
254
- .plugin-dropdown_input.focus.dropdown-active .ts-control {
255
- box-shadow: none;
256
- border: 1px solid #d0d0d0;
257
- }
258
- .plugin-dropdown_input .dropdown-input {
259
- border: 1px solid #d0d0d0;
260
- border-width: 0 0 1px;
261
- display: block;
262
- padding: 8px 8px;
263
- box-shadow: none;
264
- width: 100%;
265
- background: transparent;
266
- }
267
- .plugin-dropdown_input .items-placeholder {
268
- border: 0 none !important;
269
- box-shadow: none !important;
270
- width: 100%;
271
- }
272
- .plugin-dropdown_input.has-items .items-placeholder, .plugin-dropdown_input.dropdown-active .items-placeholder {
273
- display: none !important;
274
- }
275
-
276
- .ts-wrapper.plugin-input_autogrow.has-items .ts-control > input {
277
- min-width: 0;
278
- }
279
- .ts-wrapper.plugin-input_autogrow.has-items.focus .ts-control > input {
280
- flex: none;
281
- min-width: 4px;
282
- }
283
- .ts-wrapper.plugin-input_autogrow.has-items.focus .ts-control > input::-ms-input-placeholder {
284
- color: transparent;
285
- }
286
- .ts-wrapper.plugin-input_autogrow.has-items.focus .ts-control > input::placeholder {
287
- color: transparent;
288
- }
289
-
290
- .ts-dropdown.plugin-optgroup_columns .ts-dropdown-content {
291
- display: flex;
292
- }
293
- .ts-dropdown.plugin-optgroup_columns .optgroup {
294
- border-right: 1px solid #f2f2f2;
295
- border-top: 0 none;
296
- flex-grow: 1;
297
- flex-basis: 0;
298
- min-width: 0;
299
- }
300
- .ts-dropdown.plugin-optgroup_columns .optgroup:last-child {
301
- border-right: 0 none;
302
- }
303
- .ts-dropdown.plugin-optgroup_columns .optgroup::before {
304
- display: none;
305
- }
306
- .ts-dropdown.plugin-optgroup_columns .optgroup-header {
307
- border-top: 0 none;
308
- }
309
-
310
- .ts-wrapper.plugin-remove_button .item {
311
- display: inline-flex;
312
- align-items: center;
313
- }
314
- .ts-wrapper.plugin-remove_button .item .remove {
315
- color: inherit;
316
- text-decoration: none;
317
- vertical-align: middle;
318
- display: inline-block;
319
- padding: 0 6px;
320
- border-radius: 0 2px 2px 0;
321
- box-sizing: border-box;
322
- }
323
- .ts-wrapper.plugin-remove_button .item .remove:hover {
324
- background: rgba(0, 0, 0, 0.05);
325
- }
326
- .ts-wrapper.plugin-remove_button.disabled .item .remove:hover {
327
- background: none;
328
- }
329
- .ts-wrapper.plugin-remove_button .remove-single {
330
- position: absolute;
331
- right: 0;
332
- top: 0;
333
- font-size: 23px;
334
- }
335
-
336
- .ts-wrapper.plugin-remove_button:not(.rtl) .item {
337
- padding-right: 0 !important;
338
- }
339
- .ts-wrapper.plugin-remove_button:not(.rtl) .item .remove {
340
- border-left: 1px solid #d0d0d0;
341
- margin-left: 6px;
342
- }
343
- .ts-wrapper.plugin-remove_button:not(.rtl) .item.active .remove {
344
- border-left-color: #cacaca;
345
- }
346
- .ts-wrapper.plugin-remove_button:not(.rtl).disabled .item .remove {
347
- border-left-color: white;
348
- }
349
-
350
- .ts-wrapper.plugin-remove_button.rtl .item {
351
- padding-left: 0 !important;
352
- }
353
- .ts-wrapper.plugin-remove_button.rtl .item .remove {
354
- border-right: 1px solid #d0d0d0;
355
- margin-right: 6px;
356
- }
357
- .ts-wrapper.plugin-remove_button.rtl .item.active .remove {
358
- border-right-color: #cacaca;
359
- }
360
- .ts-wrapper.plugin-remove_button.rtl.disabled .item .remove {
361
- border-right-color: white;
362
- }
363
-
364
- :root {
365
- --ts-pr-clear-button: 0;
366
- --ts-pr-caret: 0;
367
- --ts-pr-min: .75rem;
368
- }
369
-
370
- .ts-wrapper.single .ts-control, .ts-wrapper.single .ts-control input {
371
- cursor: pointer;
372
- }
373
-
374
- .ts-control:not(.rtl) {
375
- padding-right: max(var(--ts-pr-min), var(--ts-pr-clear-button) + var(--ts-pr-caret)) !important;
376
- }
377
-
378
- .ts-control.rtl {
379
- padding-left: max(var(--ts-pr-min), var(--ts-pr-clear-button) + var(--ts-pr-caret)) !important;
380
- }
381
-
382
- .ts-wrapper {
383
- position: relative;
384
- }
385
-
386
- .ts-dropdown,
387
- .ts-control,
388
- .ts-control input {
389
- color: #303030;
390
- font-family: inherit;
391
- font-size: 13px;
392
- line-height: 18px;
393
- }
394
-
395
- .ts-control,
396
- .ts-wrapper.single.input-active .ts-control {
397
- background: #fff;
398
- cursor: text;
399
- }
400
-
401
- .ts-hidden-accessible {
402
- border: 0 !important;
403
- clip: rect(0 0 0 0) !important;
404
- -webkit-clip-path: inset(50%) !important;
405
- clip-path: inset(50%) !important;
406
- overflow: hidden !important;
407
- padding: 0 !important;
408
- position: absolute !important;
409
- width: 1px !important;
410
- white-space: nowrap !important;
411
- }
@@ -1,124 +0,0 @@
1
- .ts-control {
2
- align-items: center;
3
- background-color: var(--color-bg);
4
- border: 1px solid var(--color-border);
5
- border-radius: var(--rounded-md);
6
- min-block-size: var(--size-9);
7
- color: var(--color-text);
8
- display: inline-flex;
9
- font-size: var(--text-sm);
10
- gap: var(--size-1);
11
- line-height: inherit;
12
- padding: var(--size-1_5) var(--size-3);
13
-
14
- > input {
15
- color: inherit; font-size: inherit;
16
- }
17
- }
18
-
19
- .ts-dropdown {
20
- background-color: var(--color-bg);
21
- border: 1px solid var(--color-border);
22
- border-radius: var(--rounded-md);
23
- box-shadow: var(--shadow-md);
24
- color: var(--color-text);
25
- font-size: var(--text-sm);
26
- line-height: inherit;
27
-
28
- /* Final state of exit animation and setup */
29
- opacity: 0;
30
- transform: var(--scale-95);
31
- transition-behavior: allow-discrete;
32
- transition-duration: var(--time-150);
33
- transition-property: display, opacity, transform;
34
-
35
- /* Final state of entry animation */
36
- .dropdown-active & {
37
- opacity: 1; transform: var(--scale-100);
38
- }
39
-
40
- /* Initial state of entry animation */
41
- @starting-style {
42
- .dropdown-active & {
43
- opacity: 0; transform: var(--scale-95);
44
- }
45
- }
46
-
47
- .ts-dropdown-content:not(:has(.optgroup)) {
48
- padding: var(--size-1);
49
- }
50
-
51
- .optgroup:not(:first-child) {
52
- border-block-start-width: var(--border);
53
- }
54
-
55
- .optgroup {
56
- padding: var(--size-1);
57
- }
58
-
59
- .optgroup-header {
60
- background-color: inherit;
61
- color: var(--color-text-subtle);
62
- font-size: var(--text-xs);
63
- padding: var(--size-1_5) var(--size-2);
64
- }
65
-
66
- .create {
67
- padding: var(--size-1_5) var(--size-2);
68
- }
69
-
70
- .option {
71
- border: 1px solid transparent;
72
- border-radius: var(--rounded-md);
73
- padding: var(--size-1_5) var(--size-2);
74
- }
75
-
76
- .active {
77
- background-color: var(--color-secondary);
78
- color: inherit !important;
79
- }
80
-
81
- .highlight {
82
- background-color: transparent !important;
83
- }
84
-
85
- .spinner {
86
- margin: var(--size-1_5) 0 0;
87
- }
88
-
89
- .spinner::after {
90
- border-block-color: var(--color-border-dark);
91
- }
92
- }
93
-
94
- .ts-wrapper.single .ts-control {
95
- background-color: var(--color-bg) !important;
96
- background-image: url("select-arrow.svg") !important;
97
- background-position: center right var(--size-2) !important;
98
- background-repeat: no-repeat !important;
99
- background-size: var(--size-4) auto !important;
100
- }
101
-
102
- .ts-wrapper.multi .ts-control > .item {
103
- background: var(--color-secondary);
104
- border-radius: var(--rounded-md);
105
- color: inherit;
106
- line-height: var(--leading-tight);
107
- margin: 0;
108
- }
109
-
110
- .disabled .ts-control {
111
- opacity: var(--opacity-50);
112
- }
113
-
114
- .disabled .ts-control * {
115
- cursor: not-allowed !important;
116
- }
117
-
118
- .invalid .ts-control {
119
- border-color: var(--color-negative);
120
- }
121
-
122
- [data-controller~="combobox"] {
123
- clip: rect(0 0 0 0); position: absolute;
124
- }
@@ -1,177 +0,0 @@
1
- .input--datepicker {
2
- cursor: pointer;
3
- }
4
-
5
- .flatpickr-calendar {
6
- background: var(--color-bg);
7
- border: 1px solid var(--color-border);
8
- border-radius: var(--rounded-md);
9
- box-shadow: var(--shadow-md);
10
- font-size: var(--text-sm);
11
- inline-size: 285px;
12
- padding: var(--size-3);
13
-
14
- :is(.dayContainer, .flatpickr-days) {
15
- inline-size: 100%;
16
- min-inline-size: 100%;
17
- max-inline-size: 100%;
18
- }
19
-
20
- .flatpickr-months {
21
- > * {
22
- position: static;
23
- }
24
-
25
- .flatpickr-month {
26
- color: var(--color-text);
27
- }
28
-
29
- svg {
30
- fill: var(--color-border-dark);
31
- }
32
-
33
- .flatpickr-prev-month:hover svg {
34
- fill: var(--color-text);
35
- }
36
-
37
- .flatpickr-next-month:hover svg {
38
- fill: var(--color-text);
39
- }
40
- }
41
-
42
- .flatpickr-monthDropdown-months {
43
- appearance: none;
44
- border-radius: var(--rounded-md);
45
- font-size: var(--text-sm);
46
- font-weight: var(--font-medium);
47
- line-height: var(--leading-normal);
48
- padding: 0;
49
- text-align: center;
50
-
51
- &:hover {
52
- background: var(--color-border-light);
53
- }
54
- }
55
-
56
- .numInputWrapper {
57
- input {
58
- border-radius: var(--rounded-md);
59
- color: var(--color-text);
60
- font-size: var(--text-sm);
61
- font-weight: var(--font-medium);
62
- line-height: var(--leading-normal);
63
- padding: 0;
64
- text-align: center;
65
- }
66
-
67
- span {
68
- border-color: var(--color-border);
69
- }
70
-
71
- span:hover {
72
- background: transparent;
73
- }
74
-
75
- span.arrowUp::after {
76
- border-bottom-color: var(--color-text);
77
- }
78
-
79
- span.arrowDown::after {
80
- border-top-color: var(--color-text);
81
- }
82
-
83
- &:hover {
84
- background: transparent;
85
- }
86
- }
87
-
88
- .flatpickr-weekday {
89
- color: var(--color-text-subtle);
90
- font-weight: var(--font-normal);
91
- }
92
-
93
- .flatpickr-time {
94
- .hasTime & {
95
- border-top-color: var(--color-border);
96
- }
97
-
98
- .hasTime.noCalendar & {
99
- border: 0;
100
- }
101
-
102
- .numInput {
103
- background: transparent;
104
- color: var(--color-text);
105
- }
106
-
107
- .flatpickr-time-separator {
108
- color: var(--color-text);
109
- }
110
-
111
- .flatpickr-am-pm {
112
- background: transparent;
113
- color: var(--color-text);
114
- }
115
- }
116
-
117
- .flatpickr-day {
118
- --day-size: var(--size-9);
119
- border-radius: var(--rounded-md);
120
- border-color: transparent !important;
121
- box-shadow: none !important;
122
- color: var(--color-text);
123
- height: var(--day-size);
124
- line-height: var(--day-size);
125
- margin-block-start: 1px;
126
- max-width: var(--day-size);
127
-
128
- &:is(.inRange) {
129
- border-radius: 0;
130
- }
131
-
132
- &:is(.today, .inRange, :hover, :focus) {
133
- background: var(--color-secondary);
134
- color: var(--color-text);
135
- }
136
-
137
- &:is(
138
- .flatpickr-disabled,
139
- .flatpickr-disabled:hover,
140
- .prevMonthDay,
141
- .nextMonthDay,
142
- .notAllowed,
143
- .notAllowed.prevMonthDay,
144
- .notAllowed.nextMonthDay
145
- ) {
146
- color: var(--color-text-subtle);
147
- }
148
-
149
- &:is(
150
- .selected,
151
- .startRange,
152
- .endRange,
153
- .selected.inRange,
154
- .startRange.inRange,
155
- .endRange.inRange,
156
- .selected:focus,
157
- .startRange:focus,
158
- .endRange:focus,
159
- .selected:hover,
160
- .startRange:hover,
161
- .endRange:hover,
162
- .selected.prevMonthDay,
163
- .startRange.prevMonthDay,
164
- .endRange.prevMonthDay,
165
- .selected.nextMonthDay,
166
- .startRange.nextMonthDay,
167
- .endRange.nextMonthDay
168
- ) {
169
- background: var(--color-primary);
170
- color: var(--color-text-reversed);
171
- }
172
- }
173
-
174
- &::before, &::after {
175
- display: none;
176
- }
177
- }