paraqeet 0.10.0 → 1.0.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.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: d1b24b26941dcec658b52b53f187f8590f9144e4f649f20ac5ee1a5554c414f6
4
- data.tar.gz: ebefa7f9d62094133767184559f741dda4b1c24d6df26697ff6484e86b2508fa
3
+ metadata.gz: 8aa9a4e63cb89eeaf8f3d634407fef90817111ba276f8f1969a35ad8cd5cb60d
4
+ data.tar.gz: 35bfcea16a4a801370a7e89bbf8ab7d2a2b6e7c2ae1cc84dc04c0cd423eb3e21
5
5
  SHA512:
6
- metadata.gz: 7cb7cbf7cfffe1079dfc49b50d6ab3e97ed77fe063a9c2f4e0de7327f28bf208fe062b3d4bfe46c7567d7e42ea5b964fe2e718fac0a09e0acabe13265d3ff731
7
- data.tar.gz: bf8216d36df55b745d48424c9d9ec8fe58f29c13098e42fc534ee63bf01ee11992c7847fa5a9f100cfb7bacf38d50ddfa8c14e9b211bdc22430b24464c96362d
6
+ metadata.gz: a903be34ba229b75a9fc8c8ce69616f97e02e1cb9ce99492d7768f8488ffd822c5fd6a0262dc6054375500fb79629dead057d83d53f1a0de49b28936c07bb937
7
+ data.tar.gz: 9fda487f0b40926f061b2e5c646d1bc1739273ccc0dd2bdbca0b63c3f378dca2724a5fe5e09bf0bdcbadc00a8ccdfe14e09dcacbc35deafa49c87d155f315828
data/_config.yml CHANGED
@@ -3,7 +3,11 @@ description: A Jekyll theme for building websites with Bootstrap
3
3
  baseurl: "/paraqeet"
4
4
  url: "https://signified.github.io"
5
5
 
6
+ sass:
7
+ style: compressed
8
+
6
9
  exclude:
7
10
  - LICENSE
8
11
  - README.md
9
12
  - paraqeet.gemspec
13
+ - Rakefile
@@ -20,6 +20,6 @@
20
20
  </head>
21
21
  <body>
22
22
  {{ content }}
23
- <script src="{{- '/assets/js/script.js' | relative_url -}}"></script>
23
+ <script src="{{- '/assets/js/bootstrap.bundle.min.js' | relative_url -}}"></script>
24
24
  </body>
25
25
  </html>
@@ -44,7 +44,8 @@
44
44
  }
45
45
 
46
46
  // Disabled state lightens text
