@clayui/css 3.60.0 → 3.61.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 (26) hide show
  1. package/lib/css/atlas.css +1562 -300
  2. package/lib/css/atlas.css.map +1 -1
  3. package/lib/css/base.css +1084 -187
  4. package/lib/css/base.css.map +1 -1
  5. package/lib/css/cadmin.css +1274 -269
  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/_globals.scss +10 -30
  11. package/src/scss/atlas/variables/_sidebar.scss +27 -17
  12. package/src/scss/cadmin/components/_side-navigation.scss +3 -0
  13. package/src/scss/cadmin/components/_sidebar.scss +10 -10
  14. package/src/scss/cadmin/variables/_globals.scss +10 -30
  15. package/src/scss/cadmin/variables/_loaders.scss +5 -2
  16. package/src/scss/cadmin/variables/_sidebar.scss +140 -54
  17. package/src/scss/components/_side-navigation.scss +2 -0
  18. package/src/scss/components/_sidebar.scss +10 -10
  19. package/src/scss/functions/_global-functions.scss +31 -0
  20. package/src/scss/mixins/_alerts.scss +26 -0
  21. package/src/scss/mixins/_panels.scss +282 -272
  22. package/src/scss/mixins/_sidebar.scss +311 -185
  23. package/src/scss/mixins/_stickers.scss +143 -134
  24. package/src/scss/variables/_globals.scss +7 -21
  25. package/src/scss/variables/_loaders.scss +5 -2
  26. package/src/scss/variables/_sidebar.scss +123 -44
package/src/scss/mixins/_panels.scss CHANGED
@@ -56,306 +56,316 @@
56
56
  /// - Add @link to documentation
57
57
 
