@clayui/css 3.74.0 → 3.76.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 (75) hide show
  1. package/lib/css/atlas.css +1215 -626
  2. package/lib/css/atlas.css.map +1 -1
  3. package/lib/css/base.css +1263 -650
  4. package/lib/css/base.css.map +1 -1
  5. package/lib/css/cadmin.css +670 -358
  6. package/lib/css/cadmin.css.map +1 -1
  7. package/lib/images/icons/icons.svg +1 -1
  8. package/lib/images/icons/mobile-device-rules.svg +5 -7
  9. package/lib/images/icons/mobile-devices.svg +10 -0
  10. package/lib/images/icons/mobile-landscape.svg +2 -1
  11. package/lib/images/icons/mobile-portrait.svg +2 -1
  12. package/package.json +2 -2
  13. package/src/images/icons/mobile-device-rules.svg +5 -7
  14. package/src/images/icons/mobile-devices.svg +10 -0
  15. package/src/images/icons/mobile-landscape.svg +2 -1
  16. package/src/images/icons/mobile-portrait.svg +2 -1
  17. package/src/scss/_license-text.scss +1 -1
  18. package/src/scss/atlas/variables/_application-bar.scss +1 -1
  19. package/src/scss/atlas/variables/_buttons.scss +2 -3
  20. package/src/scss/atlas/variables/_dropdowns.scss +6 -2
  21. package/src/scss/atlas/variables/_globals.scss +6 -0
  22. package/src/scss/atlas/variables/_labels.scss +1 -1
  23. package/src/scss/atlas/variables/_links.scss +3 -13
  24. package/src/scss/atlas/variables/_management-bar.scss +1 -1
  25. package/src/scss/atlas/variables/_navigation-bar.scss +5 -5
  26. package/src/scss/atlas/variables/_quick-action.scss +1 -1
  27. package/src/scss/atlas/variables/_tables.scss +2 -2
  28. package/src/scss/cadmin/components/_custom-forms.scss +1 -1
  29. package/src/scss/cadmin/variables/_badges.scss +1 -1
  30. package/src/scss/cadmin/variables/_buttons.scss +2 -4
  31. package/src/scss/cadmin/variables/_cards.scss +1 -1
  32. package/src/scss/cadmin/variables/_date-picker.scss +4 -4
  33. package/src/scss/cadmin/variables/_globals.scss +6 -0
  34. package/src/scss/cadmin/variables/_labels.scss +2 -2
  35. package/src/scss/cadmin/variables/_links.scss +13 -22
  36. package/src/scss/cadmin/variables/_management-bar.scss +1 -1
  37. package/src/scss/cadmin/variables/_multi-step-nav.scss +1 -1
  38. package/src/scss/cadmin/variables/_navigation-bar.scss +5 -5
  39. package/src/scss/cadmin/variables/_quick-action.scss +1 -1
  40. package/src/scss/cadmin/variables/_tables.scss +2 -2
  41. package/src/scss/cadmin/variables/_utilities.scss +4 -4
  42. package/src/scss/components/_custom-forms.scss +1 -1
  43. package/src/scss/components/_links.scss +1 -1
  44. package/src/scss/functions/_global-functions.scss +23 -25
  45. package/src/scss/functions/_lx-icons-generated.scss +5 -3
  46. package/src/scss/mixins/_forms.scss +361 -322
  47. package/src/scss/mixins/_grid.scss +74 -67
  48. package/src/scss/mixins/_highlight.scss +91 -69
  49. package/src/scss/mixins/_list-group.scss +216 -192
  50. package/src/scss/mixins/_loaders.scss +142 -134
  51. package/src/scss/mixins/_menubar.scss +300 -296
  52. package/src/scss/mixins/_modals.scss +101 -92
  53. package/src/scss/mixins/_navbar.scss +811 -738
  54. package/src/scss/mixins/_slideout.scss +34 -30
  55. package/src/scss/mixins/_stickers.scss +30 -28
  56. package/src/scss/mixins/_tables.scss +44 -40
  57. package/src/scss/mixins/_tbar.scss +467 -425
  58. package/src/scss/mixins/_utilities.scss +41 -39
  59. package/src/scss/variables/_alerts.scss +30 -7
  60. package/src/scss/variables/_badges.scss +1 -1
  61. package/src/scss/variables/_buttons.scss +2 -3
  62. package/src/scss/variables/_cards.scss +1 -1
  63. package/src/scss/variables/_clay-color.scss +2 -2
  64. package/src/scss/variables/_date-picker.scss +4 -4
  65. package/src/scss/variables/_dropdowns.scss +6 -2
  66. package/src/scss/variables/_forms.scss +232 -44
  67. package/src/scss/variables/_globals.scss +6 -0
  68. package/src/scss/variables/_labels.scss +1 -1
  69. package/src/scss/variables/_links.scss +52 -20
  70. package/src/scss/variables/_multi-step-nav.scss +1 -1
  71. package/src/scss/variables/_navbar.scss +1 -1
  72. package/src/scss/variables/_navs.scss +25 -4
  73. package/src/scss/variables/_tables.scss +6 -1
  74. package/src/scss/variables/_tbar.scss +2 -2
  75. package/src/scss/variables/_time.scss +6 -1
