@clayui/css 3.136.0 → 3.137.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 (47) hide show
  1. package/lib/css/atlas.css +18 -3
  2. package/lib/css/atlas.css.map +1 -1
  3. package/lib/css/base.css +18 -3
  4. package/lib/css/base.css.map +1 -1
  5. package/lib/css/cadmin.css +12 -4
  6. package/lib/css/cadmin.css.map +1 -1
  7. package/lib/images/icons/anonymize.svg +1 -0
  8. package/lib/images/icons/bell-full.svg +1 -0
  9. package/lib/images/icons/devices.svg +1 -0
  10. package/lib/images/icons/environment-connected.svg +1 -0
  11. package/lib/images/icons/environment-disconnected.svg +1 -0
  12. package/lib/images/icons/environment.svg +1 -0
  13. package/lib/images/icons/flags-bs-BA.svg +13 -0
  14. package/lib/images/icons/icons.svg +1 -1
  15. package/lib/images/icons/info-panel-closed.svg +1 -0
  16. package/lib/images/icons/info-panel-open.svg +1 -0
  17. package/lib/images/icons/paste-plaintext.svg +1 -3
  18. package/lib/images/icons/paste-word.svg +1 -3
  19. package/lib/images/icons/paste.svg +1 -3
  20. package/lib/images/icons/repeat.svg +7 -0
  21. package/lib/images/icons/send.svg +1 -0
  22. package/lib/images/icons/share-alt.svg +1 -0
  23. package/lib/images/icons/third-party.svg +1 -0
  24. package/package.json +2 -2
  25. package/src/images/icons/anonymize.svg +1 -0
  26. package/src/images/icons/bell-full.svg +1 -0
  27. package/src/images/icons/devices.svg +1 -0
  28. package/src/images/icons/environment-connected.svg +1 -0
  29. package/src/images/icons/environment-disconnected.svg +1 -0
  30. package/src/images/icons/environment.svg +1 -0
  31. package/src/images/icons/flags-bs-BA.svg +13 -0
  32. package/src/images/icons/info-panel-closed.svg +1 -0
  33. package/src/images/icons/info-panel-open.svg +1 -0
  34. package/src/images/icons/paste-plaintext.svg +1 -3
  35. package/src/images/icons/paste-word.svg +1 -3
  36. package/src/images/icons/paste.svg +1 -3
  37. package/src/images/icons/repeat.svg +7 -0
  38. package/src/images/icons/send.svg +1 -0
  39. package/src/images/icons/share-alt.svg +1 -0
  40. package/src/images/icons/third-party.svg +1 -0
  41. package/src/scss/_license-text.scss +1 -1
  42. package/src/scss/cadmin/variables/_clay-color.scss +2 -0
  43. package/src/scss/cadmin/variables/_slideout.scss +25 -2
  44. package/src/scss/components/_slideout.scss +8 -0
  45. package/src/scss/functions/_lx-icons-generated.scss +7 -3
  46. package/src/scss/mixins/_slideout.scss +8 -0
  47. package/src/scss/variables/_slideout.scss +25 -2
package/src/scss/cadmin/variables/_slideout.scss CHANGED
@@ -11,6 +11,7 @@ $cadmin-c-slideout-tbar-stacked-min-width-mobile: 40px !default;
11
11
  $cadmin-c-slideout-transition-in: () !default;
