@clayui/css 3.133.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 (36) 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/package.json +2 -2
  12. package/src/images/icons/flags-en-IE.svg +12 -0
  13. package/src/images/icons/flags-en-LV.svg +11 -0
  14. package/src/images/icons/flags-my-MM.svg +13 -0
  15. package/src/scss/_license-text.scss +1 -1
  16. package/src/scss/atlas/variables/_labels.scss +1 -0
  17. package/src/scss/atlas/variables/_modals.scss +1 -0
  18. package/src/scss/cadmin/variables/_labels.scss +4 -5
  19. package/src/scss/cadmin/variables/_modals.scss +18 -2
  20. package/src/scss/cadmin/variables/_utilities.scss +7 -0
  21. package/src/scss/functions/_lx-icons-generated.scss +6 -0
  22. package/src/scss/mixins/_forms.scss +690 -432
  23. package/src/scss/mixins/_input-groups.scss +222 -107
  24. package/src/scss/mixins/_labels.scss +100 -48
  25. package/src/scss/mixins/_menubar.scss +131 -60
  26. package/src/scss/mixins/_modals.scss +36 -20
  27. package/src/scss/mixins/_nav.scss +86 -34
  28. package/src/scss/mixins/_pagination.scss +241 -151
  29. package/src/scss/mixins/_panels.scss +86 -51
  30. package/src/scss/mixins/_popovers.scss +82 -32
  31. package/src/scss/mixins/_sheet.scss +19 -7
  32. package/src/scss/mixins/_sidebar.scss +195 -89
  33. package/src/scss/mixins/_slideout.scss +96 -46
  34. package/src/scss/variables/_labels.scss +4 -5
  35. package/src/scss/variables/_modals.scss +18 -2
  36. package/src/scss/variables/_utilities.scss +6 -0
package/lib/css/base.css CHANGED
@@ -1,6 +1,6 @@
1
1
  @charset "UTF-8";
