@clayui/css 3.81.0 → 3.82.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 (39) hide show
  1. package/lib/css/atlas.css +440 -95
  2. package/lib/css/atlas.css.map +1 -1
  3. package/lib/css/base.css +435 -90
  4. package/lib/css/base.css.map +1 -1
  5. package/lib/css/cadmin.css +341 -124
  6. package/lib/css/cadmin.css.map +1 -1
  7. package/lib/images/icons/icons.svg +1 -1
  8. package/package.json +2 -2
  9. package/src/scss/_license-text.scss +1 -1
  10. package/src/scss/atlas/variables/_clay-color.scss +23 -9
  11. package/src/scss/atlas/variables/_date-picker.scss +31 -13
  12. package/src/scss/atlas/variables/_modals.scss +60 -28
  13. package/src/scss/atlas/variables/_panels.scss +3 -3
  14. package/src/scss/atlas/variables/_tbar.scss +7 -3
  15. package/src/scss/atlas/variables/_time.scss +3 -1
  16. package/src/scss/cadmin/components/_utilities.scss +22 -0
  17. package/src/scss/cadmin/variables/_cards.scss +48 -19
  18. package/src/scss/cadmin/variables/_clay-color.scss +17 -7
  19. package/src/scss/cadmin/variables/_date-picker.scss +42 -22
  20. package/src/scss/cadmin/variables/_modals.scss +60 -28
  21. package/src/scss/cadmin/variables/_sheets.scss +9 -5
  22. package/src/scss/cadmin/variables/_tbar.scss +177 -91
  23. package/src/scss/cadmin/variables/_time.scss +6 -2
  24. package/src/scss/cadmin/variables/_utilities.scss +21 -6
  25. package/src/scss/components/_progress-bars.scss +29 -2
  26. package/src/scss/components/_utilities.scss +22 -0
  27. package/src/scss/mixins/_globals.scss +2 -0
  28. package/src/scss/mixins/_input-groups.scss +6 -2
  29. package/src/scss/mixins/_modals.scss +8 -4
  30. package/src/scss/mixins/_panels.scss +4 -4
  31. package/src/scss/mixins/_tbar.scss +116 -28
  32. package/src/scss/variables/_clay-color.scss +13 -7
  33. package/src/scss/variables/_date-picker.scss +38 -18
  34. package/src/scss/variables/_forms.scss +7 -3
  35. package/src/scss/variables/_modals.scss +60 -28
  36. package/src/scss/variables/_panels.scss +8 -8
  37. package/src/scss/variables/_progress-bars.scss +24 -8
  38. package/src/scss/variables/_tbar.scss +168 -87
  39. package/src/scss/variables/_utilities.scss +17 -2
package/src/scss/cadmin/variables/_clay-color.scss CHANGED
@@ -94,10 +94,18 @@ $cadmin-clay-color-dropdown-menu-close: map-deep-merge(
94
94
  color: $cadmin-gray-600,
95
95
  font-size: 16px,
96
96
  opacity: 1,
97
- hover-bg: rgba($cadmin-gray-900, 0.03),
98
- focus-bg: rgba($cadmin-gray-900, 0.03),
99
- active-bg: rgba($cadmin-gray-900, 0.06),
100
- disabled-bg: transparent,
97
+ hover: (
98
+ background-color: rgba($cadmin-gray-900, 0.03),
99
+ ),
100
+ focus: (
101
+ background-color: rgba($cadmin-gray-900, 0.03),
102
+ ),
103
+ active: (
104
+ background-color: rgba($cadmin-gray-900, 0.06),
105
+ ),
106
+ disabled: (
107
+ background-color: transparent,
108
+ ),
101
109
  ),
102
110
  $cadmin-clay-color-dropdown-menu-close
103
111
  );