58
58
  @mixin clay-panel-variant($map) {
59
- $enabled: setter(map-get($map, enabled), true);
59
+ @if (type-of($map) == 'map') {
60
+ $enabled: setter(map-get($map, enabled), true);
60
61
 
61
- $base: map-merge(
62
- $map,
63
- (
64
- background-color:
65
- setter(map-get($map, bg), map-get($map, background-color)),
66
- )
67
- );
62
+ $base: map-merge(
63
+ $map,
64
+ (
65
+ background-color:
66
+ setter(map-get($map, bg), map-get($map, background-color)),
67
+ )
68
+ );
68
69
 
69
- $header: setter(map-get($map, header), ());
70
- $header: map-merge(
71
- $header,
72
- (
73
- background-color:
74
- setter(
75
- map-get($map, header-bg),
76
- map-get($header, background-color)
77
- ),
78
- border-color:
79
- setter(
80
- map-get($map, header-border-color),
81
- map-get($header, border-color)
82
- ),
83
- border-style:
84
- setter(
85
- map-get($map, header-border-style),
86
- map-get($header, border-style)
87
- ),
88
- border-width:
89
- setter(
90
- map-get($map, header-border-width),
91
- map-get($header, border-width)
92
- ),
93
- color: setter(map-get($map, header-color), map-get($header, color)),
94
- margin-bottom:
95
- setter(
96
- map-get($map, header-margin-bottom),
97
- map-get($header, margin-bottom)
98
- ),
99
- margin-left:
100
- setter(
101
- map-get($map, header-margin-left),
102
- map-get($header, margin-left)
103
- ),
104
- margin-right:
105
- setter(
106
- map-get($map, header-margin-right),
107
- map-get($header, margin-right)
108
- ),
109
- margin-top:
110
- setter(
111
- map-get($map, header-margin-top),
112
- map-get($header, margin-top)
113
- ),
114
- padding-bottom:
115
- setter(
116
- map-get($map, header-padding-bottom),
117
- map-get($header, padding-bottom)
118
- ),
119
- padding-left:
120
- setter(
121
- map-get($map, header-padding-left),
122
- map-get($header, padding-left)
123
- ),
124
- padding-right:
125
- setter(
126
- map-get($map, header-padding-right),
127
- map-get($header, padding-right)
128
- ),
129
- padding-top:
130
- setter(
131
- map-get($map, header-padding-top),
132
- map-get($header, padding-top)
133
- ),
134
- transition:
135
- setter(
136
- map-get($map, header-transition),
137
- map-get($header, transition)
138
- ),
139
- )
140
- );
70
+ $header: setter(map-get($map, header), ());
71
+ $header: map-merge(
72
+ $header,
73
+ (
74
+ background-color:
75
+ setter(
76
+ map-get($map, header-bg),
77
+ map-get($header, background-color)
78
+ ),
79
+ border-color:
80
+ setter(
81
+ map-get($map, header-border-color),
82
+ map-get($header, border-color)
83
+ ),
84
+ border-style:
85
+ setter(
86
+ map-get($map, header-border-style),
87
+ map-get($header, border-style)
88
+ ),
89
+ border-width:
90
+ setter(
91
+ map-get($map, header-border-width),
92
+ map-get($header, border-width)
93
+ ),
94
+ color:
95
+ setter(
96
+ map-get($map, header-color),
97
+ map-get($header, color)
98
+ ),
99
+ margin-bottom:
100
+ setter(
101
+ map-get($map, header-margin-bottom),
102
+ map-get($header, margin-bottom)
103
+ ),
104
+ margin-left:
105
+ setter(
106
+ map-get($map, header-margin-left),
107
+ map-get($header, margin-left)
108
+ ),
109
+ margin-right:
110
+ setter(
111
+ map-get($map, header-margin-right),
112
+ map-get($header, margin-right)
113
+ ),
114
+ margin-top:
115
+ setter(
116
+ map-get($map, header-margin-top),
117
+ map-get($header, margin-top)
118
+ ),
119
+ padding-bottom:
120
+ setter(
121
+ map-get($map, header-padding-bottom),
122
+ map-get($header, padding-bottom)
123
+ ),
124
+ padding-left:
125
+ setter(
126
+ map-get($map, header-padding-left),
127
+ map-get($header, padding-left)
128
+ ),
129
+ padding-right:
130
+ setter(
131
+ map-get($map, header-padding-right),
132
+ map-get($header, padding-right)
133
+ ),
134
+ padding-top:
135
+ setter(
136
+ map-get($map, header-padding-top),
137
+ map-get($header, padding-top)
138
+ ),
139
+ transition:
140
+ setter(
141
+ map-get($map, header-transition),
142
+ map-get($header, transition)
143
+ ),
144
+ )
145
+ );
141
146
 
142
- $old-header-collapsed: setter(map-get($map, header-collapsed), ());
143
- $header-collapsed: setter(map-get($header, collapsed), ());
144
- $header-collapsed: map-merge($header-collapsed, $old-header-collapsed);
145
- $header-collapsed: map-merge(
146
- $header-collapsed,
147
- (
148
- border-color:
149
- setter(
150
- map-get($map, header-collapsed-border-color),
151
- map-get($header-collapsed, border-color)
152
- ),
153
- )
154
- );
147
+ $old-header-collapsed: setter(map-get($map, header-collapsed), ());
148
+ $header-collapsed: setter(map-get($header, collapsed), ());
149
+ $header-collapsed: map-merge($header-collapsed, $old-header-collapsed);
150
+ $header-collapsed: map-merge(
151
+ $header-collapsed,
152
+ (
153
+ border-color:
154
+ setter(
155
+ map-get($map, header-collapsed-border-color),
156
+ map-get($header-collapsed, border-color)
157
+ ),
158
+ )
159
+ );
155
160
 
156
- $old-header-c-inner: setter(map-get($map, header-c-inner), ());
157
- $header-c-inner: setter(map-get($header, c-inner), ());
158
- $header-c-inner: map-merge(
159
- (
160
- enabled:
161
- setter(
162
- if(
163
- variable-exists(enable-c-inner),
164
- $enable-c-inner,
165
- $cadmin-enable-c-inner
166
- ),
167
- true
168
- ),
169
- margin-bottom: math-sign(map-get($header, padding-bottom)),
170
- margin-left: math-sign(map-get($header, padding-left)),
171
- margin-right: math-sign(map-get($header, padding-right)),
172
- margin-top: math-sign(map-get($header, padding-top)),
173
- ),
174
- $header-c-inner
175
- );
161
+ $old-header-c-inner: setter(map-get($map, header-c-inner), ());
162
+ $header-c-inner: setter(map-get($header, c-inner), ());
163
+ $header-c-inner: map-merge(
164
+ (
165
+ enabled:
166
+ setter(
167
+ if(
168
+ variable-exists(enable-c-inner),
169
+ $enable-c-inner,
170
+ $cadmin-enable-c-inner
171
+ ),
172
+ true
173
+ ),
174
+ margin-bottom: math-sign(map-get($header, padding-bottom)),
175
+ margin-left: math-sign(map-get($header, padding-left)),
176
+ margin-right: math-sign(map-get($header, padding-right)),
177
+ margin-top: math-sign(map-get($header, padding-top)),
178
+ ),
179
+ $header-c-inner
180
+ );
176
181
 
177
- $old-header-link: setter(map-get($map, header-link), ());
178
- $header-link: setter(map-get($header, link), ());
179
- $header-link: map-deep-merge($header-link, $old-header-link);
182
+ $old-header-link: setter(map-get($map, header-link), ());
183
+ $header-link: setter(map-get($header, link), ());
184
+ $header-link: map-deep-merge($header-link, $old-header-link);
180
185
 
181
- $title: setter(map-get($map, title), ());
182
- $title: map-merge(
183
- $title,
184
- (
185
- font-size:
186
- setter(
187
- map-get($map, title-font-size),
188
- map-get($title, font-size)
189
- ),
190
- font-weight:
191
- setter(
192
- map-get($map, title-font-weight),
193
- map-get($title, font-weight)
194
- ),
195
- text-transform:
196
- setter(
197
- map-get($map, title-text-transform),
198
- map-get($title, text-transform)
199
- ),
200
- )
201
- );
186
+ $title: setter(map-get($map, title), ());
187
+ $title: map-merge(
188
+ $title,
189
+ (
190
+ font-size:
191
+ setter(
192
+ map-get($map, title-font-size),
193
+ map-get($title, font-size)
194
+ ),
195
+ font-weight:
196
+ setter(
197
+ map-get($map, title-font-weight),
198
+ map-get($title, font-weight)
199
+ ),
200
+ text-transform:
201
+ setter(
202
+ map-get($map, title-text-transform),
203
+ map-get($title, text-transform)
204
+ ),
205
+ )
206
+ );
202
207
 
203
- $collapse-icon: setter(map-get($map, collapse-icon), ());
204
- $collapse-icon: map-merge(
205
- $collapse-icon,
206
- (
207
- bottom:
208
- setter(
209
- map-get($map, collapse-icon-bottom),
210
- map-get($collapse-icon, bottom)
211
- ),
212
- font-size:
213
- setter(
214
- map-get($map, collapse-icon-font-size),
215
- map-get($collapse-icon, font-size)
216
- ),
217
- left:
218
- setter(
219
- map-get($map, collapse-icon-left),
220
- map-get($collapse-icon, left)
221
- ),
222
- right:
223
- setter(
224
- map-get($map, collapse-icon-right),
225
- map-get($collapse-icon, right)
226
- ),
227
- top:
228
- setter(
229
- map-get($map, collapse-icon-top),
230
- map-get($collapse-icon, top)
231
- ),
232
- )
233
- );
208
+ $collapse-icon: setter(map-get($map, collapse-icon), ());
209
+ $collapse-icon: map-merge(
210
+ $collapse-icon,
211
+ (
212
+ bottom:
213
+ setter(
214
+ map-get($map, collapse-icon-bottom),
215
+ map-get($collapse-icon, bottom)
216
+ ),
217
+ font-size:
218
+ setter(
219
+ map-get($map, collapse-icon-font-size),
220
+ map-get($collapse-icon, font-size)
221
+ ),
222
+ left:
223
+ setter(
224
+ map-get($map, collapse-icon-left),
225
+ map-get($collapse-icon, left)
226
+ ),
227
+ right:
228
+ setter(
229
+ map-get($map, collapse-icon-right),
230
+ map-get($collapse-icon, right)
231
+ ),
232
+ top:
233
+ setter(
234
+ map-get($map, collapse-icon-top),
235
+ map-get($collapse-icon, top)
236
+ ),
237
+ )
238
+ );
234
239
 
235
- $body: setter(map-get($map, body), ());
236
- $body: map-merge(
237
- $body,
238
- (
239
- margin-bottom:
240
- setter(
241
- map-get($map, body-margin-bottom),
242
- map-get($body, margin-bottom)
243
- ),
244
- margin-left:
245
- setter(
246
- map-get($map, body-margin-left),
247
- map-get($body, margin-left)
248
- ),
249
- margin-right:
250
- setter(
251
- map-get($map, body-margin-right),
252
- map-get($body, margin-right)
253
- ),
254
- margin-top:
255
- setter(
256
- map-get($map, body-margin-top),
257
- map-get($body, margin-top)
258
- ),
259
- padding-bottom:
260
- setter(
261
- map-get($map, body-padding-bottom),
262
- map-get($body, padding-bottom)
263
- ),
264
- padding-left:
265
- setter(
266
- map-get($map, body-padding-left),
267
- map-get($body, padding-left)
268
- ),
269
- padding-right:
270
- setter(
271
- map-get($map, body-padding-right),
272
- map-get($body, padding-right)
273
- ),
274
- padding-top:
275
- setter(
276
- map-get($map, body-padding-top),
277
- map-get($body, padding-top)
278
- ),
279
- )
280
- );
240
+ $body: setter(map-get($map, body), ());
241
+ $body: map-merge(
242
+ $body,
243
+ (
244
+ margin-bottom:
245
+ setter(
246
+ map-get($map, body-margin-bottom),
247
+ map-get($body, margin-bottom)
248
+ ),
249
+ margin-left:
250
+ setter(
251
+ map-get($map, body-margin-left),
252
+ map-get($body, margin-left)
253
+ ),
254
+ margin-right:
255
+ setter(
256
+ map-get($map, body-margin-right),
257
+ map-get($body, margin-right)
258
+ ),
259
+ margin-top:
260
+ setter(
261
+ map-get($map, body-margin-top),
262
+ map-get($body, margin-top)
263
+ ),
264
+ padding-bottom:
265
+ setter(
266
+ map-get($map, body-padding-bottom),
267
+ map-get($body, padding-bottom)
268
+ ),
269
+ padding-left:
270
+ setter(
271
+ map-get($map, body-padding-left),
272
+ map-get($body, padding-left)
273
+ ),
274
+ padding-right:
275
+ setter(
276
+ map-get($map, body-padding-right),
277
+ map-get($body, padding-right)
278
+ ),
279
+ padding-top:
280
+ setter(
281
+ map-get($map, body-padding-top),
282
+ map-get($body, padding-top)
283
+ ),
284
+ )
285
+ );
281
286
 
282
- $footer: setter(map-get($map, footer), ());
283
- $footer: map-merge(
284
- $footer,
285
- (
286
- background-color:
287
- setter(
288
- map-get($map, footer-bg),
289
- map-get($footer, background-color)
290
- ),
291
- border-color:
292
- setter(
293
- map-get($map, footer-border-color),
294
- map-get($footer, border-color)
295
- ),
296
- color: setter(map-get($map, footer-color), map-get($footer, color)),
297
- )
298
- );
287
+ $footer: setter(map-get($map, footer), ());
288
+ $footer: map-merge(
289
+ $footer,
290
+ (
291
+ background-color:
292
+ setter(
293
+ map-get($map, footer-bg),
294
+ map-get($footer, background-color)
295
+ ),
296
+ border-color:
297
+ setter(
298
+ map-get($map, footer-border-color),
299
+ map-get($footer, border-color)
300
+ ),
301
+ color:
302
+ setter(
303
+ map-get($map, footer-color),
304
+ map-get($footer, color)
305
+ ),
306
+ )
307
+ );
299
308
 
300
- @if ($enabled) {
301
- @include clay-css($base);
309
+ @if ($enabled) {
310
+ @include clay-css($base);
302
311
 
303
- .panel-header {
304
- @include clay-css($header);
312
+ .panel-header {
313
+ @include clay-css($header);
305
314
 
306
- @if (map-get($header-c-inner, enabled)) {
307
- .c-inner {
308
- @include clay-css($header-c-inner);
315
+ @if (map-get($header-c-inner, enabled)) {
316
+ .c-inner {
317
+ @include clay-css($header-c-inner);
318
+ }
309
319
  }
310
- }
311
320
 
312
- &.collapsed {
313
- @include clay-css($header-collapsed);
314
- }
321
+ &.collapsed {
322
+ @include clay-css($header-collapsed);
323
+ }
315
324
 
316
- &.panel-header-link {
317
- @include clay-link($header-link);
318
- }
325
+ &.panel-header-link {
326
+ @include clay-link($header-link);
327
+ }
319
328
 
320
- &:not(.collapse-icon-middle) {
321
- .collapse-icon-closed,
322
- .collapse-icon-open {
323
- @include clay-css($collapse-icon);
329
+ &:not(.collapse-icon-middle) {
330
+ .collapse-icon-closed,
331
+ .collapse-icon-open {
332
+ @include clay-css($collapse-icon);
333
+ }
324
334
  }
325
- }
326
335
 
327
- .panel-group & {
328
- + .panel-collapse > .panel-body {
329
- border-color: map-get($base, border-color);
336
+ .panel-group & {
337
+ + .panel-collapse > .panel-body {
338
+ border-color: map-get($base, border-color);
339
+ }
330
340
  }
331
341
  }
332
- }
333
342
 
334
- .panel-title {
335
- @include clay-css($title);
336
- }
343
+ .panel-title {
344
+ @include clay-css($title);
345
+ }
337
346
 
338
- .panel-body {
339
- @include clay-css($body);
340
- }
347
+ .panel-body {
348
+ @include clay-css($body);
349
+ }
341
350
 
342
- .panel-footer {
343
- @include clay-css($footer);
344
- }
351
+ .panel-footer {
352
+ @include clay-css($footer);
353
+ }
345
354
 
346
- // For Focus Box Shadow
355
+ // For Focus Box Shadow
347
356
 
348
- @at-root {
349
- .panel-group.panel-group-flush & {
350
- .panel-header-link {
351
- &,
352
- &.collapsed {
353
- border-radius: map-get($header-link, border-radius);
357
+ @at-root {
358
+ .panel-group.panel-group-flush & {
359
+ .panel-header-link {
360
+ &,
361
+ &.collapsed {
362
+ border-radius: map-get($header-link, border-radius);
363
+ }
354
364
  }
355
365
  }
356
366
  }
357
- }
358
367
 
359
- @content;
368
+ @content;
369
+ }
360
370
  }
361
371
  }