47
- &.disabled {
47
+ &.disabled,
48
+ &:disabled {
48
49
  color: var(--#{$prefix}nav-link-disabled-color);
49
50
  pointer-events: none;
50
51
  cursor: default;
@@ -79,13 +80,6 @@
79
80
  isolation: isolate;
80
81
  border-color: var(--#{$prefix}nav-tabs-link-hover-border-color);
81
82
  }
82
-
83
- &.disabled,
84
- &:disabled {
85
- color: var(--#{$prefix}nav-link-disabled-color);
86
- background-color: transparent;
87
- border-color: transparent;
88
- }
89
83
  }
90
84
 
91
85
  .nav-link.active,
@@ -117,12 +111,6 @@
117
111
 
118
112
  .nav-link {
119
113
  @include border-radius(var(--#{$prefix}nav-pills-border-radius));
120
-
121
- &:disabled {
122
- color: var(--#{$prefix}nav-link-disabled-color);
123
- background-color: transparent;
124
- border-color: transparent;
125
- }
126
114
  }
127
115
 
128
116
  .nav-link.active,
@@ -266,7 +266,8 @@
266
266
  @include deprecate("`.navbar-light`", "v5.2.0", "v6.0.0", true);
267
267
  }
268
268
 
269
- .navbar-dark {
269
+ .navbar-dark,
270
+ .navbar[data-bs-theme="dark"] {
270
271
  // scss-docs-start navbar-dark-css-vars
271
272
  --#{$prefix}navbar-color: #{$navbar-dark-color};
272
273
  --#{$prefix}navbar-hover-color: #{$navbar-dark-hover-color};
@@ -87,7 +87,7 @@ hr {
87
87
  font-style: $headings-font-style;
88
88
  font-weight: $headings-font-weight;
89
89
  line-height: $headings-line-height;
90
- color: var(--#{$prefix}heading-color, inherit);
90
+ color: var(--#{$prefix}heading-color);
91
91
  }
92
92
 
93
93
  h1 {
@@ -524,15 +524,15 @@ legend {
524
524
  height: auto;
525
525
  }
526
526
 
527
- // 1. Correct the outline style in Safari.
528
- // 2. This overrides the extra rounded corners on search inputs in iOS so that our
527
+ // 1. This overrides the extra rounded corners on search inputs in iOS so that our
529
528
  // `.form-control` class can properly style them. Note that this cannot simply
530
529
  // be added to `.form-control` as it's not specific enough. For details, see
531
530
  // https://github.com/twbs/bootstrap/issues/11586.
531
+ // 2. Correct the outline style in Safari.
532
532
 
533
533
  [type="search"] {
534
- outline-offset: -2px; // 1
535
- -webkit-appearance: textfield; // 2
534
+ -webkit-appearance: textfield; // 1
535
+ outline-offset: -2px; // 2
536
536
  }
537
537
 
538
538
  // 1. A few input types should stay LTR
@@ -77,9 +77,7 @@
77
77
  --#{$prefix}tertiary-bg-rgb: #{to-rgb($body-tertiary-bg)};
78
78
  // scss-docs-end root-body-variables
79
79
 
80
- @if $headings-color != null {
81
- --#{$prefix}heading-color: #{$headings-color};
82
- }
80
+ --#{$prefix}heading-color: #{$headings-color};
83
81
 
84
82
  --#{$prefix}link-color: #{$link-color};
85
83
  --#{$prefix}link-color-rgb: #{to-rgb($link-color)};
@@ -165,9 +163,7 @@
165
163
  --#{$prefix}#{$color}-border-subtle: #{$value};
166
164
  }
167
165
 
168
- @if $headings-color-dark != null {
169
- --#{$prefix}heading-color: #{$headings-color-dark};
170
- }
166
+ --#{$prefix}heading-color: #{$headings-color-dark};
171
167
 
172
168
  --#{$prefix}link-color: #{$link-color-dark};
173
169
  --#{$prefix}link-hover-color: #{$link-hover-color-dark};
@@ -3,6 +3,12 @@
3
3
  //
4
4
 
5
5
  .table {
6
+ // Reset needed for nesting tables
7
+ --#{$prefix}table-color-type: initial;
8
+ --#{$prefix}table-bg-type: initial;
9
+ --#{$prefix}table-color-state: initial;
10
+ --#{$prefix}table-bg-state: initial;
11
+ // End of reset
6
12
  --#{$prefix}table-color: #{$table-color};
7
13
  --#{$prefix}table-bg: #{$table-bg};
8
14
  --#{$prefix}table-border-color: #{$table-border-color};
@@ -16,7 +22,6 @@
16
22
 
17
23
  width: 100%;
18
24
  margin-bottom: $spacer;
19
- color: var(--#{$prefix}table-color);
20
25
  vertical-align: $table-cell-vertical-align;
21
26
  border-color: var(--#{$prefix}table-border-color);
22
27
 
@@ -27,9 +32,11 @@
27
32
  // stylelint-disable-next-line selector-max-universal
28
33
  > :not(caption) > * > * {
29
34
  padding: $table-cell-padding-y $table-cell-padding-x;
35
+ // Following the precept of cascades: https://codepen.io/miriamsuzanne/full/vYNgodb
36
+ color: var(--#{$prefix}table-color-state, var(--#{$prefix}table-color-type, var(--#{$prefix}table-color)));
30
37
  background-color: var(--#{$prefix}table-bg);
31
38
  border-bottom-width: $table-border-width;
32
- box-shadow: inset 0 0 0 9999px var(--#{$prefix}table-accent-bg);
39
+ box-shadow: inset 0 0 0 9999px var(--#{$prefix}table-bg-state, var(--#{$prefix}table-bg-type, var(--#{$prefix}table-accent-bg)));
33
40
  }
34
41
 
35
42
  > tbody {
@@ -104,16 +111,16 @@
104
111
  // For rows
105
112
  .table-striped {
106
113
  > tbody > tr:nth-of-type(#{$table-striped-order}) > * {
107
- --#{$prefix}table-accent-bg: var(--#{$prefix}table-striped-bg);
108
- color: var(--#{$prefix}table-striped-color);
114
+ --#{$prefix}table-color-type: var(--#{$prefix}table-striped-color);
115
+ --#{$prefix}table-bg-type: var(--#{$prefix}table-striped-bg);
109
116
  }
110
117
  }
111
118
 
112
119
  // For columns
113
120
  .table-striped-columns {
114
121
  > :not(caption) > tr > :nth-child(#{$table-striped-columns-order}) {
115
- --#{$prefix}table-accent-bg: var(--#{$prefix}table-striped-bg);
116
- color: var(--#{$prefix}table-striped-color);
122
+ --#{$prefix}table-color-type: var(--#{$prefix}table-striped-color);
123
+ --#{$prefix}table-bg-type: var(--#{$prefix}table-striped-bg);
117
124
  }
118
125
  }
119
126
 
@@ -122,8 +129,8 @@
122
129
  // The `.table-active` class can be added to highlight rows or cells
123
130
 
124
131
  .table-active {
125
- --#{$prefix}table-accent-bg: var(--#{$prefix}table-active-bg);
126
- color: var(--#{$prefix}table-active-color);
132
+ --#{$prefix}table-color-state: var(--#{$prefix}table-active-color);
133
+ --#{$prefix}table-bg-state: var(--#{$prefix}table-active-bg);
127
134
  }
128
135
 
129
136
  // Hover effect
@@ -132,8 +139,8 @@
132
139
 
133
140
  .table-hover {
134
141
  > tbody > tr:hover > * {
135
- --#{$prefix}table-accent-bg: var(--#{$prefix}table-hover-bg);
136
- color: var(--#{$prefix}table-hover-color);
142
+ --#{$prefix}table-color-state: var(--#{$prefix}table-hover-color);
143
+ --#{$prefix}table-bg-state: var(--#{$prefix}table-hover-bg);
137
144
  }
138
145
  }
139
146
 
@@ -40,7 +40,7 @@ $light-border-subtle-dark: $gray-700 !default;
40
40
  $dark-border-subtle-dark: $gray-800 !default;
41
41
  // scss-docs-end theme-border-subtle-dark-variables
42
42
 
43
- $body-color-dark: $gray-500 !default;
43
+ $body-color-dark: $gray-300 !default;
44
44
  $body-bg-dark: $gray-900 !default;
45
45
  $body-secondary-color-dark: rgba($body-color-dark, .75) !default;
46
46
  $body-secondary-bg-dark: $gray-800 !default;
@@ -49,7 +49,7 @@ $body-tertiary-bg-dark: mix($gray-800, $gray-900, 50%) !default;
49
49
  $body-emphasis-color-dark: $white !default;
50
50
  $border-color-dark: $gray-700 !default;
51
51
  $border-color-translucent-dark: rgba($white, .15) !default;
52
- $headings-color-dark: null !default;
52
+ $headings-color-dark: inherit !default;
53
53
  $link-color-dark: tint-color($primary, 40%) !default;
54
54
  $link-hover-color-dark: shift-color($link-color-dark, -$link-shade-percentage) !default;
55
55
  $code-color-dark: tint-color($code-color, 40%) !default;
@@ -655,7 +655,7 @@ $headings-font-family: null !default;
655
655
  $headings-font-style: null !default;
656
656
  $headings-font-weight: 500 !default;
657
657
  $headings-line-height: 1.2 !default;
658
- $headings-color: null !default;
658
+ $headings-color: inherit !default;
659
659
  // scss-docs-end headings-variables
660
660
 
661
661
  // scss-docs-start display-headings
@@ -705,6 +705,10 @@ $hr-border-color: null !default; // Allows for inherited colors
705
705
  $hr-border-width: var(--#{$prefix}border-width) !default;
706
706
  $hr-opacity: .25 !default;
707
707
 
708
+ // scss-docs-start vr-variables
709
+ $vr-border-width: var(--#{$prefix}border-width) !default;
710
+ // scss-docs-end vr-variables
711
+
708
712
  $legend-margin-bottom: .5rem !default;
709
713
  $legend-font-size: 1.5rem !default;
710
714
  $legend-font-weight: null !default;
@@ -731,7 +735,7 @@ $table-cell-padding-x-sm: .25rem !default;
731
735
  $table-cell-vertical-align: top !default;
732
736
 
733
737
  $table-color: var(--#{$prefix}body-color) !default;
734
- $table-bg: transparent !default;
738
+ $table-bg: var(--#{$prefix}body-bg) !default;
735
739
  $table-accent-bg: transparent !default;
736
740
 
737
741
  $table-th-font-weight: null !default;
@@ -1216,7 +1220,8 @@ $navbar-dark-color: rgba($white, .55) !default;
1216
1220
  $navbar-dark-hover-color: rgba($white, .75) !default;
1217
1221
  $navbar-dark-active-color: $white !default;
1218
1222
  $navbar-dark-disabled-color: rgba($white, .25) !default;
1219
- $navbar-dark-toggler-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'><path stroke='#{$navbar-dark-color}' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/></svg>") !default;
1223
+ $navbar-dark-icon-color: $navbar-dark-color !default;
1224
+ $navbar-dark-toggler-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'><path stroke='#{$navbar-dark-icon-color}' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/></svg>") !default;
1220
1225
  $navbar-dark-toggler-border-color: rgba($white, .1) !default;
1221
1226
  $navbar-dark-brand-color: $navbar-dark-active-color !default;
1222
1227
  $navbar-dark-brand-hover-color: $navbar-dark-active-color !default;
@@ -1543,9 +1548,6 @@ $alert-margin-bottom: 1rem !default;
1543
1548
  $alert-border-radius: var(--#{$prefix}border-radius) !default;
1544
1549
  $alert-link-font-weight: $font-weight-bold !default;
1545
1550
  $alert-border-width: var(--#{$prefix}border-width) !default;
1546
- $alert-bg-scale: -80% !default;
1547
- $alert-border-scale: -70% !default;
1548
- $alert-color-scale: 40% !default;
1549
1551
  $alert-dismissible-padding-r: $alert-padding-x * 3 !default; // 3x covers width of x plus default padding on either side
1550
1552
  // scss-docs-end alert-variables
1551
1553
 
@@ -5,6 +5,7 @@
5
5
  > .form-control-plaintext,
6
6
  > .form-select {
7
7
  height: $form-floating-height;
8
+ min-height: $form-floating-height;
8
9
  line-height: $form-floating-line-height;
9
10
  }
10
11
 
@@ -83,7 +84,8 @@
83
84
  }
84
85
  }
85
86
 
86
- > :disabled ~ label {
87
+ > :disabled ~ label,
88
+ > .form-control:disabled ~ label { // Required for `.form-control`s because of specificity
87
89
  color: $form-floating-label-disabled-color;
88
90
 
89
91
  &::after {
@@ -33,13 +33,13 @@
33
33
  height: $form-check-input-width;
34
34
  margin-top: ($line-height-base - $form-check-input-width) * .5; // line-height minus check height
35
35
  vertical-align: top;
36
+ appearance: none;
36
37
  background-color: var(--#{$prefix}form-check-bg);
37
38
  background-image: var(--#{$prefix}form-check-bg-image);
38
39
  background-repeat: no-repeat;
39
40
  background-position: center;
40
41
  background-size: contain;
41
42
  border: $form-check-input-border;
42
- appearance: none;
43
43
  print-color-adjust: exact; // Keep themed appearance for print
44
44
  @include transition($form-check-transition);
45
45
 
@@ -11,10 +11,10 @@
11
11
  font-weight: $input-font-weight;
12
12
  line-height: $input-line-height;
13
13
  color: $input-color;
14
+ appearance: none; // Fix appearance for date inputs in Safari
14
15
  background-color: $input-bg;
15
16
  background-clip: padding-box;
16
17
  border: $input-border-width solid $input-border-color;
17
- appearance: none; // Fix appearance for date inputs in Safari
18
18
 
19
19
  // Note: This has no effect on <select>s in some browsers, due to the limited stylability of `<select>`s in CSS.
20
20
  @include border-radius($input-border-radius, 0);
@@ -8,8 +8,8 @@
8
8
  width: 100%;
9
9
  height: add($form-range-thumb-height, $form-range-thumb-focus-box-shadow-width * 2);
10
10
  padding: 0; // Need to reset padding
11
- background-color: transparent;
12
11
  appearance: none;
12
+ background-color: transparent;
13
13
 
14
14
  &:focus {
15
15
  outline: 0;
@@ -28,12 +28,12 @@
28
28
  width: $form-range-thumb-width;
29
29
  height: $form-range-thumb-height;
30
30
  margin-top: ($form-range-track-height - $form-range-thumb-height) * .5; // Webkit specific
31
+ appearance: none;
31
32
  @include gradient-bg($form-range-thumb-bg);
32
33
  border: $form-range-thumb-border;
33
34
  @include border-radius($form-range-thumb-border-radius);
34
35
  @include box-shadow($form-range-thumb-box-shadow);
35
36
  @include transition($form-range-thumb-transition);
36
- appearance: none;
37
37
 
38
38
  &:active {
39
39
  @include gradient-bg($form-range-thumb-active-bg);
@@ -54,12 +54,12 @@
54
54
  &::-moz-range-thumb {
55
55
  width: $form-range-thumb-width;
56
56
  height: $form-range-thumb-height;
57
+ appearance: none;
57
58
  @include gradient-bg($form-range-thumb-bg);
58
59
  border: $form-range-thumb-border;
59
60
  @include border-radius($form-range-thumb-border-radius);
60
61
  @include box-shadow($form-range-thumb-box-shadow);
61
62
  @include transition($form-range-thumb-transition);
62
- appearance: none;
63
63
 
64
64
  &:active {
65
65
  @include gradient-bg($form-range-thumb-active-bg);
@@ -14,6 +14,7 @@
14
14
  font-weight: $form-select-font-weight;
15
15
  line-height: $form-select-line-height;
16
16
  color: $form-select-color;
17
+ appearance: none;
17
18
  background-color: $form-select-bg;
18
19
  background-image: var(--#{$prefix}form-select-bg-img), var(--#{$prefix}form-select-bg-icon, none);
19
20
  background-repeat: no-repeat;
@@ -23,7 +24,6 @@
23
24
  @include border-radius($form-select-border-radius, 0);
24
25
  @include box-shadow($form-select-box-shadow);
25
26
  @include transition($form-select-transition);
26
- appearance: none;
27
27
 
28
28
  &:focus {
29
29
  border-color: $form-select-focus-border-color;
@@ -1,10 +1,7 @@
1
- // stylelint-disable function-name-case
2
-
3
1
  // All-caps `RGBA()` function used because of this Sass bug: https://github.com/sass/node-sass/issues/2251
4
2
  @each $color, $value in $theme-colors {
5
- $color-rgb: to-rgb($value);
6
3
  .text-bg-#{$color} {
7
4
  color: color-contrast($value) if($enable-important-utilities, !important, null);
8
- background-color: RGBA($color-rgb, var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
5
+ background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
9
6
  }
10
7
  }
@@ -1,17 +1,15 @@
1
- // stylelint-disable function-name-case
2
-
3
1
  // All-caps `RGBA()` function used because of this Sass bug: https://github.com/sass/node-sass/issues/2251
4
2
  @each $color, $value in $theme-colors {
5
3
  .link-#{$color} {
6
- color: RGBA(var(--#{$prefix}#{$color}-rgb, var(--#{$prefix}link-opacity, 1)));
7
- text-decoration-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}link-underline-opacity, 1));
4
+ color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}link-opacity, 1)) if($enable-important-utilities, !important, null);
5
+ text-decoration-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}link-underline-opacity, 1)) if($enable-important-utilities, !important, null);
8
6
 
9
7
  @if $link-shade-percentage != 0 {
10
8
  &:hover,
11
9
  &:focus {
12
10
  $hover-color: if(color-contrast($value) == $color-contrast-light, shade-color($value, $link-shade-percentage), tint-color($value, $link-shade-percentage));
13
- color: RGBA(#{to-rgb($hover-color)}, var(--#{$prefix}link-opacity, 1));
14
- text-decoration-color: RGBA(to-rgb($hover-color), var(--#{$prefix}link-underline-opacity, 1));
11
+ color: RGBA(#{to-rgb($hover-color)}, var(--#{$prefix}link-opacity, 1)) if($enable-important-utilities, !important, null);
12
+ text-decoration-color: RGBA(to-rgb($hover-color), var(--#{$prefix}link-underline-opacity, 1)) if($enable-important-utilities, !important, null);
15
13
  }
16
14
  }
17
15
  }
@@ -19,14 +17,14 @@
19
17
 
20
18
  // One-off special link helper as a bridge until v6
21
19
  .link-body-emphasis {
22
- color: RGBA(var(--#{$prefix}emphasis-color-rgb), var(--#{$prefix}link-opacity, 1));
23
- text-decoration-color: RGBA(var(--#{$prefix}emphasis-color-rgb), var(--#{$prefix}link-underline-opacity, 1));
20
+ color: RGBA(var(--#{$prefix}emphasis-color-rgb), var(--#{$prefix}link-opacity, 1)) if($enable-important-utilities, !important, null);
21
+ text-decoration-color: RGBA(var(--#{$prefix}emphasis-color-rgb), var(--#{$prefix}link-underline-opacity, 1)) if($enable-important-utilities, !important, null);
24
22
 
25
23
  @if $link-shade-percentage != 0 {
26
24
  &:hover,
27
25
  &:focus {
28
- color: RGBA(var(--#{$prefix}emphasis-color-rgb), var(--#{$prefix}link-opacity, .75));
29
- text-decoration-color: RGBA(var(--#{$prefix}emphasis-color-rgb), var(--#{$prefix}link-underline-opacity, .75));
26
+ color: RGBA(var(--#{$prefix}emphasis-color-rgb), var(--#{$prefix}link-opacity, .75)) if($enable-important-utilities, !important, null);
27
+ text-decoration-color: RGBA(var(--#{$prefix}emphasis-color-rgb), var(--#{$prefix}link-underline-opacity, .75)) if($enable-important-utilities, !important, null);
30
28
  }
31
29
  }
32
30
  }
@@ -1,7 +1,7 @@
1
1
  .vr {
2
2
  display: inline-block;
3
3
  align-self: stretch;
4
- width: 1px;
4
+ width: $vr-border-width;
5
5
  min-height: 1em;
6
6
  background-color: currentcolor;
7
7
  opacity: $hr-opacity;
@@ -1,6 +1,6 @@
1
1
  @mixin bsBanner($file) {
2
2
  /*!
3
- * Bootstrap #{$file} v5.3.0-alpha3 (https://getbootstrap.com/)
3
+ * Bootstrap #{$file} v5.3.1 (https://getbootstrap.com/)
4
4
  * Copyright 2011-2023 The Bootstrap Authors
5
5
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
6
6
  */
@@ -258,7 +258,7 @@ $enable-important-utilities: false;
258
258
  .desaturated-color-blue {
259
259
  --bs-color-opacity: 1;
260
260
  // Sass compilation will put a leading zero so we want to keep that one
261
- // stylelint-disable-next-line number-leading-zero
261
+ // stylelint-disable-next-line stylistic/number-leading-zero
262
262
  --bs-color-saturation: 0.25;
263
263
  color: hsla(192deg, var(--bs-color-saturation), 0, var(--bs-color-opacity));
264
264
  }