mumuki-styles 3.0.2 → 3.0.4

Sign up to get free protection for your applications and to get access to all the features.
@@ -4,8 +4,11 @@ body {
4
4
  font-size: 1.0625rem;
5
5
  line-height: 1.8; }
6
6
 
7
+ .fs-7 {
8
+ font-size: 0.79688rem; }
9
+
7
10
  /*!
8
- * Bootstrap Utilities v5.0.0-beta3 (https://getbootstrap.com/)
11
+ * Bootstrap Utilities v5.0.1 (https://getbootstrap.com/)
9
12
  * Copyright 2011-2021 The Bootstrap Authors
10
13
  * Copyright 2011-2021 Twitter, Inc.
11
14
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
@@ -2833,7 +2836,7 @@ body {
2833
2836
  padding-right: 5px; }
2834
2837
 
2835
2838
  /*!
2836
- * Bootstrap v5.0.0-beta3 (https://getbootstrap.com/)
2839
+ * Bootstrap v5.0.1 (https://getbootstrap.com/)
2837
2840
  * Copyright 2011-2021 The Bootstrap Authors
2838
2841
  * Copyright 2011-2021 Twitter, Inc.
2839
2842
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
@@ -4150,6 +4153,7 @@ progress {
4150
4153
 
4151
4154
  .table {
4152
4155
  --bs-table-bg: transparent;
4156
+ --bs-table-accent-bg: transparent;
4153
4157
  --bs-table-striped-color: #0B465D;
4154
4158
  --bs-table-striped-bg: rgba(0, 0, 0, 0.05);
4155
4159
  --bs-table-active-color: #212529;
@@ -4828,11 +4832,12 @@ textarea.form-control-lg {
4828
4832
  background-position: top calc(0.45em + 0.1875rem) right calc(0.45em + 0.1875rem); }
4829
4833
 
4830
4834
  .was-validated .form-select:valid, .form-select.is-valid {
4831
- border-color: #5cb85c;
4832
- padding-right: 4.125rem;
4833
- background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e"), url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%235cb85c' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");
4834
- background-position: right 0.75rem center, center right 2.25rem;
4835
- background-size: 16px 12px, calc(0.9em + 0.375rem) calc(0.9em + 0.375rem); }
4835
+ border-color: #5cb85c; }
4836
+ .was-validated .form-select:valid:not([multiple]):not([size]), .was-validated .form-select:valid:not([multiple])[size="1"], .form-select.is-valid:not([multiple]):not([size]), .form-select.is-valid:not([multiple])[size="1"] {
4837
+ padding-right: 4.125rem;
4838
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e"), url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%235cb85c' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");
4839
+ background-position: right 0.75rem center, center right 2.25rem;
4840
+ background-size: 16px 12px, calc(0.9em + 0.375rem) calc(0.9em + 0.375rem); }
4836
4841
  .was-validated .form-select:valid:focus, .form-select.is-valid:focus {
4837
4842
  border-color: #5cb85c;
4838
4843
  box-shadow: 0 0 0 0.25rem rgba(92, 184, 92, 0.25); }
@@ -4852,7 +4857,11 @@ textarea.form-control-lg {
4852
4857
  .was-validated .input-group .form-control:valid, .input-group .form-control.is-valid, .was-validated
4853
4858
  .input-group .form-select:valid,
4854
4859
  .input-group .form-select.is-valid {
4855
- z-index: 3; }
4860
+ z-index: 1; }
4861
+ .was-validated .input-group .form-control:valid:focus, .input-group .form-control.is-valid:focus, .was-validated
4862
+ .input-group .form-select:valid:focus,
4863
+ .input-group .form-select.is-valid:focus {
4864
+ z-index: 3; }
4856
4865
 
4857
4866
  .invalid-feedback {
4858
4867
  display: none;
@@ -4896,11 +4905,12 @@ textarea.form-control-lg {
4896
4905
  background-position: top calc(0.45em + 0.1875rem) right calc(0.45em + 0.1875rem); }
4897
4906
 
4898
4907
  .was-validated .form-select:invalid, .form-select.is-invalid {
4899
- border-color: #d9534f;
4900
- padding-right: 4.125rem;
4901
- background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e"), url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23d9534f'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23d9534f' stroke='none'/%3e%3c/svg%3e");
4902
- background-position: right 0.75rem center, center right 2.25rem;
4903
- background-size: 16px 12px, calc(0.9em + 0.375rem) calc(0.9em + 0.375rem); }
4908
+ border-color: #d9534f; }
4909
+ .was-validated .form-select:invalid:not([multiple]):not([size]), .was-validated .form-select:invalid:not([multiple])[size="1"], .form-select.is-invalid:not([multiple]):not([size]), .form-select.is-invalid:not([multiple])[size="1"] {
4910
+ padding-right: 4.125rem;
4911
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e"), url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23d9534f'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23d9534f' stroke='none'/%3e%3c/svg%3e");
4912
+ background-position: right 0.75rem center, center right 2.25rem;
4913
+ background-size: 16px 12px, calc(0.9em + 0.375rem) calc(0.9em + 0.375rem); }
4904
4914
  .was-validated .form-select:invalid:focus, .form-select.is-invalid:focus {
4905
4915
  border-color: #d9534f;
4906
4916
  box-shadow: 0 0 0 0.25rem rgba(217, 83, 79, 0.25); }
@@ -4920,7 +4930,11 @@ textarea.form-control-lg {
4920
4930
  .was-validated .input-group .form-control:invalid, .input-group .form-control.is-invalid, .was-validated
4921
4931
  .input-group .form-select:invalid,
4922
4932
  .input-group .form-select.is-invalid {
4923
- z-index: 3; }
4933
+ z-index: 2; }
4934
+ .was-validated .input-group .form-control:invalid:focus, .input-group .form-control.is-invalid:focus, .was-validated
4935
+ .input-group .form-select:invalid:focus,
4936
+ .input-group .form-select.is-invalid:focus {
4937
+ z-index: 3; }
4924
4938
 
4925
4939
  .btn {
4926
4940
  display: inline-block;
@@ -5504,7 +5518,6 @@ textarea.form-control-lg {
5504
5518
 
5505
5519
  .dropdown-menu {
5506
5520
  position: absolute;
5507
- top: 100%;
5508
5521
  z-index: 1000;
5509
5522
  display: none;
5510
5523
  min-width: 10rem;
@@ -5519,6 +5532,7 @@ textarea.form-control-lg {
5519
5532
  border: 1px solid rgba(0, 0, 0, 0.15);
5520
5533
  border-radius: 0.25rem; }
5521
5534
  .dropdown-menu[data-bs-popper] {
5535
+ top: 100%;
5522
5536
  left: 0;
5523
5537
  margin-top: 0.125rem; }
5524
5538
 
@@ -5613,13 +5627,12 @@ textarea.form-control-lg {
5613
5627
  .dropup .dropdown-toggle:empty::after {
5614
5628
  margin-left: 0; }
5615
5629
 
5616
- .dropend .dropdown-menu {
5630
+ .dropend .dropdown-menu[data-bs-popper] {
5617
5631
  top: 0;
5618
5632
  right: auto;
5619
- left: 100%; }
5620
- .dropend .dropdown-menu[data-bs-popper] {
5621
- margin-top: 0;
5622
- margin-left: 0.125rem; }
5633
+ left: 100%;
5634
+ margin-top: 0;
5635
+ margin-left: 0.125rem; }
5623
5636
 
5624
5637
  .dropend .dropdown-toggle::after {
5625
5638
  display: inline-block;
@@ -5637,13 +5650,12 @@ textarea.form-control-lg {
5637
5650
  .dropend .dropdown-toggle::after {
5638
5651
  vertical-align: 0; }
5639
5652
 
5640
- .dropstart .dropdown-menu {
5653
+ .dropstart .dropdown-menu[data-bs-popper] {
5641
5654
  top: 0;
5642
5655
  right: 100%;
5643
- left: auto; }
5644
- .dropstart .dropdown-menu[data-bs-popper] {
5645
- margin-top: 0;
5646
- margin-right: 0.125rem; }
5656
+ left: auto;
5657
+ margin-top: 0;
5658
+ margin-right: 0.125rem; }
5647
5659
 
5648
5660
  .dropstart .dropdown-toggle::after {
5649
5661
  display: inline-block;
@@ -5828,11 +5840,14 @@ textarea.form-control-lg {
5828
5840
  .nav-link {
5829
5841
  display: block;
5830
5842
  padding: 0.5rem 2rem;
5843
+ color: #3498DB;
5831
5844
  text-decoration: none;
5832
5845
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out; }
5833
5846
  @media (prefers-reduced-motion: reduce) {
5834
5847
  .nav-link {
5835
5848
  transition: none; } }
5849
+ .nav-link:hover, .nav-link:focus {
5850
+ color: #2a7aaf; }
5836
5851
  .nav-link.disabled {
5837
5852
  color: #95a5a6;
5838
5853
  pointer-events: none;
@@ -6300,7 +6315,7 @@ textarea.form-control-lg {
6300
6315
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.125); }
6301
6316
  .accordion-button:not(.collapsed)::after {
6302
6317
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%230a3f54'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
6303
- transform: rotate(180deg); }
6318
+ transform: rotate(-180deg); }
6304
6319
  .accordion-button::after {
6305
6320
  flex-shrink: 0;
6306
6321
  width: 1.25rem;
@@ -6326,7 +6341,6 @@ textarea.form-control-lg {
6326
6341
  margin-bottom: 0; }
6327
6342
 
6328
6343
  .accordion-item {
6329
- margin-bottom: -1px;
6330
6344
  background-color: #fff;
6331
6345
  border: 1px solid rgba(0, 0, 0, 0.125); }
6332
6346
  .accordion-item:first-of-type {
@@ -6335,8 +6349,9 @@ textarea.form-control-lg {
6335
6349
  .accordion-item:first-of-type .accordion-button {
6336
6350
  border-top-left-radius: calc(0.25rem - 1px);
6337
6351
  border-top-right-radius: calc(0.25rem - 1px); }
6352
+ .accordion-item:not(:first-of-type) {
6353
+ border-top: 0; }
6338
6354
  .accordion-item:last-of-type {
6339
- margin-bottom: 0;
6340
6355
  border-bottom-right-radius: 0.25rem;
6341
6356
  border-bottom-left-radius: 0.25rem; }
6342
6357
  .accordion-item:last-of-type .accordion-button.collapsed {
@@ -6955,12 +6970,6 @@ textarea.form-control-lg {
6955
6970
  padding: 0.75rem;
6956
6971
  word-wrap: break-word; }
6957
6972
 
6958
- .modal-open {
6959
- overflow: hidden; }
6960
- .modal-open .modal {
6961
- overflow-x: hidden;
6962
- overflow-y: auto; }
6963
-
6964
6973
  .modal {
6965
6974
  position: fixed;
6966
6975
  top: 0;
@@ -6969,7 +6978,8 @@ textarea.form-control-lg {
6969
6978
  display: none;
6970
6979
  width: 100%;
6971
6980
  height: 100%;
6972
- overflow: hidden;
6981
+ overflow-x: hidden;
6982
+ overflow-y: auto;
6973
6983
  outline: 0; }
6974
6984
 
6975
6985
  .modal-dialog {
@@ -7017,7 +7027,7 @@ textarea.form-control-lg {
7017
7027
  position: fixed;
7018
7028
  top: 0;
7019
7029
  left: 0;
7020
- z-index: 1050;
7030
+ z-index: 1040;
7021
7031
  width: 100vw;
7022
7032
  height: 100vh;
7023
7033
  background-color: #000; }
@@ -7061,13 +7071,6 @@ textarea.form-control-lg {
7061
7071
  .modal-footer > * {
7062
7072
  margin: 0.25rem; }
7063
7073
 
7064
- .modal-scrollbar-measure {
7065
- position: absolute;
7066
- top: -9999px;
7067
- width: 50px;
7068
- height: 50px;
7069
- overflow: scroll; }
7070
-
7071
7074
  @media (min-width: 576px) {
7072
7075
  .modal-dialog {
7073
7076
  max-width: 500px;
@@ -7569,7 +7572,7 @@ textarea.form-control-lg {
7569
7572
  display: inline-block;
7570
7573
  width: 2rem;
7571
7574
  height: 2rem;
7572
- vertical-align: text-bottom;
7575
+ vertical-align: -0.125em;
7573
7576
  border: 0.25em solid currentColor;
7574
7577
  border-right-color: transparent;
7575
7578
  border-radius: 50%;
@@ -7591,7 +7594,7 @@ textarea.form-control-lg {
7591
7594
  display: inline-block;
7592
7595
  width: 2rem;
7593
7596
  height: 2rem;
7594
- vertical-align: text-bottom;
7597
+ vertical-align: -0.125em;
7595
7598
  background-color: currentColor;
7596
7599
  border-radius: 50%;
7597
7600
  opacity: 0;
@@ -7609,7 +7612,7 @@ textarea.form-control-lg {
7609
7612
  .offcanvas {
7610
7613
  position: fixed;
7611
7614
  bottom: 0;
7612
- z-index: 1040;
7615
+ z-index: 1050;
7613
7616
  display: flex;
7614
7617
  flex-direction: column;
7615
7618
  max-width: 100%;
@@ -7624,6 +7627,7 @@ textarea.form-control-lg {
7624
7627
 
7625
7628
  .offcanvas-header {
7626
7629
  display: flex;
7630
+ align-items: center;
7627
7631
  justify-content: space-between;
7628
7632
  padding: 1rem 1rem; }
7629
7633
  .offcanvas-header .btn-close {
@@ -7653,6 +7657,15 @@ textarea.form-control-lg {
7653
7657
  border-left: 1px solid rgba(0, 0, 0, 0.2);
7654
7658
  transform: translateX(100%); }
7655
7659
 
7660
+ .offcanvas-top {
7661
+ top: 0;
7662
+ right: 0;
7663
+ left: 0;
7664
+ height: 30vh;
7665
+ max-height: 100%;
7666
+ border-bottom: 1px solid rgba(0, 0, 0, 0.2);
7667
+ transform: translateY(-100%); }
7668
+
7656
7669
  .offcanvas-bottom {
7657
7670
  right: 0;
7658
7671
  left: 0;
@@ -7664,16 +7677,6 @@ textarea.form-control-lg {
7664
7677
  .offcanvas.show {
7665
7678
  transform: none; }
7666
7679
 
7667
- .offcanvas-backdrop::before {
7668
- position: fixed;
7669
- top: 0;
7670
- left: 0;
7671
- z-index: 1039;
7672
- width: 100vw;
7673
- height: 100vh;
7674
- content: "";
7675
- background-color: rgba(0, 0, 0, 0.5); }
7676
-
7677
7680
  .clearfix::after {
7678
7681
  display: block;
7679
7682
  clear: both;
@@ -8,3 +8,7 @@ body {
8
8
  font-size: $font-size-base;
9
9
  line-height: $line-height-base;
10
10
  }
11
+
12
+ .fs-7 {
13
+ font-size: $font-size-base * 0.75;
14
+ }
@@ -58,7 +58,6 @@
58
58
  }
59
59
 
60
60
  .accordion-item {
61
- margin-bottom: -$accordion-border-width;
62
61
  background-color: $accordion-bg;
63
62
  border: $accordion-border-width solid $accordion-border-color;
64
63
 
@@ -70,9 +69,12 @@
70
69
  }
71
70
  }
72
71
 
72
+ &:not(:first-of-type) {
73
+ border-top: 0;
74
+ }
75
+
73
76
  // Only set a border-radius on the last item if the accordion is collapsed
74
77
  &:last-of-type {
75
- margin-bottom: 0;
76
78
  @include border-bottom-radius($accordion-border-radius);
77
79
 
78
80
  .accordion-button {
@@ -16,7 +16,6 @@
16
16
  // The dropdown menu
17
17
  .dropdown-menu {
18
18
  position: absolute;
19
- top: 100%;
20
19
  z-index: $zindex-dropdown;
21
20
  display: none; // none by default, but block on "open" of the menu
22
21
  min-width: $dropdown-min-width;
@@ -33,6 +32,7 @@
33
32
  @include box-shadow($dropdown-box-shadow);
34
33
 
35
34
  &[data-bs-popper] {
35
+ top: 100%;
36
36
  left: 0;
37
37
  margin-top: $dropdown-spacer;
38
38
  }
@@ -83,15 +83,12 @@
83
83
  }
84
84
 
85
85
  .dropend {
86
- .dropdown-menu {
86
+ .dropdown-menu[data-bs-popper] {
87
87
  top: 0;
88
88
  right: auto;
89
89
  left: 100%;
90
-
91
- &[data-bs-popper] {
92
- margin-top: 0;
93
- margin-left: $dropdown-spacer;
94
- }
90
+ margin-top: 0;
91
+ margin-left: $dropdown-spacer;
95
92
  }
96
93
 
97
94
  .dropdown-toggle {
@@ -103,15 +100,12 @@
103
100
  }
104
101
 
105
102
  .dropstart {
106
- .dropdown-menu {
103
+ .dropdown-menu[data-bs-popper] {
107
104
  top: 0;
108
105
  right: 100%;
109
106
  left: auto;
110
-
111
- &[data-bs-popper] {
112
- margin-top: 0;
113
- margin-right: $dropdown-spacer;
114
- }
107
+ margin-top: 0;
108
+ margin-right: $dropdown-spacer;
115
109
  }
116
110
 
117
111
  .dropdown-toggle {
@@ -163,12 +163,12 @@
163
163
  // Organizationally, this must come after the `:hover` states.
164
164
 
165
165
  @each $state, $value in $theme-colors {
166
- $list-group-background: shift-color($value, $list-group-item-bg-scale);
167
- $list-group-color: shift-color($value, $list-group-item-color-scale);
168
- @if (contrast-ratio($list-group-background, $list-group-color) < $min-contrast-ratio) {
169
- $list-group-color: mix($value, color-contrast($list-group-background), abs($alert-color-scale));
166
+ $list-group-variant-bg: shift-color($value, $list-group-item-bg-scale);
167
+ $list-group-variant-color: shift-color($value, $list-group-item-color-scale);
168
+ @if (contrast-ratio($list-group-variant-bg, $list-group-variant-color) < $min-contrast-ratio) {
169
+ $list-group-variant-color: mix($value, color-contrast($list-group-variant-bg), abs($list-group-item-color-scale));
170
170
  }
171
171
 
172
- @include list-group-item-variant($state, $list-group-background, $list-group-color);
172
+ @include list-group-item-variant($state, $list-group-variant-bg, $list-group-variant-color);
173
173
  }
174
174
  // scss-docs-end list-group-modifiers
@@ -10,6 +10,7 @@
10
10
 
11
11
  // Helpers
12
12
  @import "mixins/breakpoints";
13
+ @import "mixins/color-scheme";
13
14
  @import "mixins/image";
14
15
  @import "mixins/resize";
15
16
  @import "mixins/visually-hidden";
@@ -4,16 +4,6 @@
4
4
  // .modal-content - actual modal w/ bg and corners and stuff
5
5
 
6
6
 
7
- .modal-open {
8
- // Kill the scroll on the body
9
- overflow: hidden;
10
-
11
- .modal {
12
- overflow-x: hidden;
13
- overflow-y: auto;
14
- }
15
- }
16
-
17
7
  // Container that the modal scrolls within
18
8
  .modal {
19
9
  position: fixed;
@@ -23,7 +13,8 @@
23
13
  display: none;
24
14
  width: 100%;
25
15
  height: 100%;
26
- overflow: hidden;
16
+ overflow-x: hidden;
17
+ overflow-y: auto;
27
18
  // Prevent Chrome on Windows from adding a focus outline. For details, see
28
19
  // https://github.com/twbs/bootstrap/pull/10951.
29
20
  outline: 0;
@@ -159,15 +150,6 @@
159
150
  }
160
151
  }
161
152
 
162
- // Measure scrollbar width for padding body during modal show/hide
163
- .modal-scrollbar-measure {
164
- position: absolute;
165
- top: -9999px;
166
- width: 50px;
167
- height: 50px;
168
- overflow: scroll;
169
- }
170
-
171
153
  // Scale up the modal
172
154
  @include media-breakpoint-up(sm) {
173
155
  // Automatically set modal's width for larger viewports
@@ -16,6 +16,7 @@
16
16
 
17
17
  .offcanvas-header {
18
18
  display: flex;
19
+ align-items: center;
19
20
  justify-content: space-between;
20
21
  padding: $offcanvas-padding-y $offcanvas-padding-x;
21
22
 
@@ -52,6 +53,16 @@
52
53
  transform: translateX(100%);
53
54
  }
54
55
 
56
+ .offcanvas-top {
57
+ top: 0;
58
+ right: 0;
59
+ left: 0;
60
+ height: $offcanvas-vertical-height;
61
+ max-height: 100%;
62
+ border-bottom: $offcanvas-border-width solid $offcanvas-border-color;
63
+ transform: translateY(-100%);
64
+ }
65
+
55
66
  .offcanvas-bottom {
56
67
  right: 0;
57
68
  left: 0;
@@ -64,14 +75,3 @@
64
75
  .offcanvas.show {
65
76
  transform: none;
66
77
  }
67
-
68
- .offcanvas-backdrop::before {
69
- position: fixed;
70
- top: 0;
71
- left: 0;
72
- z-index: $zindex-offcanvas - 1;
73
- width: 100vw;
74
- height: 100vh;
75
- content: "";
76
- background-color: $offcanvas-body-backdrop-color;
77
- }