2
2
  /**
3
- * Clay 3.133.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>
@@ -4887,15 +4887,14 @@ input[type=button].btn-block {
4887
4887
  display: inline-flex;
4888
4888
  }
4889
4889
  .label-item .close {
4890
- border-radius: 1px;
4890
+ border-radius: 5000px;
4891
4891
  color: inherit;
4892
4892
  display: inline-flex;
4893
4893
  font-size: 1rem;
4894
- height: auto;
4895
- margin-bottom: -2px;
4896
- margin-top: -2px;
4894
+ height: 1.5rem;
4895
+ margin: -6px;
4897
4896
  opacity: 1;
4898
- width: auto;
4897
+ width: 1.5rem;
4899
4898
  }
4900
4899
  .label-item .close:hover {
4901
4900
  color: inherit;
@@ -7988,9 +7987,11 @@ select.form-control[size] {
7988
7987
  select.form-control[size].focus, select.form-control[size]:focus-visible, .c-prefers-focus select.form-control[size]:focus {
7989
7988
  background-image: none;
7990
7989
  }
7990
+
7991
7991
  select.form-control[size] option {
7992
7992
  padding: 0.25rem;
7993
7993
  }
7994
+
7994
7995
  select.form-control[multiple] {
7995
7996
  background-image: none;
7996
7997
  height: auto;
@@ -8002,9 +8003,11 @@ select.form-control[multiple] {
8002
8003
  select.form-control[multiple].focus, select.form-control[multiple]:focus-visible, .c-prefers-focus select.form-control[multiple]:focus {
8003
8004
  background-image: none;
8004
8005
  }
8006
+
8005
8007
  select.form-control[multiple] option {
8006
8008
  padding: 0.25rem;
8007
8009
  }
8010
+
8008
8011
  .form-control-shrink {
8009
8012
  max-width: 100%;
8010
8013
  white-space: nowrap;
@@ -11059,10 +11062,12 @@ label.custom-control-label {
11059
11062
  word-wrap: break-word;
11060
11063
  width: 100%;
11061
11064
  }
11065
+
11062
11066
  .input-group-item-shrink {
11063
11067
  flex-grow: 0;
11064
11068
  width: auto;
11065
11069
  }
11070
+
11066
11071
  .input-group-item-focusable {
11067
11072
  border-radius: 0.25rem;
11068
11073
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
@@ -11090,6 +11095,7 @@ label.custom-control-label {
11090
11095
  border-top-left-radius: 0;
11091
11096
  border-bottom-left-radius: 0;
11092
11097
  }
11098
+
11093
11099
  .input-group-text {
11094
11100
  align-items: center;
11095
11101
  background-color: #e9ecef;
@@ -11142,6 +11148,7 @@ label.custom-control-label {
11142
11148
  .input-group-text-secondary label {
11143
11149
  color: #fff;
11144
11150
  }
11151
+
11145
11152
  @media (max-width: 575.98px) {
11146
11153
  .input-group-stacked-sm-down > .input-group-item {
11147
11154
  margin-bottom: 0.5rem;
@@ -12289,6 +12296,10 @@ label.custom-control-label {
12289
12296
  padding-top: 0;
12290
12297
  z-index: 1;
12291
12298
  }
12299
+ .modal-header .modal-title {
12300
+ margin-bottom: 0;
12301
+ margin-top: 0;
12302
+ }
12292
12303
 
12293
12304
  .modal-body {
12294
12305
  border-top: 0.0625rem solid #dee2e6;
@@ -12307,6 +12318,17 @@ label.custom-control-label {
12307
12318
  overflow: auto;
12308
12319
  padding: 1rem;
12309
12320
  }
12321
+ .modal-body .aspect-ratio {
12322
+ margin-left: -1rem;
12323
+ margin-right: -1rem;
12324
+ top: -1rem;
12325
+ }
12326
+ .modal-body .close {
12327
+ position: absolute;
12328
+ right: 1rem;
12329
+ top: 1rem;
12330
+ z-index: 1;
12331
+ }
12310
12332
 
12311
12333
  .modal-body-flush {
12312
12334
  padding: 0;
@@ -12381,8 +12403,9 @@ label.custom-control-label {
12381
12403
  flex-grow: 1;
12382
12404
  font-size: 1.25rem;
12383
12405
  font-weight: 500;
12384
- line-height: 1.5;
12385
- margin-bottom: 0;
12406
+ line-height: 1.2;
12407
+ margin-bottom: 1.5rem;
12408
+ margin-top: 1rem;
12386
12409
  overflow: hidden;
12387
12410
  text-overflow: ellipsis;
12388
12411
  white-space: nowrap;
@@ -13111,6 +13134,7 @@ label.custom-control-label {
13111
13134
  flex: 1 1 auto;
13112
13135
  text-align: center;
13113
13136
  }
13137
+
13114
13138
  .nav-justified .nav-link {
13115
13139
  text-align: center;
13116
13140
  width: 100%;
@@ -13120,6 +13144,7 @@ label.custom-control-label {
13120
13144
  flex-grow: 1;
13121
13145
  text-align: center;
13122
13146
  }
13147
+
13123
13148
  .nav-stacked {
13124
13149
  display: block;
13125
13150
  }
@@ -13129,6 +13154,7 @@ label.custom-control-label {
13129
13154
  padding-right: 0.5rem;
13130
13155
  padding-top: 0.5rem;
13131
13156
  }
13157
+
13132
13158
  .nav-unstyled {
13133
13159
  flex-wrap: nowrap;
13134
13160
  }
@@ -17524,6 +17550,7 @@ label.custom-control-label {
17524
17550
  margin-bottom: 0.5rem;
17525
17551
  padding-left: 0;
17526
17552
  }
17553
+
17527
17554
  .pagination-bar {
17528
17555
  align-items: center;
17529
17556
  display: flex;
@@ -18120,6 +18147,7 @@ label.custom-control-label {
18120
18147
  .panel-block .panel-footer {
18121
18148
  padding: 0 1.25rem 1.25rem;
18122
18149
  }
18150
+
18123
18151
  .panel-default {
18124
18152
  border-width: 0px;
18125
18153
  }
@@ -18165,6 +18193,7 @@ label.custom-control-label {
18165
18193
  .panel-default .panel-footer {
18166
18194
  padding: 1.25rem 0;
18167
18195
  }
18196
+
18168
18197
  .panel-secondary {
18169
18198
  border-color: rgba(0, 0, 0, 0.125);
18170
18199
  }
@@ -18179,6 +18208,7 @@ label.custom-control-label {
18179
18208
  background-color: #f8f9fa;
18180
18209
  border-color: rgba(0, 0, 0, 0.125);
18181
18210
  }
18211
+
18182
18212
  .panel-unstyled {
18183
18213
  background-color: transparent;
18184
18214
  border-radius: 0px;
@@ -18208,6 +18238,7 @@ label.custom-control-label {
18208
18238
  .panel-unstyled .panel-footer {
18209
18239
  padding: 1rem 0 0.1px 0;
18210
18240
  }
18241
+
18211
18242
  .panel-lg.panel-block .panel-header {
18212
18243
  font-size: 1.5rem;
18213
18244
  padding: 1.5rem 1.5rem;
@@ -18225,6 +18256,7 @@ label.custom-control-label {
18225
18256
  .panel-lg.panel-block .panel-footer {
18226
18257
  padding: 0 1.5rem 1.5rem;
18227
18258
  }
18259
+
18228
18260
  .panel-sm.panel-block .panel-header {
18229
18261
  font-size: 1rem;
18230
18262
  padding: 0.8125rem 1rem;
@@ -18242,6 +18274,7 @@ label.custom-control-label {
18242
18274
  .panel-sm.panel-block .panel-footer {
18243
18275
  padding: 0 1rem 1rem;
18244
18276
  }
18277
+
18245
18278
  .panel-sm.panel-default .panel-header {
18246
18279
  font-size: 0.75rem;
18247
18280
  line-height: 1;
@@ -18314,6 +18347,7 @@ label.custom-control-label {
18314
18347
  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
18315
18348
  outline: 0;
18316
18349
  }
18350
+
18317
18351
  .popover-secondary {
18318
18352
  box-shadow: 0 8px 16px 0 rgba(0, 123, 255, 0.16);
18319
18353
  }
@@ -18448,15 +18482,18 @@ label.custom-control-label {
18448
18482
  .popover-header:empty {
18449
18483
  display: none;
18450
18484
  }
18485
+
18451
18486
  .popover-body {
18452
18487
  border-bottom-left-radius: calc( 0.3rem - 0.0625rem );
18453
18488
  border-bottom-right-radius: calc( 0.3rem - 0.0625rem );
18454
18489
  color: #212529;
18455
18490
  padding: 0.5rem 0.75rem;
18456
18491
  }
18492
+
18457
18493
  .popover-width-lg {
18458
18494
  max-width: 421px;
18459
18495
  }
18496
+
18460
18497
  .clay-popover-top,
18461
18498
  .clay-popover-top-left,
18462
18499
  .clay-popover-top-right {
@@ -18484,6 +18521,7 @@ label.custom-control-label {
18484
18521
  border-width: 0.5rem 0.5rem 0;
18485
18522
  bottom: 0.0625rem;
18486
18523
  }
18524
+
18487
18525
  .clay-popover-top-left .arrow {
18488
18526
  left: 0.375rem;
18489
18527
  margin: 0;
@@ -18521,6 +18559,7 @@ label.custom-control-label {
18521
18559
  border-width: 0.5rem 0.5rem 0.5rem 0;
18522
18560
  left: 0.0625rem;
18523
18561
  }
18562
+
18524
18563
  .clay-popover-right-bottom .arrow {
18525
18564
  bottom: 0.375rem;
18526
18565
  margin: 0;
@@ -18533,6 +18572,7 @@ label.custom-control-label {
18533
18572
  .clay-popover-right-top .arrow::after {
18534
18573
  border-right-color: #f7f7f7;
18535
18574
  }
18575
+
18536
18576
  .clay-popover-bottom,
18537
18577
  .clay-popover-bottom-left,
18538
18578
  .clay-popover-bottom-right {
@@ -18559,6 +18599,7 @@ label.custom-control-label {
18559
18599
  border-width: 0 0.5rem 0.5rem 0.5rem;
18560
18600
  top: 0.0625rem;
18561
18601
  }
18602
+
18562
18603
  .clay-popover-bottom-left .arrow {
18563
18604
  left: 0.375rem;
18564
18605
  margin: 0;
@@ -18566,6 +18607,7 @@ label.custom-control-label {
18566
18607
  .clay-popover-bottom-left .arrow::after {
18567
18608
  border-bottom-color: #f7f7f7;
18568
18609
  }
18610
+
18569
18611
  .clay-popover-bottom-right .arrow {
18570
18612
  left: auto;
18571
18613
  right: 0.375rem;
@@ -18573,6 +18615,7 @@ label.custom-control-label {
18573
18615
  .clay-popover-bottom-right .arrow::after {
18574
18616
  border-bottom-color: #f7f7f7;
18575
18617
  }
18618
+
18576
18619
  .clay-popover-left,
18577
18620
  .clay-popover-left-bottom,
18578
18621
  .clay-popover-left-top {
@@ -18601,6 +18644,7 @@ label.custom-control-label {
18601
18644
  border-width: 0.5rem 0 0.5rem 0.5rem;
18602
18645
  right: 0.0625rem;
18603
18646
  }
18647
+
18604
18648
  .clay-popover-left-bottom .arrow {
18605
18649
  bottom: 0.375rem;
18606
18650
  margin: 0;
@@ -18613,6 +18657,7 @@ label.custom-control-label {
18613
18657
  .clay-popover-left-top .arrow::after {
18614
18658
  border-left-color: #f7f7f7;
18615
18659
  }
18660
+
18616
18661
  .progress {
18617
18662
  background-color: #e9ecef;
18618
18663
  border-radius: 0.25rem;
@@ -19570,6 +19615,7 @@ a.sheet-subtitle:hover, a.sheet-subtitle.hover {
19570
19615
  .c-slideout-height-full {
19571
19616
  z-index: calc(1030 + 5);
19572
19617
  }
19618
+
19573
19619
  table {
19574
19620
  border-collapse: collapse;
19575
19621
  }
@@ -26482,6 +26528,16 @@ button.bg-primary:focus {
26482
26528
  background-color: #0062cc !important;
26483
26529
  }
26484
26530
 
26531
+ .bg-primary-l3 {
26532
+ background-color: #e5f2ff !important;
26533
+ }
26534
+
26535
+ a.bg-primary-l3:hover, a.bg-primary-l3:focus,
26536
+ button.bg-primary-l3:hover,
26537
+ button.bg-primary-l3:focus {
26538
+ background-color: #b2d7ff !important;
26539
+ }
26540
+
26485
26541
  .bg-secondary {
26486
26542
  background-color: #6c757d !important;
26487
26543
  }