12
12
  $cadmin-c-slideout-transition-in: map-merge(
13
13
  (
14
+ overflow: hidden,
14
15
  transition: all 0.3s ease-in-out,
15
16
  ),
16
17
  $cadmin-c-slideout-transition-in
@@ -19,6 +20,7 @@ $cadmin-c-slideout-transition-in: map-merge(
19
20
  $cadmin-c-slideout-transition-out: () !default;
20
21
  $cadmin-c-slideout-transition-out: map-merge(
21
22
  (
23
+ overflow: hidden,
22
24
  transition: all 0.2s ease-in,
23
25
  ),
24
26
  $cadmin-c-slideout-transition-out
@@ -42,6 +44,22 @@ $cadmin-c-slideout-fixed: map-merge(
42
44
  $cadmin-c-slideout-fixed
43
45
  );
44
46
 
47
+ $cadmin-c-slideout-push-start: () !default;
48
+ $cadmin-c-slideout-push-start: map-deep-merge(
49
+ (
50
+ padding-left: $cadmin-c-slideout-sidebar-width,
51
+ ),
52
+ $cadmin-c-slideout-push-start
53
+ );
54
+
55
+ $cadmin-c-slideout-push-end: () !default;
56
+ $cadmin-c-slideout-push-end: map-deep-merge(
57
+ (
58
+ padding-right: $cadmin-c-slideout-sidebar-width,
59
+ ),
60
+ $cadmin-c-slideout-push-end
61
+ );
62
+
45
63
  // C Slideout Base
46
64
 
47
65
  $cadmin-c-slideout: () !default;
@@ -60,11 +78,16 @@ $cadmin-c-slideout: map-deep-merge(
60
78
  position: relative,
61
79
  width: $cadmin-c-slideout-sidebar-width,
62
80
  ),
81
+ sidebar-body: (
82
+ flex-grow: 1,
83
+ ),
63
84
  sidebar-c-slideout-show: (
64
- display: block,
85
+ display: flex,
86
+ flex-direction: column,
65
87
  ),
66
88
  sidebar-c-slideout-transition: (
67
- display: block,
89
+ display: flex,
90
+ flex-direction: column,
68
91
  c-horizontal-resizer: (
69
92
  display: none,
70
93
  ),
package/src/scss/components/_slideout.scss CHANGED
@@ -14,6 +14,14 @@
14
14
  @include clay-css($c-slideout-absolute);
15
15
  }
16
16
 
17
+ .c-slideout-push-start {
18
+ @include clay-css($c-slideout-push-start);
19
+ }
20
+
21
+ .c-slideout-push-end {
22
+ @include clay-css($c-slideout-push-end);
23
+ }
24
+
17
25
  .c-slideout {
18
26
  @include clay-slideout-variant($c-slideout);
19
27
 
package/src/scss/functions/_lx-icons-generated.scss CHANGED
@@ -350,6 +350,8 @@
350
350
 
351
351
  'bg-bg': '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="#C0CFD8" d="M0 64h512v384H0z"/><path fill="#FFF" d="M16 80.3h480v112H16z"/><path fill="#E03232" d="M16 320h480v112H16z"/><path fill="#75BD4A" d="M16 192h480v128H16z"/></svg>',
352
352
 
353
+ 'bs-ba': '<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><path d="M16 2H0v12h16V2Z" fill="#B0BEC9"/><path d="M15.5 2.5H.5v11h15v-11Z" fill="#002F6C"/><path d="M13.017 13.5v-11H2.092l10.925 11Z" fill="#FFCD00"/><path d="m3.463 5.826.385 1.184h1.245l-1.007.732.385 1.185-1.008-.733-1.008.733.385-1.185-1.007-.732h1.245l.385-1.184ZM6.891 9.254l.385 1.184h1.246l-1.008.732.385 1.185-1.008-.732-1.007.732.385-1.185-1.008-.732h1.246l.384-1.184Z" fill="#fff"/></svg>',
354
+
353
355
  'ca-ad': '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="#C0CFD8" d="M0 64h512v384H0z"/><path fill="#0035A0" d="M16 80h160v352H16z"/><path fill="#E03232" d="M336 80h160v352H336z"/><path fill="#FCD638" d="M176 80h160v352H176z"/><path fill="#A97451" d="M208 206.5h96v96h-96z"/></svg>',
354
356
 
355
357
  'ca-es-valencia': '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M0 64h512v384H0V64Z" fill="#B0BEC9"/><path d="M16 80h480v352H16V80Z" fill="#FCD638"/><path d="M16 118.4h480v38.4H16v-38.4Zm0 78.4h480v38.4H16v-38.4Zm0 78.4h480v38.4H16v-38.4Zm0 78.4h480V392H16v-38.4Z" fill="#E03232"/><path d="M112 80H16v352h96V80Z" fill="#5887DD"/><path d="M144 80h-32v352h32V80Z" fill="#E03232"/></svg>',
@@ -684,11 +686,11 @@
684
686
 
685
687
  'password-policies': '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><circle class="lexicon-icon-outline password-policies-head" cx="192" cy="96" r="96" fill="#{$color}"/><path class="lexicon-icon password-policies-body" d="M288 245.9C30 132-174 475.5 224 446.8V352c0-35.5 28.7-64.2 64-64.2v-41.9z"/><path class="lexicon-icon password-policies-unlock" d="M480 320H352v-64c0-43.5 64-43.5 64 0v32h32v-32c0-84-128-86.5-128 0v64h-32c-17.7 0-32 14.3-32 32v128c0 17.7 14.3 32 32 32h192c17.7 0 32-14.3 32-32V352c0-17.7-14.3-32-32-32zm-64 128h-64v-64h64v64z"/></svg>',
686
688
 
687
- 'paste-plaintext': '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path class="lexicon-icon-outline" d="M388.1 32H123.9C90.8 32 64 58.8 64 91.9v328.3c0 33.1 26.8 59.9 59.9 59.9h264.3c33.1 0 59.9-26.8 59.9-59.9V91.9c-.1-33.1-26.9-59.9-60-59.9zM192 128h128c17.7 0 32-14.3 32-32h32v320H128V96h32c0 17.7 14.3 32 32 32zm112 64h-96c-21 0-21 32 0 32h96c21 0 21-32 0-32zm0 64h-96c-21 0-21 32 0 32h96c21 0 21-32 0-32zm-64 64h-32c-21 0-21 32 0 32h32c21 0 21-32 0-32z" fill="#{$color}"/></svg>',
689
+ 'paste-plaintext': '<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><path class="lexicon-icon-outline" fill-rule="evenodd" clip-rule="evenodd" d="M3.87 1.375h1.38c0-.498.5-.748.749-.748h4c.251 0 .751.25.751.748h1.377c1.034 0 1.871.838 1.874 1.872v10.259a1.872 1.872 0 0 1-1.872 1.872H3.871a1.871 1.871 0 0 1-1.872-1.872V3.247c0-1.034.837-1.872 1.872-1.872Zm.129 2v10h8v-10H10.75c0 .502-.5.752-.751.752h-4c-.249 0-.749-.25-.749-.752H3.999Z" fill="#{$color}"/><path d="M9.5 5.877h-3c-.656 0-.656 1 0 1h3c.656 0 .656-1 0-1Zm0 2h-3c-.656 0-.656 1 0 1h3c.656 0 .656-1 0-1Zm-2 2h-1c-.656 0-.656 1 0 1h1c.656 0 .656-1 0-1Z"/></svg>',
688
690
 
689
- 'paste-word': '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path class="lexicon-icon-outline" d="M416 192h-64V91.87C352 58.8 325.2 32 292.13 32H91.87C58.8 32 32 58.8 32 91.87v264.27C32 389.2 58.8 416 91.87 416H160v32c0 35.35 28.65 64 64 64h192c35.35 0 64-28.65 64-64V256c0-35.35-28.65-64-64-64zm-256 64v96H96V96h32c0 17.67 14.33 32 32 32h64c17.67 0 32-14.33 32-32h32v96h-64c-35.35 0-64 28.65-64 64zm226.03 160h-36.64l-27.36-83.24L293.85 416h-35.82l-32-128h32l19.35 85.66L304.79 288h33.7l26.84 85.66 20.7-85.66h32l-32 128z" fill="#{$color}"/></svg>',
691
+ 'paste-word': '<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><path class="lexicon-icon-outline" fill-rule="evenodd" clip-rule="evenodd" d="M7.5.252a.5.5 0 0 1 .5.5h1.129C10.162.752 11 1.59 11 2.623v3.13h2a2 2 0 0 1 2 2v6a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2v-1H2.871A1.871 1.871 0 0 1 1 10.88V2.623A1.87 1.87 0 0 1 2.871.753H4a.5.5 0 0 1 .5-.5h3Zm.563 12.5h1.12l.88-2.601.855 2.601h1.146l1-4h-1l-.647 2.677-.839-2.677H9.524l-.856 2.677-.605-2.677h-1l1 4Zm-5.063-2h2v-3a2 2 0 0 1 2-2h2v-3H8a.5.5 0 0 1-.5.5h-3a.5.5 0 0 1-.5-.5H3v8Z" fill="#{$color}"/></svg>',
690
692
 
691
- 'paste': '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path class="lexicon-icon-outline" d="M388.1 32H123.9C90.8 32 64 58.8 64 91.9v328.3c0 33.1 26.8 59.9 59.9 59.9h264.3c33.1 0 59.9-26.8 59.9-59.9V91.9c-.1-33.1-26.9-59.9-60-59.9zM192 128h128c17.7 0 32-14.3 32-32h32v320H128V96h32c0 17.7 14.3 32 32 32z" fill="#{$color}"/></svg>',
693
+ 'paste': '<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><path class="lexicon-icon-outline" fill-rule="evenodd" clip-rule="evenodd" d="M3.87 1.375h1.38c0-.498.5-.748.749-.748h4c.251 0 .751.25.751.748h1.377c1.034 0 1.871.838 1.874 1.872v10.259a1.872 1.872 0 0 1-1.872 1.872H3.871a1.871 1.871 0 0 1-1.872-1.872V3.247c0-1.034.837-1.872 1.872-1.872Zm.129 2v10h8v-10H10.75c0 .502-.5.752-.751.752h-4c-.249 0-.749-.25-.749-.752H3.999Z" fill="#{$color}"/></svg>',
692
694
 
693
695
  'pause': '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path class="lexicon-icon-outline pause-line-1" d="M160 0c-17.7 0-32 14.3-32 32v448c0 17.7 14.3 32 32 32s32-14.3 32-32V32c0-17.7-14.3-32-32-32z" fill="#{$color}"/><path class="lexicon-icon-outline pause-line-2" d="M352 0c-17.7 0-32 14.3-32 32v448c0 17.7 14.3 32 32 32s32-14.3 32-32V32c0-17.7-14.3-32-32-32z" fill="#{$color}"/></svg>',
694
696
 
@@ -754,6 +756,8 @@
754
756
 
755
757
  'remove-style': '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path class="lexicon-icon-outline remove-style-t" d="M0 64.426h116.531L54.685 352.273h70.601l57.645-287.847h110.736V0H0l-.001 64.426z" fill="#{$color}"/><path class="lexicon-icon-outline remove-style-t-underline" d="M0 384h288v32H0v-32z" fill="#{$color}"/><path class="lexicon-icon-outline remove-style-x" d="M481 512c-8.281 0-16.065-3.224-21.921-9.08l-45.962-45.962-45.962 45.962c-5.856 5.856-13.64 9.08-21.92 9.08s-16.065-3.224-21.921-9.08c-5.856-5.854-9.08-13.639-9.08-21.92s3.224-16.065 9.08-21.921l45.962-45.962-45.962-45.962c-12.087-12.087-12.087-31.753 0-43.841 5.854-5.856 13.639-9.08 21.92-9.08s16.065 3.224 21.921 9.08l45.962 45.962 45.962-45.962c5.854-5.856 13.639-9.08 21.92-9.08s16.065 3.224 21.921 9.08c12.086 12.087 12.086 31.754 0 43.841l-45.962 45.962 45.962 45.962c5.856 5.854 9.08 13.639 9.08 21.92s-3.224 16.065-9.08 21.921c-5.855 5.855-13.639 9.079-21.92 9.079z" fill="#{$color}"/></svg>',
756
758
 
759
+ 'repeat': '<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><path class="lexicon-icon-outline" d="M5.174 2.293a1.008 1.008 0 0 1 1.416 0l2.12 2.122c.389.39.389 1.028 0 1.416L6.59 7.952a1.008 1.008 0 0 1-1.416 0 1.007 1.007 0 0 1 0-1.415l.534-.534H2v6h12v-6h-2a1 1 0 0 1 0-2h3c.5 0 1 .5 1 1v8c0 .517-.5.999-1 .999H1c-.47-.048-.952-.53-1-1v-8c0-.55.45-1 1-1h4.468l-.294-.293a1.007 1.007 0 0 1 0-1.416Z" fill="#{$color}"/></svg>',
760
+
757
761
  'reply': '<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><path class="lexicon-icon-outline" d="M14.4 4.5H5.655l.47-.514c.62-.684.62-1.8 0-2.478a1.513 1.513 0 0 0-1.934-.277c-.118.075-.23.167-.331.277L.465 5.222c-.62.683-.62 1.799 0 2.477l3.395 3.713c.102.11.214.203.334.277a1.507 1.507 0 0 0 1.931-.277c.62-.683.62-1.799 0-2.477L5.27 8h7.53v5.25c0 .963.72 1.75 1.6 1.75.88 0 1.6-.787 1.6-1.75v-7c0-.963-.72-1.75-1.6-1.75Z" fill="#{$color}"/></svg>',
758
762
 
759
763
  'repository': '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path class="lexicon-icon-outline" d="M448 384c35.3 0 64-28.7 64-64V160c0-35.3-28.7-64-64-64h-96L241.1 12.8C230 4.5 216.5 0 202.7 0H64C28.7 0 0 28.7 0 64v256c0 35.3 28.7 64 64 64h160v64H32c-42 0-42 64 0 64h448c43 0 42-64 0-64H288v-64h160z" fill="#{$color}"/></svg>',
package/src/scss/mixins/_slideout.scss CHANGED
@@ -60,6 +60,14 @@
60
60
  }
61
61
  }
62
62
 
63
+ $_sidebar-body: map-get($map, sidebar-body);
64
+
65
+ @if ($_sidebar-body) {
66
+ .sidebar-body {
67
+ @include clay-css($_sidebar-body);
68
+ }
69
+ }
70
+
63
71
  $_sidebar-c-slideout-show: map-get($map, sidebar-c-slideout-show);
64
72
 
65
73
  @if ($_sidebar-c-slideout-show) {
package/src/scss/variables/_slideout.scss CHANGED
@@ -11,6 +11,7 @@ $c-slideout-tbar-stacked-min-width-mobile: 40px !default;
11
11
  $c-slideout-transition-in: () !default;
12
12
  $c-slideout-transition-in: map-merge(
13
13
  (
14
+ overflow: hidden,
14
15
  transition: all 0.3s ease-in-out,
15
16
  ),
16
17
  $c-slideout-transition-in
@@ -19,6 +20,7 @@ $c-slideout-transition-in: map-merge(
19
20
  $c-slideout-transition-out: () !default;
20
21
  $c-slideout-transition-out: map-merge(
21
22
  (
23
+ overflow: hidden,
22
24
  transition: all 0.2s ease-in,
23
25
  ),
24
26
  $c-slideout-transition-out
@@ -42,6 +44,22 @@ $c-slideout-fixed: map-merge(
42
44
  $c-slideout-fixed
43
45
  );
44
46
 
47
+ $c-slideout-push-start: () !default;
48
+ $c-slideout-push-start: map-deep-merge(
49
+ (
50
+ padding-left: $c-slideout-sidebar-width,
51
+ ),
52
+ $c-slideout-push-start
53
+ );
54
+
55
+ $c-slideout-push-end: () !default;
56
+ $c-slideout-push-end: map-deep-merge(
57
+ (
58
+ padding-right: $c-slideout-sidebar-width,
59
+ ),
60
+ $c-slideout-push-end
61
+ );
62
+
45
63
  // C Slideout Base
46
64
 
47
65
  $c-slideout: () !default;
@@ -60,11 +78,16 @@ $c-slideout: map-deep-merge(
60
78
  position: relative,
61
79
  width: $c-slideout-sidebar-width,
62
80
  ),
81
+ sidebar-body: (
82
+ flex-grow: 1,
83
+ ),
63
84
  sidebar-c-slideout-show: (
64
- display: block,
85
+ display: flex,
86
+ flex-direction: column,
65
87
  ),
66
88
  sidebar-c-slideout-transition: (
67
- display: block,
89
+ display: flex,
90
+ flex-direction: column,
68
91
  c-horizontal-resizer: (
69
92
  display: none,
70
93
  ),