@clayui/css 3.136.0 → 3.138.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 +418 -48
  2. package/lib/css/atlas.css.map +1 -1
  3. package/lib/css/base.css +379 -15
  4. package/lib/css/base.css.map +1 -1
  5. package/lib/css/cadmin.css +383 -20
  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/comments.svg +3 -5
  10. package/lib/images/icons/devices.svg +1 -0
  11. package/lib/images/icons/environment-connected.svg +1 -0
  12. package/lib/images/icons/environment-disconnected.svg +1 -0
  13. package/lib/images/icons/environment.svg +1 -0
  14. package/lib/images/icons/flags-bs-BA.svg +13 -0
  15. package/lib/images/icons/icons.svg +1 -1
  16. package/lib/images/icons/info-panel-closed.svg +1 -0
  17. package/lib/images/icons/info-panel-open.svg +1 -0
  18. package/lib/images/icons/megaphone-full.svg +1 -0
  19. package/lib/images/icons/paste-plaintext.svg +1 -3
  20. package/lib/images/icons/paste-word.svg +1 -3
  21. package/lib/images/icons/paste.svg +1 -3
  22. package/lib/images/icons/pin-full.svg +1 -0
  23. package/lib/images/icons/repeat.svg +7 -0
  24. package/lib/images/icons/reset.svg +3 -3
  25. package/lib/images/icons/send.svg +1 -0
  26. package/lib/images/icons/share-alt.svg +1 -0
  27. package/lib/images/icons/social-twitter.svg +1 -0
  28. package/lib/images/icons/third-party.svg +1 -0
  29. package/package.json +2 -2
  30. package/src/images/icons/anonymize.svg +1 -0
  31. package/src/images/icons/bell-full.svg +1 -0
  32. package/src/images/icons/comments.svg +3 -5
  33. package/src/images/icons/devices.svg +1 -0
  34. package/src/images/icons/environment-connected.svg +1 -0
  35. package/src/images/icons/environment-disconnected.svg +1 -0
  36. package/src/images/icons/environment.svg +1 -0
  37. package/src/images/icons/flags-bs-BA.svg +13 -0
  38. package/src/images/icons/info-panel-closed.svg +1 -0
  39. package/src/images/icons/info-panel-open.svg +1 -0
  40. package/src/images/icons/megaphone-full.svg +1 -0
  41. package/src/images/icons/paste-plaintext.svg +1 -3
  42. package/src/images/icons/paste-word.svg +1 -3
  43. package/src/images/icons/paste.svg +1 -3
  44. package/src/images/icons/pin-full.svg +1 -0
  45. package/src/images/icons/repeat.svg +7 -0
  46. package/src/images/icons/reset.svg +3 -3
  47. package/src/images/icons/send.svg +1 -0
  48. package/src/images/icons/share-alt.svg +1 -0
  49. package/src/images/icons/social-twitter.svg +1 -0
  50. package/src/images/icons/third-party.svg +1 -0
  51. package/src/scss/_license-text.scss +1 -1
  52. package/src/scss/atlas/variables/_forms.scss +6 -9
  53. package/src/scss/atlas/variables/_sidebar.scss +12 -7
  54. package/src/scss/cadmin/components/_form-validation.scss +16 -0
  55. package/src/scss/cadmin/components/_sidebar.scss +32 -0
  56. package/src/scss/cadmin/components/_slideout.scss +12 -0
  57. package/src/scss/cadmin/components/_utilities-functional-important.scss +8 -0
  58. package/src/scss/cadmin/variables/_clay-color.scss +2 -0
  59. package/src/scss/cadmin/variables/_forms.scss +39 -3
  60. package/src/scss/cadmin/variables/_sidebar.scss +36 -7
  61. package/src/scss/cadmin/variables/_slideout.scss +51 -3
  62. package/src/scss/cadmin/variables/_stickers.scss +6 -0
  63. package/src/scss/components/_form-validation.scss +16 -0
  64. package/src/scss/components/_sidebar.scss +32 -0
  65. package/src/scss/components/_slideout.scss +12 -0
  66. package/src/scss/components/_utilities-functional-important.scss +8 -0
  67. package/src/scss/functions/_lx-icons-generated.scss +9 -5
  68. package/src/scss/mixins/_globals.scss +7 -0
  69. package/src/scss/mixins/_grid.scss +6 -0
  70. package/src/scss/mixins/_sidebar.scss +2 -0
  71. package/src/scss/mixins/_slideout.scss +11 -1
  72. package/src/scss/variables/_forms.scss +36 -0
  73. package/src/scss/variables/_sidebar.scss +26 -9
  74. package/src/scss/variables/_slideout.scss +51 -3
  75. package/src/scss/variables/_stickers.scss +6 -0
@@ -1,6 +1,6 @@
1
1
  @charset "UTF-8";
2
2
  /**
3
- * Clay 3.136.0
3
+ * Clay 3.138.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>
@@ -16,7 +16,7 @@
16
16
  * SPDX-License-Identifier: LicenseRef-MIT-Bootstrap
17
17
  */
