@clayui/css 3.132.0 → 3.134.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 (38) hide show
  1. package/lib/css/atlas.css +63 -8
  2. package/lib/css/atlas.css.map +1 -1
  3. package/lib/css/base.css +64 -8
  4. package/lib/css/base.css.map +1 -1
  5. package/lib/css/cadmin.css +38 -9
  6. package/lib/css/cadmin.css.map +1 -1
  7. package/lib/images/icons/flags-en-IE.svg +12 -0
  8. package/lib/images/icons/flags-en-LV.svg +11 -0
  9. package/lib/images/icons/flags-my-MM.svg +13 -0
  10. package/lib/images/icons/icons.svg +1 -1
  11. package/lib/images/icons/slash.svg +9 -0
  12. package/package.json +2 -2
  13. package/src/images/icons/flags-en-IE.svg +12 -0
  14. package/src/images/icons/flags-en-LV.svg +11 -0
  15. package/src/images/icons/flags-my-MM.svg +13 -0
  16. package/src/images/icons/slash.svg +9 -0
  17. package/src/scss/_license-text.scss +1 -1
  18. package/src/scss/atlas/variables/_labels.scss +1 -0
  19. package/src/scss/atlas/variables/_modals.scss +1 -0
  20. package/src/scss/cadmin/variables/_labels.scss +4 -5
  21. package/src/scss/cadmin/variables/_modals.scss +18 -2
  22. package/src/scss/cadmin/variables/_utilities.scss +7 -0
  23. package/src/scss/functions/_lx-icons-generated.scss +8 -0
  24. package/src/scss/mixins/_forms.scss +690 -432
  25. package/src/scss/mixins/_input-groups.scss +222 -107
  26. package/src/scss/mixins/_labels.scss +100 -48
  27. package/src/scss/mixins/_menubar.scss +131 -60
  28. package/src/scss/mixins/_modals.scss +36 -20
  29. package/src/scss/mixins/_nav.scss +86 -34
  30. package/src/scss/mixins/_pagination.scss +241 -151
  31. package/src/scss/mixins/_panels.scss +86 -51
  32. package/src/scss/mixins/_popovers.scss +82 -32
  33. package/src/scss/mixins/_sheet.scss +19 -7
  34. package/src/scss/mixins/_sidebar.scss +195 -89
  35. package/src/scss/mixins/_slideout.scss +96 -46
  36. package/src/scss/variables/_labels.scss +4 -5
  37. package/src/scss/variables/_modals.scss +18 -2
  38. package/src/scss/variables/_utilities.scss +6 -0
package/lib/css/atlas.css CHANGED
@@ -1,6 +1,6 @@
1
1
  @charset "UTF-8";