@@ -164,7 +172,7 @@ $cadmin-clay-color-btn-bordered: map-deep-merge(
164
172
  $cadmin-clay-color-pointer: () !default;
165
173
  $cadmin-clay-color-pointer: map-deep-merge(
166
174
  (
167
- bg: transparent,
175
+ background-color: transparent,
168
176
  border-radius: 100px,
169
177
  border-color: $cadmin-white,
170
178
  border-style: solid,
@@ -177,8 +185,10 @@ $cadmin-clay-color-pointer: map-deep-merge(
177
185
  position: absolute,
178
186
  transition: box-shadow 0.15s ease-in-out,
179
187
  width: 14px,
180
- focus-box-shadow: 0 0 0 2px $cadmin-primary-l1,
181
- focus-outline: 0,
188
+ focus: (
189
+ box-shadow: 0 0 0 2px $cadmin-primary-l1,
190
+ outline: 0,
191
+ ),
182
192
  ),
183
193
  $cadmin-clay-color-pointer
184
194
  );
package/src/scss/cadmin/variables/_date-picker.scss CHANGED
@@ -31,15 +31,23 @@ $cadmin-date-picker-nav-btn: map-deep-merge(
31
31
  (
32
32
  color: $cadmin-gray-600,
33
33
  transition: $cadmin-component-transition,
34
- hover-bg: $cadmin-gray-200,
35
- hover-color: $cadmin-gray-900,
36
- focus-bg: $cadmin-gray-200,
37
- focus-box-shadow: $cadmin-component-focus-box-shadow,
38
- focus-color: $cadmin-gray-900,
39
- active-bg: $cadmin-gray-200,
40
- disabled-bg: transparent,
41
- disabled-box-shadow: none,
42
- disabled-color: $cadmin-gray-500,
34
+ hover: (
35
+ background-color: $cadmin-gray-200,
36
+ color: $cadmin-gray-900,
37
+ ),
38
+ focus: (
39
+ background-color: $cadmin-gray-200,
40
+ box-shadow: $cadmin-component-focus-box-shadow,
41
+ color: $cadmin-gray-900,
42
+ ),
43
+ active: (
44
+ background-color: $cadmin-gray-200,
45
+ ),
46
+ disabled: (
47
+ background-color: transparent,
48
+ box-shadow: none,
49
+ color: $cadmin-gray-500,
50
+ ),
43
51
  ),
44
52
  $cadmin-date-picker-nav-btn
45
53
  );
@@ -199,7 +207,8 @@ $cadmin-date-picker-calendar-item: () !default;
199
207
  $cadmin-date-picker-calendar-item: map-deep-merge(
200
208
  (
201
209
  align-items: center,
202
- bg: transparent,
210
+ background-color:
211
+ setter(map-get($cadmin-date-picker-calendar-item, bg) transparent),
203
212
  border-width: 0,
204
213
  disabled-cursor: $cadmin-disabled-cursor,
205
214
  display: inline-flex,
@@ -230,17 +239,25 @@ $cadmin-date-picker-date: map-deep-merge(
230
239
  color: $cadmin-gray-600,
231
240
  cursor: $cadmin-link-cursor,
232
241
  position: relative,
233
- hover-bg: $cadmin-gray-200,
234
- hover-color: $cadmin-gray-900,
235
- focus-bg: $cadmin-gray-200,
236
- focus-box-shadow: $cadmin-component-focus-box-shadow,
237
- focus-color: $cadmin-gray-900,
238
- focus-outline: 0,
239
- active-bg: $cadmin-component-active-bg,
240
- active-color: $cadmin-component-active-color,
241
- disabled-bg: transparent,
242
- disabled-box-shadow: none,
243
- disabled-color: $cadmin-gray-500,
242
+ hover: (
243
+ background-color: $cadmin-gray-200,
244
+ color: $cadmin-gray-900,
245
+ ),
246
+ focus: (
247
+ background-color: $cadmin-gray-200,
248
+ box-shadow: $cadmin-component-focus-box-shadow,
249
+ color: $cadmin-gray-900,
250
+ outline: 0,
251
+ ),
252
+ active: (
253
+ background-color: $cadmin-component-active-bg,
254
+ color: $cadmin-component-active-color,
255
+ ),
256
+ disabled: (
257
+ background-color: transparent,
258
+ box-shadow: none,
259
+ color: $cadmin-gray-500,
260
+ ),
244
261
  ),
245
262
  $cadmin-date-picker-date
246
263
  );
@@ -266,7 +283,10 @@ $cadmin-date-picker-next-month-date: map-deep-merge(
266
283
  $cadmin-date-picker-input-group-text: () !default;
267
284
  $cadmin-date-picker-input-group-text: map-deep-merge(
268
285
  (
269
- bg: transparent,
286
+ background-color:
287
+ setter(
288
+ map-get($cadmin-date-picker-input-group-text, bg) transparent
289
+ ),
270
290
  border-color: transparent,
271
291
  min-width: 32px,
272
292
  padding-left: 4px,
package/src/scss/cadmin/variables/_modals.scss CHANGED
@@ -262,14 +262,22 @@ $cadmin-modal-height-full-modal-content-sm-up: map-merge(
262
262
  $cadmin-modal-success: () !default;
263
263
  $cadmin-modal-success: map-deep-merge(
264
264
  (
265
- header-bg: $cadmin-success-l2,
266
- header-border-color: $cadmin-success-l1,
267
- header-color: $cadmin-success,
268
- header-close: (
265
+ modal-header: (
266
+ background-color: $cadmin-success-l2,
267
+ border-color: $cadmin-success-l1,
269
268
  color: $cadmin-success,
270
- hover-color: inherit,
271
- focus-color: inherit,
272
- disabled-color: inherit,
269
+ close: (
270
+ color: $cadmin-success,
271
+ hover: (
272
+ color: inherit,
273
+ ),
274
+ focus: (
275
+ color: inherit,
276
+ ),
277
+ disabled: (
278
+ color: inherit,
279
+ ),
280
+ ),
273
281
  ),
274
282
  ),
275
283
  $cadmin-modal-success
@@ -280,14 +288,22 @@ $cadmin-modal-success: map-deep-merge(
280
288
  $cadmin-modal-info: () !default;
281
289
  $cadmin-modal-info: map-deep-merge(
282
290
  (
283
- header-bg: $cadmin-info-l2,
284
- header-border-color: $cadmin-info-l1,
285
- header-color: $cadmin-info,
286
- header-close: (
291
+ modal-header: (
292
+ background-color: $cadmin-info-l2,
293
+ border-color: $cadmin-info-l1,
287
294
  color: $cadmin-info,
288
- hover-color: inherit,
289
- focus-color: inherit,
290
- disabled-color: inherit,
295
+ close: (
296
+ color: $cadmin-info,
297
+ hover: (
298
+ color: inherit,
299
+ ),
300
+ focus: (
301
+ color: inherit,
302
+ ),
303
+ disabled: (
304
+ color: inherit,
305
+ ),
306
+ ),
291
307
  ),
292
308
  ),
293
309
  $cadmin-modal-info
@@ -298,14 +314,22 @@ $cadmin-modal-info: map-deep-merge(
298
314
  $cadmin-modal-warning: () !default;
299
315
  $cadmin-modal-warning: map-deep-merge(
300
316
  (
301
- header-bg: $cadmin-warning-l2,
302
- header-border-color: $cadmin-warning-l1,
303
- header-color: $cadmin-warning,
304
- header-close: (
317
+ modal-header: (
318
+ background-color: $cadmin-warning-l2,
319
+ border-color: $cadmin-warning-l1,
305
320
  color: $cadmin-warning,
306
- hover-color: inherit,
307
- focus-color: inherit,
308
- disabled-color: inherit,
321
+ close: (
322
+ color: $cadmin-warning,
323
+ hover: (
324
+ color: inherit,
325
+ ),
326
+ focus: (
327
+ color: inherit,
328
+ ),
329
+ disabled: (
330
+ color: inherit,
331
+ ),
332
+ ),
309
333
  ),
310
334
  ),
311
335
  $cadmin-modal-warning
@@ -316,14 +340,22 @@ $cadmin-modal-warning: map-deep-merge(
316
340
  $cadmin-modal-danger: () !default;
317
341
  $cadmin-modal-danger: map-deep-merge(
318
342
  (
319
- header-bg: $cadmin-danger-l2,
320
- header-border-color: $cadmin-danger-l1,
321
- header-color: $cadmin-danger,
322
- header-close: (
343
+ modal-header: (
344
+ background-color: $cadmin-danger-l2,
345
+ border-color: $cadmin-danger-l1,
323
346
  color: $cadmin-danger,
324
- hover-color: inherit,
325
- focus-color: inherit,
326
- disabled-color: inherit,
347
+ close: (
348
+ color: $cadmin-danger,
349
+ hover: (
350
+ color: inherit,
351
+ ),
352
+ focus: (
353
+ color: inherit,
354
+ ),
355
+ disabled: (
356
+ color: inherit,
357
+ ),
358
+ ),
327
359
  ),
328
360
  ),
329
361
  $cadmin-modal-danger
package/src/scss/cadmin/variables/_sheets.scss CHANGED
@@ -125,11 +125,15 @@ $cadmin-sheet-subtitle-link: map-deep-merge(
125
125
  color: $cadmin-sheet-subtitle-link-color,
126
126
  text-decoration: $cadmin-sheet-subtitle-link-text-decoration,
127
127
  transition: box-shadow 0.15s ease-in-out,
128
- hover-color: $cadmin-sheet-subtitle-link-hover-color,
129
- hover-text-decoration: $cadmin-sheet-subtitle-link-hover-text-decoration,
130
- focus-box-shadow: #{0 0 0 4px $cadmin-white,
131
- 0 0 0 6px $cadmin-primary-l1},
132
- focus-outline: 0,
128
+ hover: (
129
+ color: $cadmin-sheet-subtitle-link-hover-color,
130
+ text-decoration: $cadmin-sheet-subtitle-link-hover-text-decoration,
131
+ ),
132
+ focus: (
133
+ box-shadow: #{0 0 0 4px $cadmin-white,
134
+ 0 0 0 6px $cadmin-primary-l1},
135
+ outline: 0,
136
+ ),
133
137
  ),
134
138
  $cadmin-sheet-subtitle-link
135
139
  );