18
18
  /**
19
- * Clay 3.136.0
19
+ * Clay 3.138.0
20
20
  *
21
21
  * SPDX-FileCopyrightText: © 2020 Liferay, Inc. <https://liferay.com>
22
22
  * SPDX-FileCopyrightText: © 2020 Contributors to the project Clay <https://github.com/liferay/clay/graphs/contributors>
@@ -5175,6 +5175,12 @@ html:not(#__):not(#___) .cadmin .sticker-user-icon {
5175
5175
  border-radius: 5000px;
5176
5176
  box-shadow: 0 0 0 1px #e7e7ed;
5177
5177
  }
5178
+ html:not(#__):not(#___) .cadmin .sticker-xs {
5179
+ font-size: 0.5rem;
5180
+ height: 1rem;
5181
+ line-height: 1rem;
5182
+ width: 1rem;
5183
+ }
5178
5184
  html:not(#__):not(#___) .cadmin .sticker-sm {
5179
5185
  font-size: 12px;
5180
5186
  height: 24px;
@@ -8937,6 +8943,7 @@ html:not(#__):not(#___) .cadmin .clay-color-slider-alpha .clay-range-input .clay
8937
8943
  background-image: linear-gradient(90deg, transparent 0%, currentcolor 100%);
8938
8944
  }
8939
8945
  html:not(#__):not(#___) .cadmin .clay-color-slider-alpha .clay-range-input .form-control-range {
8946
+ background-image: linear-gradient(90deg, transparent 0%, currentcolor 100%);
8940
8947
  color: inherit;
8941
8948
  content: "";
8942
8949
  }
@@ -9407,6 +9414,13 @@ html:not(#__):not(#___) .cadmin .date-picker .input-group-text {
9407
9414
  min-width: 24px;
9408
9415
  }
9409
9416
  }
9417
+ @media (max-width: 575.98px) {
9418
+ html:not(#__):not(#___) .cadmin .date-picker .input-group-text {
9419
+ font-size: inherit;
9420
+ height: 32px;
9421
+ min-width: 24px;
9422
+ }
9423
+ }
9410
9424
  html:not(#__):not(#___) .cadmin .date-picker-dropdown-menu {
9411
9425
  max-height: none;
9412
9426
  max-width: 352px;
@@ -9424,6 +9438,14 @@ html:not(#__):not(#___) .cadmin .date-picker-dropdown-menu {
9424
9438
  max-width: 264px;
9425
9439
  }
9426
9440
  }
9441
+ @media (max-width: 575.98px) {
9442
+ html:not(#__):not(#___) .cadmin .date-picker-dropdown-menu {
9443
+ font-size: 12px;
9444
+ margin: 0;
9445
+ max-height: 255px;
9446
+ max-width: 264px;
9447
+ }
9448
+ }
9427
9449
  html:not(#__):not(#___) .cadmin .date-picker-nav {
9428
9450
  display: flex;
9429
9451
  margin-left: -2px;
@@ -9482,6 +9504,15 @@ html:not(#__):not(#___) .cadmin .date-picker-nav .nav-btn-monospaced {
9482
9504
  min-width: 24px;
9483
9505
  }
9484
9506
  }
9507
+ @media (max-width: 575.98px) {
9508
+ html:not(#__):not(#___) .cadmin .date-picker-nav .nav-btn-monospaced {
9509
+ font-size: 12px;
9510
+ height: 24px;
9511
+ max-height: 24px;
9512
+ max-width: 24px;
9513
+ min-width: 24px;
9514
+ }
9515
+ }
9485
9516
  html:not(#__):not(#___) .cadmin .date-picker-nav select.form-control {
9486
9517
  background-color: transparent;
9487
9518
  border-color: transparent;
@@ -9499,6 +9530,12 @@ html:not(#__):not(#___) .cadmin .date-picker-nav select.form-control {
9499
9530
  height: 24px;
9500
9531
  }
9501
9532
  }
9533
+ @media (max-width: 575.98px) {
9534
+ html:not(#__):not(#___) .cadmin .date-picker-nav select.form-control {
9535
+ font-size: 12px;
9536
+ height: 24px;
9537
+ }
9538
+ }
9502
9539
  html:not(#__):not(#___) .cadmin .date-picker-nav select.form-control:hover, html:not(#__):not(#___) .cadmin .date-picker-nav select.form-control.hover {
9503
9540
  background-color: #f1f2f5;
9504
9541
  color: #272833;
@@ -9530,6 +9567,12 @@ html:not(#__):not(#___) .cadmin .date-picker-nav .form-control-select {
9530
9567
  height: 24px;
9531
9568
  }
9532
9569
  }
9570
+ @media (max-width: 575.98px) {
9571
+ html:not(#__):not(#___) .cadmin .date-picker-nav .form-control-select {
9572
+ font-size: 12px;
9573
+ height: 24px;
9574
+ }
9575
+ }
9533
9576
  html:not(#__):not(#___) .cadmin .date-picker-nav .form-control-select:hover, html:not(#__):not(#___) .cadmin .date-picker-nav .form-control-select.hover {
9534
9577
  background-color: #f1f2f5;
9535
9578
  color: #272833;
@@ -9575,6 +9618,14 @@ html:not(#__):not(#___) .cadmin .date-picker-calendar-header {
9575
9618
  padding-top: 8px;
9576
9619
  }
9577
9620
  }
9621
+ @media (max-width: 575.98px) {
9622
+ html:not(#__):not(#___) .cadmin .date-picker-calendar-header {
9623
+ padding-bottom: 4px;
9624
+ padding-left: 6px;
9625
+ padding-right: 6px;
9626
+ padding-top: 8px;
9627
+ }
9628
+ }
9578
9629
  html:not(#__):not(#___) .cadmin .date-picker-calendar-body {
9579
9630
  padding-left: 8px;
9580
9631
  padding-right: 8px;
@@ -9587,6 +9638,13 @@ html:not(#__):not(#___) .cadmin .date-picker-calendar-body {
9587
9638
  padding-bottom: 4px;
9588
9639
  }
9589
9640
  }
9641
+ @media (max-width: 575.98px) {
9642
+ html:not(#__):not(#___) .cadmin .date-picker-calendar-body {
9643
+ padding-left: 6px;
9644
+ padding-right: 6px;
9645
+ padding-bottom: 4px;
9646
+ }
9647
+ }
9590
9648
  html:not(#__):not(#___) .cadmin .date-picker-calendar-footer {
9591
9649
  border-color: #cdced9;
9592
9650
  border-style: solid;
@@ -9603,6 +9661,13 @@ html:not(#__):not(#___) .cadmin .date-picker-calendar-footer {
9603
9661
  padding-top: 7px;
9604
9662
  }
9605
9663
  }
9664
+ @media (max-width: 575.98px) {
9665
+ html:not(#__):not(#___) .cadmin .date-picker-calendar-footer {
9666
+ padding-left: 6px;
9667
+ padding-right: 6px;
9668
+ padding-top: 7px;
9669
+ }
9670
+ }
9606
9671
  html:not(#__):not(#___) .cadmin .date-picker-calendar-item {
9607
9672
  align-items: center;
9608
9673
  background-color: transparent;
@@ -9637,6 +9702,12 @@ html:not(#__):not(#___) .c-prefers-reduced-motion .cadmin .date-picker-calendar-
9637
9702
  transition: none;
9638
9703
  }
9639
9704
 
9705
+ @media (max-width: 575.98px) {
9706
+ html:not(#__):not(#___) .cadmin .date-picker-calendar-item {
9707
+ height: 24px;
9708
+ width: 24px;
9709
+ }
9710
+ }
9640
9711
  html:not(#__):not(#___) .cadmin .date-picker-calendar-item:disabled, html:not(#__):not(#___) .cadmin .date-picker-calendar-item.disabled {
9641
9712
  cursor: not-allowed;
9642
9713
  }
@@ -9666,6 +9737,12 @@ html:not(#__):not(#___) .cadmin .date-picker-row {
9666
9737
  margin-top: 4px;
9667
9738
  }
9668
9739
  }
9740
+ @media (max-width: 575.98px) {
9741
+ html:not(#__):not(#___) .cadmin .date-picker-row {
9742
+ margin-bottom: 4px;
9743
+ margin-top: 4px;
9744
+ }
9745
+ }
9669
9746
  html:not(#__):not(#___) .cadmin .date-picker-col {
9670
9747
  display: flex;
9671
9748
  flex-grow: 1;
@@ -9700,6 +9777,11 @@ html:not(#__):not(#___) .cadmin .date-picker-days-row {
9700
9777
  margin-bottom: 4px;
9701
9778
  }
9702
9779
  }
9780
+ @media (max-width: 575.98px) {
9781
+ html:not(#__):not(#___) .cadmin .date-picker-days-row {
9782
+ margin-bottom: 4px;
9783
+ }
9784
+ }
9703
9785
  html:not(#__):not(#___) .cadmin .date-picker-day {
9704
9786
  height: 21px;
9705
9787
  }
@@ -9831,6 +9913,24 @@ html:not(#__):not(#___) .cadmin .form-text {
9831
9913
  overflow-wrap: break-word;
9832
9914
  word-wrap: break-word;
9833
9915
  }
9916
+ html:not(#__):not(#___) .cadmin .form-text.blockquote {
9917
+ font-style: italic;
9918
+ font-weight: 400;
9919
+ margin-bottom: 0;
9920
+ margin-top: 12px;
9921
+ padding-left: 12px;
9922
+ position: relative;
9923
+ }
9924
+ html:not(#__):not(#___) .cadmin .form-text.blockquote::before {
9925
+ background-color: #a7a9bc;
9926
+ bottom: 0;
9927
+ content: "";
9928
+ display: block;
9929
+ left: 0;
9930
+ position: absolute;
9931
+ top: 0;
9932
+ width: 2px;
9933
+ }
9834
9934
  html:not(#__):not(#___) .cadmin .has-error .custom-control-label,
9835
9935
  html:not(#__):not(#___) .cadmin .has-error .form-check-label {
9836
9936
  color: #da1414;
@@ -9838,13 +9938,17 @@ html:not(#__):not(#___) .cadmin .has-error .form-check-label {
9838
9938
  html:not(#__):not(#___) .cadmin .has-error .form-control {
9839
9939
  background-color: #feefef;
9840
9940
  border-color: #f48989;
9841
- box-shadow: 0 0 rgba(0, 0, 0, 0);
9842
9941
  color: #272833;
9843
9942
  }
9844
9943
  html:not(#__):not(#___) .cadmin .has-error .form-control.focus, html:not(#__):not(#___) .cadmin .has-error .form-control:focus-visible,
9845
9944
  html:not(#__):not(#___) .c-prefers-focus .cadmin .has-error .form-control:focus {
9846
9945
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px #5791ff;
9847
9946
  }
9947
+ html:not(#__):not(#___) .cadmin .has-error .form-control:focus-within:has(input:focus) {
9948
+ background-color: #feefef;
9949
+ border-color: #f48989;
9950
+ color: #272833;
9951
+ }
9848
9952
  html:not(#__):not(#___) .cadmin .has-error .form-control[readonly] {
9849
9953
  background-color: #fff;
9850
9954
  border-color: #e7e7ed;
@@ -9879,7 +9983,6 @@ html:not(#__):not(#___) .cadmin .has-error .input-group-item.focus .input-group-
9879
9983
  html:not(#__):not(#___) .cadmin .has-error .input-group-item .input-group-inset ~ .input-group-inset-item {
9880
9984
  background-color: #feefef;
9881
9985
  border-color: #f48989;
9882
- box-shadow: 0 0 rgba(0, 0, 0, 0);
9883
9986
  }
9884
9987
  html:not(#__):not(#___) .cadmin .has-error .input-group-item .input-group-inset:focus {
9885
9988
  box-shadow: none;
@@ -9895,13 +9998,17 @@ html:not(#__):not(#___) .cadmin .has-warning .form-check-label {
9895
9998
  html:not(#__):not(#___) .cadmin .has-warning .form-control {
9896
9999
  background-color: #fff4ec;
9897
10000
  border-color: #ff8f39;
9898
- box-shadow: 0 0 rgba(0, 0, 0, 0);
9899
10001
  color: #272833;
9900
10002
  }
9901
10003
  html:not(#__):not(#___) .cadmin .has-warning .form-control.focus, html:not(#__):not(#___) .cadmin .has-warning .form-control:focus-visible,
9902
10004
  html:not(#__):not(#___) .c-prefers-focus .cadmin .has-warning .form-control:focus {
9903
10005
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px #5791ff;
9904
10006
  }
10007
+ html:not(#__):not(#___) .cadmin .has-warning .form-control:focus-within:has(input:focus) {
10008
+ background-color: #fff4ec;
10009
+ border-color: #ff8f39;
10010
+ color: #272833;
10011
+ }
9905
10012
  html:not(#__):not(#___) .cadmin .has-warning .form-control[readonly] {
9906
10013
  background-color: #fff;
9907
10014
  border-color: #e7e7ed;
@@ -9936,7 +10043,6 @@ html:not(#__):not(#___) .cadmin .has-warning .input-group-item.focus .input-grou
9936
10043
  html:not(#__):not(#___) .cadmin .has-warning .input-group-item .input-group-inset ~ .input-group-inset-item {
9937
10044
  background-color: #fff4ec;
9938
10045
  border-color: #ff8f39;
9939
- box-shadow: 0 0 rgba(0, 0, 0, 0);
9940
10046
  }
9941
10047
  html:not(#__):not(#___) .cadmin .has-warning .input-group-item .input-group-inset:focus {
9942
10048
  box-shadow: none;
@@ -9952,13 +10058,17 @@ html:not(#__):not(#___) .cadmin .has-success .form-check-label {
9952
10058
  html:not(#__):not(#___) .cadmin .has-success .form-control {
9953
10059
  background-color: #edf9f0;
9954
10060
  border-color: #5aca75;
9955
- box-shadow: 0 0 rgba(0, 0, 0, 0);
9956
10061
  color: #272833;
9957
10062
  }
9958
10063
  html:not(#__):not(#___) .cadmin .has-success .form-control.focus, html:not(#__):not(#___) .cadmin .has-success .form-control:focus-visible,
9959
10064
  html:not(#__):not(#___) .c-prefers-focus .cadmin .has-success .form-control:focus {
9960
10065
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px #5791ff;
9961
10066
  }
10067
+ html:not(#__):not(#___) .cadmin .has-success .form-control:focus-within:has(input:focus) {
10068
+ background-color: #edf9f0;
10069
+ border-color: #5aca75;
10070
+ color: #272833;
10071
+ }
9962
10072
  html:not(#__):not(#___) .cadmin .has-success .form-control[readonly] {
9963
10073
  background-color: #fff;
9964
10074
  border-color: #e7e7ed;
@@ -9993,7 +10103,6 @@ html:not(#__):not(#___) .cadmin .has-success .input-group-item.focus .input-grou
9993
10103
  html:not(#__):not(#___) .cadmin .has-success .input-group-item .input-group-inset ~ .input-group-inset-item {
9994
10104
  background-color: #edf9f0;
9995
10105
  border-color: #5aca75;
9996
- box-shadow: 0 0 rgba(0, 0, 0, 0);
9997
10106
  }
9998
10107
  html:not(#__):not(#___) .cadmin .has-success .input-group-item .input-group-inset:focus {
9999
10108
  box-shadow: none;
@@ -12563,6 +12672,12 @@ html:not(#__):not(#___) .cadmin .menubar-primary .nav .nav .nav > li > .nav-link
12563
12672
  html:not(#__):not(#___) .cadmin .menubar-vertical-expand-md {
12564
12673
  max-width: 250px;
12565
12674
  }
12675
+ @media (max-width: 767.98px) {
12676
+ html:not(#__):not(#___) .cadmin .menubar-vertical-expand-md {
12677
+ margin-bottom: 16px;
12678
+ max-width: none;
12679
+ }
12680
+ }
12566
12681
  html:not(#__):not(#___) .cadmin .menubar-vertical-expand-md .menubar-collapse {
12567
12682
  display: block;
12568
12683
  }
@@ -12816,6 +12931,12 @@ html:not(#__):not(#___) .c-prefers-focus .cadmin .menubar-vertical-expand-md.men
12816
12931
  html:not(#__):not(#___) .cadmin .menubar-vertical-expand-lg {
12817
12932
  max-width: 250px;
12818
12933
  }
12934
+ @media (max-width: 991.98px) {
12935
+ html:not(#__):not(#___) .cadmin .menubar-vertical-expand-lg {
12936
+ margin-bottom: 16px;
12937
+ max-width: none;
12938
+ }
12939
+ }
12819
12940
  html:not(#__):not(#___) .cadmin .menubar-vertical-expand-lg .menubar-collapse {
12820
12941
  display: block;
12821
12942
  }
@@ -14724,6 +14845,12 @@ html:not(#__):not(#___) .cadmin .pagination-bar {
14724
14845
  display: flex;
14725
14846
  flex-wrap: wrap;
14726
14847
  }
14848
+ @media (max-width: 767.98px) {
14849
+ html:not(#__):not(#___) .cadmin .pagination-bar {
14850
+ flex-direction: column;
14851
+ justify-content: center;
14852
+ }
14853
+ }
14727
14854
  @media (max-width: 767.98px) {
14728
14855
  html:not(#__):not(#___) .cadmin .pagination-bar {
14729
14856
  flex-direction: column;
@@ -16427,39 +16554,48 @@ html:not(#__):not(#___) .cadmin .sidebar:focus, html:not(#__):not(#___) .cadmin
16427
16554
  box-shadow: inset 0 0 0 2px #5791ff, inset 0 0 0 4px #fff;
16428
16555
  }
16429
16556
  html:not(#__):not(#___) .cadmin .sidebar .container-fluid, html:not(#__):not(#___) .cadmin.sidebar .container-fluid {
16430
- padding-left: 16px;
16431
- padding-right: 16px;
16557
+ padding-left: 24px;
16558
+ padding-right: 24px;
16432
16559
  }
16433
16560
  html:not(#__):not(#___) .cadmin .sidebar-header {
16434
16561
  padding-bottom: 16px;
16435
- padding-left: 16px;
16562
+ padding-left: 24px;
16436
16563
  padding-right: 16px;
16437
16564
  padding-top: 16px;
16438
16565
  }
16439
16566
  html:not(#__):not(#___) .cadmin .sidebar-header .component-title {
16440
- font-size: 20px;
16567
+ font-size: 16px;
16441
16568
  }
16442
16569
  html:not(#__):not(#___) .cadmin .sidebar-header .component-title[href],
16443
16570
  html:not(#__):not(#___) .cadmin .sidebar-header .component-title a[href] {
16444
16571
  color: #272833;
16445
16572
  }
16446
16573
  html:not(#__):not(#___) .cadmin .sidebar-header .component-subtitle {
16447
- font-size: 12px;
16574
+ font-size: 14px;
16448
16575
  font-weight: 400;
16449
16576
  margin-bottom: 0;
16450
16577
  }
16578
+ html:not(#__):not(#___) .cadmin .sidebar-header .autofit-row {
16579
+ margin-left: -4px;
16580
+ margin-right: -4px;
16581
+ width: auto;
16582
+ }
16583
+ html:not(#__):not(#___) .cadmin .sidebar-header .autofit-row > .autofit-col {
16584
+ padding-left: 4px;
16585
+ padding-right: 4px;
16586
+ }
16451
16587
  html:not(#__):not(#___) .cadmin .sidebar-footer {
16452
16588
  padding-bottom: 16px;
16453
- padding-left: 16px;
16454
- padding-right: 16px;
16589
+ padding-left: 24px;
16590
+ padding-right: 24px;
16455
16591
  padding-top: 16px;
16456
16592
  }
16457
16593
  html:not(#__):not(#___) .cadmin .sidebar-body {
16458
16594
  overflow: auto;
16459
16595
  -webkit-overflow-scrolling: touch;
16460
16596
  padding-bottom: 16px;
16461
- padding-left: 16px;
16462
- padding-right: 16px;
16597
+ padding-left: 24px;
16598
+ padding-right: 24px;
16463
16599
  padding-top: 16px;
16464
16600
  }
16465
16601
  html:not(#__):not(#___) .cadmin .sidebar-body > .sidebar-section {
@@ -16533,6 +16669,7 @@ html:not(#__):not(#___) .cadmin .sidebar-dd {
16533
16669
  }
16534
16670
  html:not(#__):not(#___) .cadmin .sidebar-sm {
16535
16671
  font-size: 0.875rem;
16672
+ font-size: 0.875rem;
16536
16673
  }
16537
16674
  html:not(#__):not(#___) .cadmin .sidebar-light {
16538
16675
  background-color: #fff;
@@ -16540,12 +16677,25 @@ html:not(#__):not(#___) .cadmin .sidebar-light {
16540
16677
  border-left-width: 0;
16541
16678
  box-shadow: -4px 0 8px -4px rgba(0, 0, 0, 0.1);
16542
16679
  color: #272833;
16680
+ background-color: #fff;
16681
+ border-color: #e7e7ed;
16682
+ border-left-width: 0;
16683
+ box-shadow: -4px 0 8px -4px rgba(0, 0, 0, 0.1);
16684
+ color: #272833;
16543
16685
  }
16544
16686
  html:not(#__):not(#___) .cadmin .sidenav-start .sidebar-light,
16545
16687
  html:not(#__):not(#___) .cadmin .sidenav-left .sidebar-light {
16546
16688
  box-shadow: 4px 0 8px -4px rgba(0, 0, 0, 0.1);
16547
16689
  }
16548
16690
 
16691
+ html:not(#__):not(#___) .cadmin .sidebar-light .sidebar-header {
16692
+ background-color: inherit;
16693
+ border: 0px solid #e7e7ed;
16694
+ }
16695
+ html:not(#__):not(#___) .cadmin .sidebar-light .sidebar-footer {
16696
+ background-color: inherit;
16697
+ border: 0px solid #e7e7ed;
16698
+ }
16549
16699
  html:not(#__):not(#___) .cadmin .sidebar-light .sidebar-panel {
16550
16700
  background-color: #f1f2f5;
16551
16701
  }
@@ -16601,9 +16751,56 @@ html:not(#__):not(#___) .cadmin .sidebar-light .component-navigation-bar .navbar
16601
16751
  html:not(#__):not(#___) .cadmin .sidebar-light .component-navigation-bar .navbar-overlay {
16602
16752
  background-color: #fff;
16603
16753
  }
16754
+ html:not(#__):not(#___) .cadmin .sidebar-light .sidebar-header {
16755
+ background-color: inherit;
16756
+ border: 0px solid #e7e7ed;
16757
+ }
16758
+ html:not(#__):not(#___) .cadmin .sidebar-light .sidebar-footer {
16759
+ background-color: inherit;
16760
+ border: 0px solid #e7e7ed;
16761
+ }
16762
+ html:not(#__):not(#___) .cadmin .sidebar-light .sidenav-start {
16763
+ box-shadow: 4px 0 8px -4px rgba(0, 0, 0, 0.1);
16764
+ }
16765
+ html:not(#__):not(#___) .cadmin .sidebar-light .sidebar-dt {
16766
+ color: #6b6c7e;
16767
+ }
16768
+ html:not(#__):not(#___) .cadmin .sidebar-light .sidebar-dd .href {
16769
+ color: #272833;
16770
+ }
16771
+ html:not(#__):not(#___) .cadmin .sidebar-light .sidebar-panel {
16772
+ background-color: #f1f2f5;
16773
+ }
16774
+ html:not(#__):not(#___) .cadmin .sidebar-light .panel-unstyled .header .link:focus {
16775
+ box-shadow: 0 0 0 4px #fff, 0 0 0 6px #5791ff;
16776
+ }
16777
+ html:not(#__):not(#___) .cadmin .sidebar-light .sidebar-list-group .component-title {
16778
+ font-size: 16px;
16779
+ }
16780
+ html:not(#__):not(#___) .cadmin .sidebar-light .sidebar-list-group .component-title .href {
16781
+ color: #272833;
16782
+ }
16783
+ html:not(#__):not(#___) .cadmin .sidebar-light .component-navigation-bar {
16784
+ background-color: #fff;
16785
+ border-color: #cdced9;
16786
+ }
16787
+ html:not(#__):not(#___) .cadmin .sidebar-light .component-navigation-bar .navbar-nav .nav-link {
16788
+ color: #6b6c7e;
16789
+ }
16790
+ html:not(#__):not(#___) .cadmin .sidebar-light .component-navigation-bar .navbar-nav .nav-link:hover {
16791
+ color: #6b6c7e;
16792
+ }
16793
+ html:not(#__):not(#___) .cadmin .sidebar-light .component-navigation-bar .navbar-nav .nav-link:active {
16794
+ color: #272833;
16795
+ }
16796
+ html:not(#__):not(#___) .cadmin .sidebar-light .component-navigation-bar .navbar-nav .nav-link:disabled {
16797
+ color: #a7a9bc;
16798
+ }
16604
16799
  html:not(#__):not(#___) .cadmin .sidebar-dark {
16605
16800
  background-color: #272833;
16606
16801
  color: #fff;
16802
+ background-color: #272833;
16803
+ color: #fff;
16607
16804
  }
16608
16805
  html:not(#__):not(#___) .cadmin .sidebar-dark .close {
16609
16806
  color: #a7a9bc;
@@ -16665,9 +16862,61 @@ html:not(#__):not(#___) .cadmin .sidebar-dark .nav-nested .nav-link:disabled:act
16665
16862
  html:not(#__):not(#___) .cadmin .sidebar-dark .nav-nested .nav-link[aria-expanded=true], html:not(#__):not(#___) .cadmin .sidebar-dark .nav-nested .nav-link.show {
16666
16863
  color: #fff;
16667
16864
  }
16865
+ html:not(#__):not(#___) .cadmin .sidebar-dark .sidebar-header .component-title {
16866
+ color: inherit;
16867
+ }
16868
+ html:not(#__):not(#___) .cadmin .sidebar-dark .sidebar-header .component-title .href {
16869
+ color: inherit;
16870
+ }
16871
+ html:not(#__):not(#___) .cadmin .sidebar-dark .sidebar-header .component-subtitle {
16872
+ color: inherit;
16873
+ }
16874
+ html:not(#__):not(#___) .cadmin .sidebar-dark .sidebar-header .component-subtitle .href {
16875
+ color: inherit;
16876
+ }
16877
+ html:not(#__):not(#___) .cadmin .sidebar-dark .close {
16878
+ color: #a7a9bc;
16879
+ }
16880
+ html:not(#__):not(#___) .cadmin .sidebar-dark .close:hover {
16881
+ color: #fff;
16882
+ }
16883
+ html:not(#__):not(#___) .cadmin .sidebar-dark .nav-nested .nav-link {
16884
+ border-radius: 4px;
16885
+ color: #a7a9bc;
16886
+ transition: box-shadow 0.15s ease-in-out;
16887
+ }
16888
+ @media (prefers-reduced-motion: reduce) {
16889
+ html:not(#__):not(#___) .cadmin .sidebar-dark .nav-nested .nav-link {
16890
+ transition: none;
16891
+ }
16892
+ }
16893
+ html:not(#__):not(#___) .c-prefers-reduced-motion .cadmin .sidebar-dark .nav-nested .nav-link {
16894
+ transition: none;
16895
+ }
16896
+
16897
+ html:not(#__):not(#___) .cadmin .sidebar-dark .nav-nested .nav-link:hover {
16898
+ color: #fff;
16899
+ }
16900
+ html:not(#__):not(#___) .cadmin .sidebar-dark .nav-nested .nav-link:focus {
16901
+ box-shadow: 0 0 0 2px #fff, 0 0 0 4px #5791ff;
16902
+ outline: 0;
16903
+ }
16904
+ html:not(#__):not(#___) .cadmin .sidebar-dark .nav-nested .nav-link:active {
16905
+ color: #fff;
16906
+ }
16907
+ html:not(#__):not(#___) .cadmin .sidebar-dark .nav-nested .nav-link:disabled {
16908
+ box-shadow: none;
16909
+ color: #a7a9bc;
16910
+ opacity: 0.65;
16911
+ }
16912
+ html:not(#__):not(#___) .cadmin .sidebar-dark .nav-nested .nav-link:disabled:active {
16913
+ pointer-events: none;
16914
+ }
16668
16915
  html:not(#__):not(#___) .cadmin .sidebar-dark-l2 {
16669
16916
  background-color: #393a4a;
16670
16917
  color: #fff;
16918
+ background-color: #393a4a;
16919
+ color: #fff;
16671
16920
  }
16672
16921
  html:not(#__):not(#___) .cadmin .sidebar-dark-l2 .close {
16673
16922
  color: #a7a9bc;
@@ -16729,7 +16978,61 @@ html:not(#__):not(#___) .cadmin .sidebar-dark-l2 .nav-nested .nav-link:disabled:
16729
16978
  html:not(#__):not(#___) .cadmin .sidebar-dark-l2 .nav-nested .nav-link[aria-expanded=true], html:not(#__):not(#___) .cadmin .sidebar-dark-l2 .nav-nested .nav-link.show {
16730
16979
  color: #fff;
16731
16980
  }
16981
+ html:not(#__):not(#___) .cadmin .sidebar-dark-l2 .sidebar-header .component-title {
16982
+ color: inherit;
16983
+ }
16984
+ html:not(#__):not(#___) .cadmin .sidebar-dark-l2 .sidebar-header .component-title .href {
16985
+ color: inherit;
16986
+ }
16987
+ html:not(#__):not(#___) .cadmin .sidebar-dark-l2 .sidebar-header .component-subtitle {
16988
+ color: inherit;
16989
+ }
16990
+ html:not(#__):not(#___) .cadmin .sidebar-dark-l2 .sidebar-header .component-subtitle .href {
16991
+ color: inherit;
16992
+ }
16993
+ html:not(#__):not(#___) .cadmin .sidebar-dark-l2 .close {
16994
+ color: #a7a9bc;
16995
+ }
16996
+ html:not(#__):not(#___) .cadmin .sidebar-dark-l2 .close:hover {
16997
+ color: #fff;
16998
+ }
16999
+ html:not(#__):not(#___) .cadmin .sidebar-dark-l2 .nav-nested .nav-link {
17000
+ border-radius: 4px;
17001
+ color: #a7a9bc;
17002
+ transition: box-shadow 0.15s ease-in-out;
17003
+ }
17004
+ @media (prefers-reduced-motion: reduce) {
17005
+ html:not(#__):not(#___) .cadmin .sidebar-dark-l2 .nav-nested .nav-link {
17006
+ transition: none;
17007
+ }
17008
+ }
17009
+ html:not(#__):not(#___) .c-prefers-reduced-motion .cadmin .sidebar-dark-l2 .nav-nested .nav-link {
17010
+ transition: none;
17011
+ }
17012
+
17013
+ html:not(#__):not(#___) .cadmin .sidebar-dark-l2 .nav-nested .nav-link:hover {
17014
+ color: #fff;
17015
+ }
17016
+ html:not(#__):not(#___) .cadmin .sidebar-dark-l2 .nav-nested .nav-link:focus {
17017
+ box-shadow: 0 0 0 2px #fff, 0 0 0 4px #5791ff;
17018
+ outline: 0;
17019
+ }
17020
+ html:not(#__):not(#___) .cadmin .sidebar-dark-l2 .nav-nested .nav-link:active {
17021
+ color: #fff;
17022
+ }
17023
+ html:not(#__):not(#___) .cadmin .sidebar-dark-l2 .nav-nested .nav-link:disabled {
17024
+ box-shadow: none;
17025
+ color: #a7a9bc;
17026
+ opacity: 0.65;
17027
+ }
17028
+ html:not(#__):not(#___) .cadmin .sidebar-dark-l2 .nav-nested .nav-link:disabled:active {
17029
+ pointer-events: none;
17030
+ }
17031
+ html:not(#__):not(#___) .cadmin .c-slideout-start .sidebar-light {
17032
+ box-shadow: 0.25rem 0 0.5rem -0.25rem rgba(0, 0, 0, 0.1);
17033
+ }
16732
17034
  html:not(#__):not(#___) .cadmin .c-slideout-transition-in {
17035
+ overflow: hidden;
16733
17036
  transition: all 0.3s ease-in-out;
16734
17037
  }
16735
17038
  @media (prefers-reduced-motion: reduce) {
@@ -16742,6 +17045,7 @@ html:not(#__):not(#___) .c-prefers-reduced-motion .cadmin .c-slideout-transition
16742
17045
  }
16743
17046
 
16744
17047
  html:not(#__):not(#___) .cadmin .c-slideout-transition-out {
17048
+ overflow: hidden;
16745
17049
  transition: all 0.2s ease-in;
16746
17050
  }
16747
17051
  @media (prefers-reduced-motion: reduce) {
@@ -16759,6 +17063,26 @@ html:not(#__):not(#___) .cadmin .c-slideout-fixed {
16759
17063
  html:not(#__):not(#___) .cadmin .c-slideout-absolute {
16760
17064
  position: absolute;
16761
17065
  }
17066
+ html:not(#__):not(#___) .cadmin .c-slideout-container {
17067
+ min-height: 480px;
17068
+ position: relative;
17069
+ }
17070
+ html:not(#__):not(#___) .cadmin .c-slideout-push-start {
17071
+ padding-left: 320px;
17072
+ }
17073
+ @media (max-width: 991.98px) {
17074
+ html:not(#__):not(#___) .cadmin .c-slideout-push-start {
17075
+ padding-left: 0;
17076
+ }
17077
+ }
17078
+ html:not(#__):not(#___) .cadmin .c-slideout-push-end {
17079
+ padding-right: 320px;
17080
+ }
17081
+ @media (max-width: 991.98px) {
17082
+ html:not(#__):not(#___) .cadmin .c-slideout-push-end {
17083
+ padding-right: 0;
17084
+ }
17085
+ }
16762
17086
  html:not(#__):not(#___) .cadmin .c-slideout {
16763
17087
  display: flex;
16764
17088
  overflow: hidden;
@@ -16770,15 +17094,40 @@ html:not(#__):not(#___) .cadmin .c-slideout.c-slideout-shown {
16770
17094
  html:not(#__):not(#___) .cadmin .c-slideout .sidebar {
16771
17095
  display: none;
16772
17096
  flex-shrink: 0;
16773
- overflow: visible;
17097
+ position: relative;
17098
+ width: 320px;
17099
+ display: none;
17100
+ flex-shrink: 0;
16774
17101
  position: relative;
16775
17102
  width: 320px;
16776
17103
  }
17104
+ html:not(#__):not(#___) .cadmin .c-slideout .sidebar .sidebar-header {
17105
+ border-bottom-width: 1px;
17106
+ }
17107
+ html:not(#__):not(#___) .cadmin .c-slideout .sidebar .sidebar-body {
17108
+ flex-grow: 1;
17109
+ overflow: visible;
17110
+ }
17111
+ html:not(#__):not(#___) .cadmin .c-slideout .sidebar .sidebar-footer {
17112
+ border-top-width: 1px;
17113
+ }
17114
+ html:not(#__):not(#___) .cadmin .c-slideout .sidebar .sidebar-header {
17115
+ border-bottom-width: 1px;
17116
+ }
17117
+ html:not(#__):not(#___) .cadmin .c-slideout .sidebar .sidebar-body {
17118
+ flex-grow: 1;
17119
+ overflow: visible;
17120
+ }
17121
+ html:not(#__):not(#___) .cadmin .c-slideout .sidebar .sidebar-footer {
17122
+ border-top-width: 1px;
17123
+ }
16777
17124
  html:not(#__):not(#___) .cadmin .c-slideout .sidebar.c-slideout-show {
16778
- display: block;
17125
+ display: flex;
17126
+ flex-direction: column;
16779
17127
  }
16780
17128
  html:not(#__):not(#___) .cadmin .c-slideout .sidebar.c-slideout-transition {
16781
- display: block;
17129
+ display: flex;
17130
+ flex-direction: column;
16782
17131
  }
16783
17132
  html:not(#__):not(#___) .cadmin .c-slideout .sidebar.c-slideout-transition .c-horizontal-resizer {
16784
17133
  display: none;
@@ -16800,6 +17149,7 @@ html:not(#__):not(#___) .cadmin .c-slideout .tbar-stacked.c-slideout-transition
16800
17149
  @media (max-width: 767.98px) {
16801
17150
  html:not(#__):not(#___) .cadmin .c-slideout .sidebar {
16802
17151
  width: 280px;
17152
+ width: 280px;
16803
17153
  }
16804
17154
  }
16805
17155
  html:not(#__):not(#___) .cadmin .c-slideout-start {
@@ -16813,6 +17163,8 @@ html:not(#__):not(#___) .cadmin .c-slideout-start.c-slideout-tbar-shown .sidebar
16813
17163
  html:not(#__):not(#___) .cadmin .c-slideout-start .sidebar {
16814
17164
  left: -360px;
16815
17165
  width: 320px;
17166
+ left: -360px;
17167
+ width: 320px;
16816
17168
  }
16817
17169
  html:not(#__):not(#___) .cadmin .c-slideout-start .sidebar.c-slideout-show {
16818
17170
  left: 0;
@@ -16830,6 +17182,8 @@ html:not(#__):not(#___) .cadmin .c-slideout-start .tbar-stacked.c-slideout-show
16830
17182
  html:not(#__):not(#___) .cadmin .c-slideout-start .sidebar {
16831
17183
  left: -320px;
16832
17184
  width: 280px;
17185
+ left: -320px;
17186
+ width: 280px;
16833
17187
  }
16834
17188
  html:not(#__):not(#___) .cadmin .c-slideout-start .tbar-stacked {
16835
17189
  left: -40px;
@@ -16845,6 +17199,7 @@ html:not(#__):not(#___) .cadmin .c-slideout-end.c-slideout-tbar-shown .sidebar {
16845
17199
  }
16846
17200
  html:not(#__):not(#___) .cadmin .c-slideout-end .sidebar {
16847
17201
  right: -360px;
17202
+ right: -360px;
16848
17203
  }
16849
17204
  html:not(#__):not(#___) .cadmin .c-slideout-end .sidebar.c-slideout-show {
16850
17205
  right: 0;
@@ -16865,6 +17220,7 @@ html:not(#__):not(#___) .cadmin .c-slideout-end .c-horizontal-resizer {
16865
17220
  }
16866
17221
  html:not(#__):not(#___) .cadmin .c-slideout-end .sidebar {
16867
17222
  right: -320px;
17223
+ right: -320px;
16868
17224
  }
16869
17225
  html:not(#__):not(#___) .cadmin .c-slideout-end .tbar-stacked {
16870
17226
  right: -40px;
@@ -24494,6 +24850,13 @@ html:not(#__):not(#___) .cadmin .fixed-bottom {
24494
24850
  right: 0;
24495
24851
  z-index: 1030;
24496
24852
  }
24853
+ @supports (position: sticky) {
24854
+ html:not(#__):not(#___) .cadmin .sticky-bottom {
24855
+ bottom: 0;
24856
+ position: sticky;
24857
+ z-index: 1020;
24858
+ }
24859
+ }
24497
24860
  @supports (position: sticky) {
24498
24861
  html:not(#__):not(#___) .cadmin .sticky-top {
24499
24862
  position: sticky;