package/src/scss/variables/_links.scss CHANGED
@@ -41,15 +41,27 @@ $link-secondary: map-deep-merge(
41
41
 
42
42
  /// @deprecated as of v3.4.0 use the Sass map `$link-outline` instead
43
43
 
44
- $link-outline-border-radius: $btn-border-radius !default;
44
+ $link-outline-border-radius: if(
45
+ variable-exists(btn-border-radius),
46
+ $btn-border-radius,
47
+ $border-radius
48
+ ) !default;
45
49
 
46
50
  /// @deprecated as of v3.4.0 use the Sass map `$link-outline` instead
47
51
 
48
- $link-outline-border-width: $btn-border-width !default;
52
+ $link-outline-border-width: if(
53
+ variable-exists(btn-border-width),
54
+ $btn-border-width,
55
+ $border-width
56
+ ) !default;
49
57
 
50
58
  /// @deprecated as of v3.4.0 use the Sass map `$link-outline` instead
51
59
 
52
- $link-outline-font-size: $btn-font-size-sm !default;
60
+ $link-outline-font-size: if(
61
+ variable-exists(btn-font-size-sm),
62
+ $btn-font-size-sm,
63
+ $font-size-sm
64
+ ) !default;
53
65
 
54
66
  /// @deprecated as of v3.4.0 use the Sass map `$link-outline` instead
55
67
 
@@ -57,19 +69,31 @@ $link-outline-font-weight: $font-weight-semi-bold !default;
57
69
 
58
70
  /// @deprecated as of v3.4.0 use the Sass map `$link-outline` instead
59
71
 
60
- $link-outline-line-height: $btn-line-height-sm !default;
72
+ $link-outline-line-height: if(
73
+ variable-exists(btn-line-height-sm),
74
+ $btn-line-height-sm,
75
+ $line-height-sm
76
+ ) !default;
61
77
 
62
78
  /// @deprecated as of v3.4.0 use the Sass map `$link-outline` instead
63
79
 
64
- $link-outline-padding-x: $btn-padding-x-sm !default;
80
+ $link-outline-padding-x: if(
81
+ variable-exists(btn-padding-x-sm),
82
+ $btn-padding-x-sm,
83
+ 0.5rem
84
+ ) !default;
65
85
 
66
86
  /// @deprecated as of v3.4.0 use the Sass map `$link-outline` instead
67
87
 
68
- $link-outline-padding-y: $btn-padding-y-sm !default;
88
+ $link-outline-padding-y: if(
89
+ variable-exists(btn-padding-x-sm),
90
+ $btn-padding-y-sm,
91
+ 0.25rem
92
+ ) !default;
69
93
 
70
94
  /// @deprecated as of v3.4.0 use the Sass map `$link-outline` instead
71
95
 
72
- $link-outline-transition: $btn-transition !default;
96
+ $link-outline-transition: $component-transition !default;
73
97
 
74
98
  $link-outline: () !default;
75
99
  $link-outline: map-deep-merge(
@@ -94,7 +118,12 @@ $link-outline: map-deep-merge(
94
118
  hover: (
95
119
  text-decoration: none,
96
120
  ),
121
+ focus: (
122
+ box-shadow: $component-focus-box-shadow,
123
+ outline: 0,
124
+ ),
97
125
  disabled: (
126
+ box-shadow: none,
98
127
  active: (
99
128
  pointer-events: none,
100
129
  ),
@@ -115,8 +144,6 @@ $link-outline-primary: map-deep-merge(
115
144
  background-color: $primary,
116
145
  color: $white,
117
146
  ),
118
- btn-focus-box-shadow: 0 0 0 $btn-focus-width rgba($primary, 0.5),
119
- btn-focus-outline: 0,
120
147
  active: (
121
148
  background-color: $primary,
122
149
  color: $white,
@@ -124,8 +151,8 @@ $link-outline-primary: map-deep-merge(
124
151
  disabled: (
125
152
  background-color: transparent,
126
153
  color: $primary,
127
- cursor: $btn-disabled-cursor,
128
- opacity: $btn-disabled-opacity,
154
+ cursor: $disabled-cursor,
155
+ opacity: $component-disabled-opacity,
129
156
  ),
130
157
  ),
131
158
  $link-outline-primary
@@ -140,8 +167,6 @@ $link-outline-secondary: map-deep-merge(
140
167
  background-color: $secondary,
141
168
  color: $white,
142
169
  ),
143
- btn-focus-box-shadow: 0 0 0 $btn-focus-width rgba($secondary, 0.5),
144
- btn-focus-outline: 0,
145
170
  active: (
146
171
  background-color: $secondary,
147
172
  color: $white,
@@ -149,8 +174,8 @@ $link-outline-secondary: map-deep-merge(
149
174
  disabled: (
150
175
  background-color: transparent,
151
176
  color: $secondary,
152
- cursor: $btn-disabled-cursor,
153
- opacity: $btn-disabled-opacity,
177
+ cursor: $disabled-cursor,
178
+ opacity: $component-disabled-opacity,
154
179
  ),
155
180
  ),
156
181
  $link-outline-secondary
@@ -160,7 +185,11 @@ $link-outline-secondary: map-deep-merge(
160
185
 
161
186
  /// @deprecated as of v3.4.0 use the Sass map `$link-monospaced` instead
162
187
 
163
- $link-monospaced-size: $btn-monospaced-size-sm !default;
188
+ $link-monospaced-size: if(
189
+ variable-exists(btn-monospaced-size-sm),
190
+ $btn-monospaced-size-sm,
191
+ 1.9375rem
192
+ ) !default;
164
193
 
165
194
  $link-monospaced: () !default;
166
195
  $link-monospaced: map-deep-merge(
@@ -271,24 +300,27 @@ $component-action: map-deep-merge(
271
300
  justify-content: center,
272
301
  overflow: hidden,
273
302
  padding: 0,
274
- transition: $btn-transition,
303
+ transition: $component-transition,
275
304
  vertical-align: middle,
276
305
  width: map-get($link-monospaced, width),
277
306
  hover: (
278
307
  background-color: $secondary,
279
308
  color: $white,
280
309
  ),
281
- btn-focus-box-shadow: 0 0 0 $btn-focus-width rgba($secondary, 0.5),
282
- btn-focus-outline: 0,
310
+ focus: (
311
+ box-shadow: $component-focus-box-shadow,
312
+ outline: 0,
313
+ ),
283
314
  active: (
284
315
  background-color: $secondary,
285
316
  color: $white,
286
317
  ),
287
318
  disabled: (
288
319
  background-color: transparent,
320
+ box-shadow: none,
289
321
  color: $secondary,
290
322
  cursor: $disabled-cursor,
291
- opacity: $btn-disabled-opacity,
323
+ opacity: $component-disabled-opacity,
292
324
  active: (
293
325
  pointer-events: none,
294
326
  ),
package/src/scss/variables/_multi-step-nav.scss CHANGED
@@ -23,7 +23,7 @@ $multi-step-icon-hover-color: rgba($black, 0.7) !default;
23
23
  $multi-step-icon-hover-text-decoration: none !default;
24
24
 
25
25
  $multi-step-icon-focus-bg: $multi-step-icon-hover-bg !default;
26
- $multi-step-icon-focus-box-shadow: $btn-focus-box-shadow !default;
26
+ $multi-step-icon-focus-box-shadow: $component-focus-box-shadow !default;
27
27
  $multi-step-icon-focus-color: $multi-step-icon-hover-color !default;
28
28
  $multi-step-icon-focus-outline: 0 !default;
29
29
  $multi-step-icon-focus-text-decoration: $multi-step-icon-hover-text-decoration !default;
package/src/scss/variables/_navbar.scss CHANGED
@@ -32,7 +32,7 @@ $navbar-brand-padding-y: calc(
32
32
 
33
33
  // Navbar Toggler
34
34
 
35
- $navbar-toggler-border-radius: $btn-border-radius !default;
35
+ $navbar-toggler-border-radius: $border-radius !default;
36
36
  $navbar-toggler-cursor: null !default;
37
37
  $navbar-toggler-font-size: $font-size-lg !default;
38
38
  $navbar-toggler-padding-x: 0.75rem !default;
package/src/scss/variables/_navs.scss CHANGED
@@ -68,7 +68,7 @@ $nav-btn-margin-y: calc(
68
68
 
69
69
  /// @deprecated after v3.4.0 use the Sass map `$nav-btn` instead
70
70
 
71
- $nav-btn-padding-x: $btn-padding-x-sm !default;
71
+ $nav-btn-padding-x: 0.5rem !default;
72
72
 
73
73
  /// @deprecated after v3.4.0 use the Sass map `$nav-btn` instead
74
74
 
@@ -98,7 +98,14 @@ $nav-btn: map-deep-merge(
98
98
  margin-bottom: 0,
99
99
  margin-left: math-sign($nav-btn-padding-x),
100
100
  margin-right: math-sign($nav-btn-padding-x),
101
- margin-top: math-sign($btn-border-width),
101
+ margin-top:
102
+ math-sign(
103
+ if(
104
+ variable-exists(btn-border-width),
105
+ $btn-border-width,
106
+ $border-width
107
+ )
108
+ ),
102
109
  ),
103
110
  btn-link: (
104
111
  margin-left: 0,
@@ -118,8 +125,22 @@ $nav-btn-monospaced: map-deep-merge(
118
125
  (
119
126
  padding: 0,
120
127
  c-inner: (
121
- margin-left: math-sign($btn-border-width),
122
- margin-right: math-sign($btn-border-width),
128
+ margin-left:
129
+ math-sign(
130
+ if(
131
+ variable-exists(btn-border-width),
132
+ $btn-border-width,
133
+ $border-width
134
+ )
135
+ ),
136
+ margin-right:
137
+ math-sign(
138
+ if(
139
+ variable-exists(btn-border-width),
140
+ $btn-border-width,
141
+ $border-width
142
+ )
143
+ ),
123
144
  ),
124
145
  ),
125
146
  $nav-btn-monospaced
package/src/scss/variables/_tables.scss CHANGED
@@ -207,7 +207,12 @@ $table-action-link: () !default;
207
207
  $table-action-link: map-deep-merge(
208
208
  (
209
209
  align-items: center,
210
- border-radius: $btn-border-radius,
210
+ border-radius:
211
+ if(
212
+ variable-exists(btn-border-radius),
213
+ $btn-border-radius,
214
+ $border-radius
215
+ ),
211
216
  display: inline-flex,
212
217
  height: 2rem,
213
218
  justify-content: center,
package/src/scss/variables/_tbar.scss CHANGED
@@ -326,7 +326,7 @@ $subnav-tbar-primary-component-link: map-deep-merge(
326
326
  hover-color: $gray-900,
327
327
  disabled-color: $gray-600,
328
328
  disabled-cursor: $disabled-cursor,
329
- disabled-opacity: $btn-disabled-opacity,
329
+ disabled-opacity: $component-disabled-opacity,
330
330
  disabled-text-decoration: none,
331
331
  ),
332
332
  $subnav-tbar-primary-component-link
@@ -337,7 +337,7 @@ $subnav-tbar-primary-component-label-close: map-deep-merge(
337
337
  (
338
338
  focus-color: inherit,
339
339
  disabled-color: $gray-600,
340
- disabled-opacity: $btn-disabled-opacity,
340
+ disabled-opacity: $component-disabled-opacity,
341
341
  ),
342
342
  $subnav-tbar-primary-component-label-close
343
343
  );
package/src/scss/variables/_time.scss CHANGED
@@ -89,7 +89,12 @@ $clay-time-inner-spin: map-deep-merge(
89
89
  border-color: $secondary-d1,
90
90
  border-radius: 8px,
91
91
  border-style: solid,
92
- border-width: $btn-border-width,
92
+ border-width:
93
+ if(
94
+ variable-exists(btn-border-width),
95
+ $btn-border-width,
96
+ $border-width
97
+ ),
93
98
  ),
94
99
  $clay-time-inner-spin
95
100
  );