2
2
  /**
3
- * Clay 3.132.0
3
+ * Clay 3.134.0
4
4
  *
5
5
  * SPDX-FileCopyrightText: © 2020 Liferay, Inc. <https://liferay.com>
6
6
  * SPDX-FileCopyrightText: © 2020 Contributors to the project Clay <https://github.com/liferay/clay/graphs/contributors>
@@ -5103,15 +5103,14 @@ input[type=button].btn-block {
5103
5103
  display: inline-flex;
5104
5104
  }
5105
5105
  .label-item .close {
5106
- border-radius: 1px;
5106
+ border-radius: 5000px;
5107
5107
  color: inherit;
5108
5108
  display: inline-flex;
5109
5109
  font-size: 1rem;
5110
- height: auto;
5111
- margin-bottom: -2px;
5112
- margin-top: -2px;
5110
+ height: 1.5rem;
5111
+ margin: -5px -4px;
5113
5112
  opacity: 1;
5114
- width: auto;
5113
+ width: 1.5rem;
5115
5114
  }
5116
5115
  .label-item .close:hover {
5117
5116
  color: inherit;
@@ -8208,6 +8207,7 @@ select.form-control {
8208
8207
  select.form-control.focus, select.form-control:focus-visible, .c-prefers-focus select.form-control:focus {
8209
8208
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'%3E%3Cpath%20class='lexicon-icon-outline%20caret-double-l-top'%20d='m347.913%20199.336-81.538-85c-5.413-5.642-14.188-5.642-19.6%200l-81.538%2085c-8.731%209.101-2.548%2024.664%209.8%2024.664h163.077c12.348%200%2018.531-15.563%209.8-24.664z'%20fill='%236b6c7e'/%3E%3Cpath%20class='lexicon-icon-outline%20caret-double-l-bottom'%20d='m165.236%20312.664%2081.538%2085c5.412%205.642%2014.188%205.642%2019.6%200l81.538-85c8.731-9.101%202.548-24.664-9.8-24.664H175.035c-12.347%200-18.531%2015.563-9.8%2024.664z'%20fill='%236b6c7e'/%3E%3C/svg%3E");
8210
8209
  }
8210
+
8211
8211
  select.form-control:disabled, select.form-control.disabled {
8212
8212
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'%3E%3Cpath%20class='lexicon-icon-outline%20caret-double-l-top'%20d='m347.913%20199.336-81.538-85c-5.413-5.642-14.188-5.642-19.6%200l-81.538%2085c-8.731%209.101-2.548%2024.664%209.8%2024.664h163.077c12.348%200%2018.531-15.563%209.8-24.664z'%20fill='%23a7a9bc'/%3E%3Cpath%20class='lexicon-icon-outline%20caret-double-l-bottom'%20d='m165.236%20312.664%2081.538%2085c5.412%205.642%2014.188%205.642%2019.6%200l81.538-85c8.731-9.101%202.548-24.664-9.8-24.664H175.035c-12.347%200-18.531%2015.563-9.8%2024.664z'%20fill='%23a7a9bc'/%3E%3C/svg%3E");
8213
8213
  }
@@ -8335,6 +8335,7 @@ select.form-control[multiple] option:checked {
8335
8335
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'%3E%3Cpath%20class='lexicon-icon-outline%20caret-double-l-top'%20d='m347.913%20199.336-81.538-85c-5.413-5.642-14.188-5.642-19.6%200l-81.538%2085c-8.731%209.101-2.548%2024.664%209.8%2024.664h163.077c12.348%200%2018.531-15.563%209.8-24.664z'%20fill='%23272833'/%3E%3Cpath%20class='lexicon-icon-outline%20caret-double-l-bottom'%20d='m165.236%20312.664%2081.538%2085c5.412%205.642%2014.188%205.642%2019.6%200l81.538-85c8.731-9.101%202.548-24.664-9.8-24.664H175.035c-12.347%200-18.531%2015.563-9.8%2024.664z'%20fill='%23272833'/%3E%3C/svg%3E");
8336
8336
  color: #272833;
8337
8337
  }
8338
+
8338
8339
  .form-control-select-secondary.show {
8339
8340
  background-color: #f1f2f5;
8340
8341
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'%3E%3Cpath%20class='lexicon-icon-outline%20caret-double-l-top'%20d='m347.913%20199.336-81.538-85c-5.413-5.642-14.188-5.642-19.6%200l-81.538%2085c-8.731%209.101-2.548%2024.664%209.8%2024.664h163.077c12.348%200%2018.531-15.563%209.8-24.664z'%20fill='%23272833'/%3E%3Cpath%20class='lexicon-icon-outline%20caret-double-l-bottom'%20d='m165.236%20312.664%2081.538%2085c5.412%205.642%2014.188%205.642%2019.6%200l81.538-85c8.731-9.101%202.548-24.664-9.8-24.664H175.035c-12.347%200-18.531%2015.563-9.8%2024.664z'%20fill='%23272833'/%3E%3C/svg%3E");
@@ -10857,6 +10858,7 @@ label.custom-control-label {
10857
10858
  background-color: #f1f2f5;
10858
10859
  color: #272833;
10859
10860
  }
10861
+
10860
10862
  .date-picker-nav select.form-control:disabled, .date-picker-nav select.form-control.disabled {
10861
10863
  background-color: transparent;
10862
10864
  color: #a7a9bc;
@@ -10886,6 +10888,7 @@ label.custom-control-label {
10886
10888
  background-color: #f1f2f5;
10887
10889
  color: #272833;
10888
10890
  }
10891
+
10889
10892
  .date-picker-nav .form-control-select:disabled, .date-picker-nav .form-control-select.disabled {
10890
10893
  background-color: transparent;
10891
10894
  color: #a7a9bc;
@@ -11734,10 +11737,12 @@ label.custom-control-label {
11734
11737
  word-wrap: break-word;
11735
11738
  width: 100%;
11736
11739
  }
11740
+
11737
11741
  .input-group-item-shrink {
11738
11742
  flex-grow: 0;
11739
11743
  width: auto;
11740
11744
  }
11745
+
11741
11746
  .input-group-item-focusable {
11742
11747
  border-radius: 0.25rem;
11743
11748
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
@@ -11765,6 +11770,7 @@ label.custom-control-label {
11765
11770
  border-top-left-radius: 0;
11766
11771
  border-bottom-left-radius: 0;
11767
11772
  }
11773
+
11768
11774
  .input-group-text {
11769
11775
  align-items: center;
11770
11776
  background-color: #e7e7ed;
@@ -11817,6 +11823,7 @@ label.custom-control-label {
11817
11823
  .input-group-text-secondary label {
11818
11824
  color: #6b6c7e;
11819
11825
  }
11826
+
11820
11827
  @media (max-width: 575.98px) {
11821
11828
  .input-group-stacked-sm-down > .input-group-item {
11822
11829
  margin-bottom: 0.5rem;
@@ -13077,6 +13084,10 @@ label.custom-control-label {
13077
13084
  padding-top: 0;
13078
13085
  z-index: 1;
13079
13086
  }
13087
+ .modal-header .modal-title {
13088
+ margin-bottom: 0;
13089
+ margin-top: 0;
13090
+ }
13080
13091
  .modal-body {
13081
13092
  border-top: 0.0625rem solid #e7e7ed;
13082
13093
  flex-grow: 1;
@@ -13094,6 +13105,17 @@ label.custom-control-label {
13094
13105
  overflow: auto;
13095
13106
  padding: 1.5rem;
13096
13107
  }
13108
+ .modal-body .aspect-ratio {
13109
+ margin-left: -1.5rem;
13110
+ margin-right: -1.5rem;
13111
+ top: -1.5rem;
13112
+ }
13113
+ .modal-body .close {
13114
+ position: absolute;
13115
+ right: 1rem;
13116
+ top: 1rem;
13117
+ z-index: 1;
13118
+ }
13097
13119
 
13098
13120
  .modal-body-flush {
13099
13121
  padding: 0;
@@ -13167,8 +13189,9 @@ label.custom-control-label {
13167
13189
  flex-grow: 1;
13168
13190
  font-size: 1.25rem;
13169
13191
  font-weight: 700;
13170
- line-height: 1.5;
13171
- margin-bottom: 0;
13192
+ line-height: 1.2;
13193
+ margin-bottom: 1.5rem;
13194
+ margin-top: 1rem;
13172
13195
  overflow: hidden;
13173
13196
  text-overflow: ellipsis;
13174
13197
  white-space: nowrap;
@@ -13921,6 +13944,7 @@ label.custom-control-label {
13921
13944
  flex: 1 1 auto;
13922
13945
  text-align: center;
13923
13946
  }
13947
+
13924
13948
  .nav-justified .nav-link {
13925
13949
  text-align: center;
13926
13950
  width: 100%;
@@ -13930,6 +13954,7 @@ label.custom-control-label {
13930
13954
  flex-grow: 1;
13931
13955
  text-align: center;
13932
13956
  }
13957
+
13933
13958
  .nav-stacked {
13934
13959
  display: block;
13935
13960
  }
@@ -13939,6 +13964,7 @@ label.custom-control-label {
13939
13964
  padding-right: 0.5rem;
13940
13965
  padding-top: 0.625rem;
13941
13966
  }
13967
+
13942
13968
  .nav-unstyled {
13943
13969
  flex-wrap: nowrap;
13944
13970
  }
@@ -18762,6 +18788,7 @@ label.custom-control-label {
18762
18788
  margin-bottom: 0.5rem;
18763
18789
  padding-left: 0;
18764
18790
  }
18791
+
18765
18792
  .pagination-bar {
18766
18793
  align-items: center;
18767
18794
  display: flex;
@@ -19532,6 +19559,7 @@ label.custom-control-label {
19532
19559
  .panel-block .panel-footer {
19533
19560
  padding: 0 1.25rem 1.25rem;
19534
19561
  }
19562
+
19535
19563
  .panel-default {
19536
19564
  border-width: 0px;
19537
19565
  }
@@ -19577,6 +19605,7 @@ label.custom-control-label {
19577
19605
  .panel-default .panel-footer {
19578
19606
  padding: 1.25rem 0;
19579
19607
  }
19608
+
19580
19609
  .panel-secondary {
19581
19610
  border-color: #e7e7ed;
19582
19611
  color: #6b6c7e;
@@ -19590,6 +19619,7 @@ label.custom-control-label {
19590
19619
  .panel-secondary .panel-footer {
19591
19620
  border-color: #e7e7ed;
19592
19621
  }
19622
+
19593
19623
  .panel-unstyled {
19594
19624
  background-color: transparent;
19595
19625
  border-radius: 0px;
@@ -19647,6 +19677,7 @@ label.custom-control-label {
19647
19677
  .panel-lg.panel-block .panel-footer {
19648
19678
  padding: 0 1.5rem 1.5rem;
19649
19679
  }
19680
+
19650
19681
  .panel-sm.panel-block .panel-header {
19651
19682
  font-size: 1rem;
19652
19683
  padding: 0.8125rem 1rem;
@@ -19664,6 +19695,7 @@ label.custom-control-label {
19664
19695
  .panel-sm.panel-block .panel-footer {
19665
19696
  padding: 0 1rem 1rem;
19666
19697
  }
19698
+
19667
19699
  .panel-sm.panel-default .panel-header {
19668
19700
  font-size: 0.75rem;
19669
19701
  line-height: 1;
@@ -19737,6 +19769,7 @@ label.custom-control-label {
19737
19769
  box-shadow: 0 0 0 0.125rem #fff, 0 0 0 0.25rem #5791ff;
19738
19770
  outline: 0;
19739
19771
  }
19772
+
19740
19773
  .popover-secondary {
19741
19774
  box-shadow: 0 8px 16px 0 rgba(11, 95, 255, 0.16);
19742
19775
  }
@@ -19875,15 +19908,18 @@ label.custom-control-label {
19875
19908
  .popover-header:empty {
19876
19909
  display: none;
19877
19910
  }
19911
+
19878
19912
  .popover-body {
19879
19913
  border-bottom-left-radius: calc( 0.25rem - 1px );
19880
19914
  border-bottom-right-radius: calc( 0.25rem - 1px );
19881
19915
  color: #6b6c7e;
19882
19916
  padding: 0.75rem 1rem;
19883
19917
  }
19918
+
19884
19919
  .popover-width-lg {
19885
19920
  max-width: 421px;
19886
19921
  }
19922
+
19887
19923
  .clay-popover-top,
19888
19924
  .clay-popover-top-left,
19889
19925
  .clay-popover-top-right {
@@ -19911,6 +19947,7 @@ label.custom-control-label {
19911
19947
  border-width: 5px 5px 0;
19912
19948
  bottom: 1px;
19913
19949
  }
19950
+
19914
19951
  .clay-popover-top-left .arrow {
19915
19952
  left: 0.625rem;
19916
19953
  margin: 0;
@@ -19948,6 +19985,7 @@ label.custom-control-label {
19948
19985
  border-width: 5px 5px 5px 0;
19949
19986
  left: 1px;
19950
19987
  }
19988
+
19951
19989
  .clay-popover-right-bottom .arrow {
19952
19990
  bottom: 0.625rem;
19953
19991
  margin: 0;
@@ -19960,6 +19998,7 @@ label.custom-control-label {
19960
19998
  .clay-popover-right-top .arrow::after {
19961
19999
  border-right-color: #fff;
19962
20000
  }
20001
+
19963
20002
  .clay-popover-bottom,
19964
20003
  .clay-popover-bottom-left,
19965
20004
  .clay-popover-bottom-right {
@@ -19986,6 +20025,7 @@ label.custom-control-label {
19986
20025
  border-width: 0 5px 5px 5px;
19987
20026
  top: 1px;
19988
20027
  }
20028
+
19989
20029
  .clay-popover-bottom-left .arrow {
19990
20030
  left: 0.625rem;
19991
20031
  margin: 0;
@@ -19993,6 +20033,7 @@ label.custom-control-label {
19993
20033
  .clay-popover-bottom-left .arrow::after {
19994
20034
  border-bottom-color: #fff;
19995
20035
  }
20036
+
19996
20037
  .clay-popover-bottom-right .arrow {
19997
20038
  left: auto;
19998
20039
  right: 0.625rem;
@@ -20000,6 +20041,7 @@ label.custom-control-label {
20000
20041
  .clay-popover-bottom-right .arrow::after {
20001
20042
  border-bottom-color: #fff;
20002
20043
  }
20044
+
20003
20045
  .clay-popover-left,
20004
20046
  .clay-popover-left-bottom,
20005
20047
  .clay-popover-left-top {
@@ -20028,6 +20070,7 @@ label.custom-control-label {
20028
20070
  border-width: 5px 0 5px 5px;
20029
20071
  right: 1px;
20030
20072
  }
20073
+
20031
20074
  .clay-popover-left-bottom .arrow {
20032
20075
  bottom: 0.625rem;
20033
20076
  margin: 0;
@@ -20040,6 +20083,7 @@ label.custom-control-label {
20040
20083
  .clay-popover-left-top .arrow::after {
20041
20084
  border-left-color: #fff;
20042
20085
  }
20086
+
20043
20087
  .progress {
20044
20088
  background-color: #f1f2f5;
20045
20089
  border-radius: 100px;
@@ -21132,6 +21176,7 @@ a.sheet-subtitle.focus, a.sheet-subtitle:focus-visible, .c-prefers-focus a.sheet
21132
21176
  .c-slideout-height-full {
21133
21177
  z-index: calc(1030 + 5);
21134
21178
  }
21179
+
21135
21180
  table {
21136
21181
  border-collapse: collapse;
21137
21182
  }
@@ -28948,6 +28993,16 @@ button.bg-primary:focus {
28948
28993
  background-color: #004ad7 !important;
28949
28994
  }
28950
28995
 
28996
+ .bg-primary-l3 {
28997
+ background-color: #f0f5ff !important;
28998
+ }
28999
+
29000
+ a.bg-primary-l3:hover, a.bg-primary-l3:focus,
29001
+ button.bg-primary-l3:hover,
29002
+ button.bg-primary-l3:focus {
29003
+ background-color: #bdd4ff !important;
29004
+ }
29005
+
28951
29006
  .bg-secondary {
28952
29007
  background-color: #6b6c7e !important;
28953
29008
  }