@patternfly/patternfly 6.5.0-prerelease.15 → 6.5.0-prerelease.17
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.
- package/base/patternfly-variables.css +16 -0
- package/base/tokens/tokens-local.scss +22 -0
- package/components/Compass/compass.css +4 -22
- package/components/Compass/compass.scss +4 -23
- package/components/Drawer/drawer.css +8 -0
- package/components/Drawer/drawer.scss +10 -0
- package/components/Tabs/tabs.css +0 -1
- package/components/Tabs/tabs.scss +0 -1
- package/components/_index.css +12 -23
- package/docs/demos/Compass/examples/Compass.md +1290 -0
- package/package.json +1 -1
- package/patternfly-base-no-globals.css +16 -0
- package/patternfly-base.css +16 -0
- package/patternfly-no-globals.css +28 -23
- package/patternfly.css +28 -23
- package/patternfly.min.css +1 -1
- package/patternfly.min.css.map +1 -1
|
@@ -923,6 +923,22 @@
|
|
|
923
923
|
var(--pf-t--global--box-shadow--color--lg--directional);
|
|
924
924
|
--pf-t--global--list-style: disc outside;
|
|
925
925
|
--pf-t--temp--dev--tbd: #BC11E0;
|
|
926
|
+
--pf-t--global--background--color--glass--filter: blur(12.5px);
|
|
927
|
+
--pf-t--global--background--color--glass--opacity: .85;
|
|
928
|
+
--pf-t--global--background--color--glass--default: rgba(255, 255, 255, var(--pf-t--global--background--color--glass--opacity));
|
|
929
|
+
--pf-t--global--dark--background--color--glass--filter: blur(12.5px);
|
|
930
|
+
--pf-t--global--dark--background--color--glass--opacity: .85;
|
|
931
|
+
--pf-t--global--dark--background--color--glass--default: rgba(29, 29, 29, var(--pf-t--global--background--color--glass--opacity));
|
|
932
|
+
}
|
|
933
|
+
:root:where(.pf-v6-theme-dark) {
|
|
934
|
+
--pf-t--global--background--color--glass--filter: var(--pf-t--global--dark--background--color--glass--filter);
|
|
935
|
+
--pf-t--global--background--color--glass--opacity: var(--pf-t--global--dark--background--color--glass--opacity);
|
|
936
|
+
--pf-t--global--background--color--glass--default: var(--pf-t--global--dark--background--color--glass--default);
|
|
937
|
+
}
|
|
938
|
+
:root:root:where(.pf-m-no-glass) {
|
|
939
|
+
--pf-t--global--background--color--glass--filter: none;
|
|
940
|
+
--pf-t--global--background--color--glass--opacity: 1;
|
|
941
|
+
--pf-t--global--background--color--glass--default: var(--pf-t--global--background--color--primary--default);
|
|
926
942
|
}
|
|
927
943
|
|
|
928
944
|
:root:where(.pf-v6-theme-dark) {
|
|
@@ -133,5 +133,27 @@
|
|
|
133
133
|
|
|
134
134
|
// stylelint-disable custom-property-pattern
|
|
135
135
|
--pf-t--temp--dev--tbd: #BC11E0;
|
|
136
|
+
// stylelint-enable
|
|
136
137
|
|
|
138
|
+
// Compass/glass tokens
|
|
139
|
+
--pf-t--global--background--color--glass--filter: blur(12.5px);
|
|
140
|
+
--pf-t--global--background--color--glass--opacity: .85;
|
|
141
|
+
--pf-t--global--background--color--glass--default: rgba(255, 255, 255, var(--pf-t--global--background--color--glass--opacity));
|
|
142
|
+
--pf-t--global--dark--background--color--glass--filter: blur(12.5px);
|
|
143
|
+
--pf-t--global--dark--background--color--glass--opacity: .85;
|
|
144
|
+
--pf-t--global--dark--background--color--glass--default: rgba(29, 29, 29, var(--pf-t--global--background--color--glass--opacity));
|
|
145
|
+
|
|
146
|
+
// Compass/glass dark tokens
|
|
147
|
+
&:where(.pf-v6-theme-dark) {
|
|
148
|
+
--pf-t--global--background--color--glass--filter: var(--pf-t--global--dark--background--color--glass--filter);
|
|
149
|
+
--pf-t--global--background--color--glass--opacity: var(--pf-t--global--dark--background--color--glass--opacity);
|
|
150
|
+
--pf-t--global--background--color--glass--default: var(--pf-t--global--dark--background--color--glass--default);
|
|
151
|
+
}
|
|
152
|
+
|
|
153
|
+
// no glass theme
|
|
154
|
+
&:root:where(.pf-m-no-glass) {
|
|
155
|
+
--pf-t--global--background--color--glass--filter: none;
|
|
156
|
+
--pf-t--global--background--color--glass--opacity: 1;
|
|
157
|
+
--pf-t--global--background--color--glass--default: var(--pf-t--global--background--color--primary--default);
|
|
158
|
+
}
|
|
137
159
|
}
|
|
@@ -8,15 +8,8 @@
|
|
|
8
8
|
--pf-v6-c-compass__nav--RowGap: var(--pf-t--global--spacer--gap--group--vertical);
|
|
9
9
|
--pf-v6-c-compass__sidebar--Padding: var(--pf-t--global--spacer--sm);
|
|
10
10
|
--pf-v6-c-compass__main--RowGap: var(--pf-t--global--spacer--md);
|
|
11
|
-
--pf-v6-c-compass__panel--BackgroundColor--
|
|
12
|
-
--pf-v6-c-compass__panel--
|
|
13
|
-
--pf-v6-c-compass__panel--BackgroundColor--light: rgba(var(--pf-v6-c-compass__panel--BackgroundColor--rgb--light), var(--pf-v6-c-compass__panel--BackgroundColor--opacity--light));
|
|
14
|
-
--pf-v6-c-compass__panel--BackgroundColor--rgb--dark: 29,29,29;
|
|
15
|
-
--pf-v6-c-compass__panel--BackgroundColor--opacity--dark: .8;
|
|
16
|
-
--pf-v6-c-compass__panel--BackgroundColor--dark: rgba(var(--pf-v6-c-compass__panel--BackgroundColor--rgb--dark), var(--pf-v6-c-compass__panel--BackgroundColor--opacity--dark));
|
|
17
|
-
--pf-v6-c-compass__panel--BackdropFilter: var(--pf-v6-c-compass__panel--BackdropFilter--light);
|
|
18
|
-
--pf-v6-c-compass__panel--BackdropFilter--light: blur(12.5px);
|
|
19
|
-
--pf-v6-c-compass__panel--BackdropFilter--dark: blur(12.5px);
|
|
11
|
+
--pf-v6-c-compass__panel--BackgroundColor: var(--pf-t--global--background--color--glass--default);
|
|
12
|
+
--pf-v6-c-compass__panel--BackdropFilter: var(--pf-t--global--background--color--glass--filter);
|
|
20
13
|
--pf-v6-c-compass__panel--BorderRadius: var(--pf-t--global--border--radius--large);
|
|
21
14
|
--pf-v6-c-compass__panel--m-pill--BorderRadius: var(--pf-t--global--border--radius--pill);
|
|
22
15
|
--pf-v6-c-compass__panel--Padding: var(--pf-t--global--spacer--inset--page-chrome);
|
|
@@ -129,16 +122,12 @@
|
|
|
129
122
|
|
|
130
123
|
.pf-v6-c-compass__panel {
|
|
131
124
|
padding: var(--pf-v6-c-compass__panel--Padding);
|
|
132
|
-
background-color: var(--pf-v6-c-compass__panel--BackgroundColor
|
|
133
|
-
backdrop-filter: var(--pf-v6-c-compass__panel--BackdropFilter
|
|
125
|
+
background-color: var(--pf-v6-c-compass__panel--BackgroundColor);
|
|
126
|
+
backdrop-filter: var(--pf-v6-c-compass__panel--BackdropFilter);
|
|
134
127
|
border: var(--pf-v6-c-compass__panel--BorderWidth) solid var(--pf-v6-c-compass__panel--BorderColor);
|
|
135
128
|
border-radius: var(--pf-v6-c-compass__panel--BorderRadius);
|
|
136
129
|
box-shadow: var(--pf-v6-c-compass__panel--BoxShadow);
|
|
137
130
|
}
|
|
138
|
-
:root:where(.pf-v6-theme-dark) .pf-v6-c-compass__panel {
|
|
139
|
-
--pf-v6-c-compass__panel--BackdropFilter: var(--pf-v6-c-compass__panel--BackdropFilter--dark);
|
|
140
|
-
--pf-v6-c-compass__panel--BackgroundColor: var(--pf-v6-c-compass__panel--BackgroundColor--dark);
|
|
141
|
-
}
|
|
142
131
|
.pf-v6-c-compass__panel.pf-m-no-border {
|
|
143
132
|
border-width: 0;
|
|
144
133
|
}
|
|
@@ -178,13 +167,6 @@
|
|
|
178
167
|
width: min(var(--pf-v6-c-compass__hero-body--Width), var(--pf-v6-c-compass__hero-body--MaxWidth));
|
|
179
168
|
}
|
|
180
169
|
|
|
181
|
-
:where(:root.pf-v6-theme-no-glass) .pf-v6-c-compass {
|
|
182
|
-
--pf-v6-c-compass--glass--opacity: 100%;
|
|
183
|
-
--pf-v6-c-compass--glass--border: var(--pf-t--global--border--color--default);
|
|
184
|
-
--pf-v6-c-compass--glass--blend-mode: none;
|
|
185
|
-
--pf-v6-c-compass--glass--blend-mode--dark: none;
|
|
186
|
-
}
|
|
187
|
-
|
|
188
170
|
/* stylelint-disable */
|
|
189
171
|
@media (max-width: 1200px) {
|
|
190
172
|
.pf-v6-c-compass * {
|
|
@@ -10,15 +10,8 @@
|
|
|
10
10
|
--#{$compass}__nav--RowGap: var(--pf-t--global--spacer--gap--group--vertical);
|
|
11
11
|
--#{$compass}__sidebar--Padding: var(--pf-t--global--spacer--sm);
|
|
12
12
|
--#{$compass}__main--RowGap: var(--pf-t--global--spacer--md);
|
|
13
|
-
--#{$compass}__panel--BackgroundColor--
|
|
14
|
-
--#{$compass}__panel--
|
|
15
|
-
--#{$compass}__panel--BackgroundColor--light: rgba(var(--#{$compass}__panel--BackgroundColor--rgb--light), var(--#{$compass}__panel--BackgroundColor--opacity--light));
|
|
16
|
-
--#{$compass}__panel--BackgroundColor--rgb--dark: 29,29,29;
|
|
17
|
-
--#{$compass}__panel--BackgroundColor--opacity--dark: .8;
|
|
18
|
-
--#{$compass}__panel--BackgroundColor--dark: rgba(var(--#{$compass}__panel--BackgroundColor--rgb--dark), var(--#{$compass}__panel--BackgroundColor--opacity--dark));
|
|
19
|
-
--#{$compass}__panel--BackdropFilter: var(--#{$compass}__panel--BackdropFilter--light);
|
|
20
|
-
--#{$compass}__panel--BackdropFilter--light: blur(12.5px);
|
|
21
|
-
--#{$compass}__panel--BackdropFilter--dark: blur(12.5px);
|
|
13
|
+
--#{$compass}__panel--BackgroundColor: var(--pf-t--global--background--color--glass--default);
|
|
14
|
+
--#{$compass}__panel--BackdropFilter: var(--pf-t--global--background--color--glass--filter);
|
|
22
15
|
--#{$compass}__panel--BorderRadius: var(--pf-t--global--border--radius--large);
|
|
23
16
|
--#{$compass}__panel--m-pill--BorderRadius: var(--pf-t--global--border--radius--pill);
|
|
24
17
|
--#{$compass}__panel--Padding: var(--pf-t--global--spacer--inset--page-chrome);
|
|
@@ -151,17 +144,12 @@
|
|
|
151
144
|
|
|
152
145
|
.#{$compass}__panel {
|
|
153
146
|
padding: var(--#{$compass}__panel--Padding);
|
|
154
|
-
background-color: var(--#{$compass}__panel--BackgroundColor
|
|
155
|
-
backdrop-filter: var(--#{$compass}__panel--BackdropFilter
|
|
147
|
+
background-color: var(--#{$compass}__panel--BackgroundColor);
|
|
148
|
+
backdrop-filter: var(--#{$compass}__panel--BackdropFilter);
|
|
156
149
|
border: var(--#{$compass}__panel--BorderWidth) solid var(--#{$compass}__panel--BorderColor);
|
|
157
150
|
border-radius: var(--#{$compass}__panel--BorderRadius);
|
|
158
151
|
box-shadow: var(--#{$compass}__panel--BoxShadow);
|
|
159
152
|
|
|
160
|
-
:root:where(.pf-v6-theme-dark) & {
|
|
161
|
-
--#{$compass}__panel--BackdropFilter: var(--#{$compass}__panel--BackdropFilter--dark);
|
|
162
|
-
--#{$compass}__panel--BackgroundColor: var(--#{$compass}__panel--BackgroundColor--dark);
|
|
163
|
-
}
|
|
164
|
-
|
|
165
153
|
&.pf-m-no-border {
|
|
166
154
|
border-width: 0;
|
|
167
155
|
}
|
|
@@ -213,13 +201,6 @@
|
|
|
213
201
|
width: min(var(--#{$compass}__hero-body--Width), var(--#{$compass}__hero-body--MaxWidth));
|
|
214
202
|
}
|
|
215
203
|
|
|
216
|
-
:where(:root.pf-v6-theme-no-glass) .#{$compass} {
|
|
217
|
-
--#{$compass}--glass--opacity: 100%;
|
|
218
|
-
--#{$compass}--glass--border: var(--pf-t--global--border--color--default);
|
|
219
|
-
--#{$compass}--glass--blend-mode: none;
|
|
220
|
-
--#{$compass}--glass--blend-mode--dark: none;
|
|
221
|
-
}
|
|
222
|
-
|
|
223
204
|
:where(.pf-v6-theme-dark) .#{$compass} {
|
|
224
205
|
// dark theme goes here
|
|
225
206
|
}
|
|
@@ -53,6 +53,9 @@
|
|
|
53
53
|
--pf-v6-c-drawer--m-pill__panel--BorderColor: var(--pf-t--global--border--color--default);
|
|
54
54
|
--pf-v6-c-drawer--m-pill__panel--BorderRadius: var(--pf-t--global--border--radius--large);
|
|
55
55
|
--pf-v6-c-drawer--m-pill--m-expanded__panel--inset: var(--pf-t--global--spacer--inset--page-chrome);
|
|
56
|
+
--pf-v6-c-drawer__panel--m-glass--BackgroundColor: var(--pf-t--global--background--color--glass--default);
|
|
57
|
+
--pf-v6-c-drawer__panel--m-glass--BackdropFilter: var(--pf-t--global--background--color--glass--filter);
|
|
58
|
+
--pf-v6-c-drawer__panel--m-glass--BorderColor: var(--pf-t--global--border--color--alt);
|
|
56
59
|
--pf-v6-c-drawer__head--ColumnGap: var(--pf-t--global--spacer--gap--text-to-element--default);
|
|
57
60
|
--pf-v6-c-drawer__head--PaddingBlockStart: var(--pf-t--global--spacer--sm);
|
|
58
61
|
--pf-v6-c-drawer__head--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
|
|
@@ -313,6 +316,11 @@
|
|
|
313
316
|
.pf-v6-c-drawer__panel.pf-m-no-background {
|
|
314
317
|
--pf-v6-c-drawer__panel--BackgroundColor: transparent;
|
|
315
318
|
}
|
|
319
|
+
.pf-v6-c-drawer__panel.pf-m-glass {
|
|
320
|
+
--pf-v6-c-drawer__panel--BackgroundColor: var(--pf-v6-c-drawer__panel--m-glass--BackgroundColor);
|
|
321
|
+
--pf-v6-c-drawer__panel--BorderColor: var(--pf-v6-c-drawer__panel--m-glass--BorderColor);
|
|
322
|
+
backdrop-filter: var(--pf-v6-c-drawer__panel--m-glass--BackdropFilter);
|
|
323
|
+
}
|
|
316
324
|
@media screen and (min-width: 48rem) {
|
|
317
325
|
.pf-v6-c-drawer__panel {
|
|
318
326
|
--pf-v6-c-drawer__panel--FlexBasis:
|
|
@@ -67,6 +67,9 @@ $pf-v6-c-drawer__panel--list--width: (25, 33, 50, 66, 75, 100);
|
|
|
67
67
|
--#{$drawer}--m-pill__panel--BorderColor: var(--pf-t--global--border--color--default);
|
|
68
68
|
--#{$drawer}--m-pill__panel--BorderRadius: var(--pf-t--global--border--radius--large);
|
|
69
69
|
--#{$drawer}--m-pill--m-expanded__panel--inset: var(--pf-t--global--spacer--inset--page-chrome);
|
|
70
|
+
--#{$drawer}__panel--m-glass--BackgroundColor: var(--pf-t--global--background--color--glass--default);
|
|
71
|
+
--#{$drawer}__panel--m-glass--BackdropFilter: var(--pf-t--global--background--color--glass--filter);
|
|
72
|
+
--#{$drawer}__panel--m-glass--BorderColor: var(--pf-t--global--border--color--alt);
|
|
70
73
|
|
|
71
74
|
@media screen and (prefers-reduced-motion: no-preference) {
|
|
72
75
|
--#{$drawer}__panel--TransitionDuration--slide: var(--pf-t--global--motion--duration--slide-in--short);
|
|
@@ -390,6 +393,13 @@ $pf-v6-c-drawer__panel--list--width: (25, 33, 50, 66, 75, 100);
|
|
|
390
393
|
--#{$drawer}__panel--BackgroundColor: transparent;
|
|
391
394
|
}
|
|
392
395
|
|
|
396
|
+
&.pf-m-glass {
|
|
397
|
+
--#{$drawer}__panel--BackgroundColor: var(--#{$drawer}__panel--m-glass--BackgroundColor);
|
|
398
|
+
--#{$drawer}__panel--BorderColor: var(--#{$drawer}__panel--m-glass--BorderColor);
|
|
399
|
+
|
|
400
|
+
backdrop-filter: var(--#{$drawer}__panel--m-glass--BackdropFilter);
|
|
401
|
+
}
|
|
402
|
+
|
|
393
403
|
@media screen and (min-width: $pf-v6-global--breakpoint--md) {
|
|
394
404
|
--#{$drawer}__panel--FlexBasis:
|
|
395
405
|
max(
|
package/components/Tabs/tabs.css
CHANGED
|
@@ -449,7 +449,6 @@
|
|
|
449
449
|
.pf-v6-c-tabs.pf-m-nav {
|
|
450
450
|
--pf-v6-c-tabs__link--disabled--BackgroundColor: transparent;
|
|
451
451
|
--pf-v6-c-tabs__link--disabled--Color: var(--pf-v6-c-tabs--m-nav__link--disabled--Color);
|
|
452
|
-
--pf-v6-c-tabs__link--hover--BorderColor: transparent;
|
|
453
452
|
--pf-v6-c-tabs__link--BorderRadius: var(--pf-v6-c-tabs--m-nav__link--BorderRadius);
|
|
454
453
|
}
|
|
455
454
|
.pf-v6-c-tabs.pf-m-nav::before,
|
|
@@ -520,7 +520,6 @@ $pf-v6-c-tabs--spacer-map: build-spacer-map("none", "sm", "md", "lg", "xl", "2xl
|
|
|
520
520
|
&.pf-m-nav {
|
|
521
521
|
--#{$tabs}__link--disabled--BackgroundColor: transparent;
|
|
522
522
|
--#{$tabs}__link--disabled--Color: var(--#{$tabs}--m-nav__link--disabled--Color);
|
|
523
|
-
--#{$tabs}__link--hover--BorderColor: transparent;
|
|
524
523
|
--#{$tabs}__link--BorderRadius: var(--#{$tabs}--m-nav__link--BorderRadius);
|
|
525
524
|
|
|
526
525
|
&::before,
|
package/components/_index.css
CHANGED
|
@@ -3517,15 +3517,8 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
|
|
|
3517
3517
|
--pf-v6-c-compass__nav--RowGap: var(--pf-t--global--spacer--gap--group--vertical);
|
|
3518
3518
|
--pf-v6-c-compass__sidebar--Padding: var(--pf-t--global--spacer--sm);
|
|
3519
3519
|
--pf-v6-c-compass__main--RowGap: var(--pf-t--global--spacer--md);
|
|
3520
|
-
--pf-v6-c-compass__panel--BackgroundColor--
|
|
3521
|
-
--pf-v6-c-compass__panel--
|
|
3522
|
-
--pf-v6-c-compass__panel--BackgroundColor--light: rgba(var(--pf-v6-c-compass__panel--BackgroundColor--rgb--light), var(--pf-v6-c-compass__panel--BackgroundColor--opacity--light));
|
|
3523
|
-
--pf-v6-c-compass__panel--BackgroundColor--rgb--dark: 29,29,29;
|
|
3524
|
-
--pf-v6-c-compass__panel--BackgroundColor--opacity--dark: .8;
|
|
3525
|
-
--pf-v6-c-compass__panel--BackgroundColor--dark: rgba(var(--pf-v6-c-compass__panel--BackgroundColor--rgb--dark), var(--pf-v6-c-compass__panel--BackgroundColor--opacity--dark));
|
|
3526
|
-
--pf-v6-c-compass__panel--BackdropFilter: var(--pf-v6-c-compass__panel--BackdropFilter--light);
|
|
3527
|
-
--pf-v6-c-compass__panel--BackdropFilter--light: blur(12.5px);
|
|
3528
|
-
--pf-v6-c-compass__panel--BackdropFilter--dark: blur(12.5px);
|
|
3520
|
+
--pf-v6-c-compass__panel--BackgroundColor: var(--pf-t--global--background--color--glass--default);
|
|
3521
|
+
--pf-v6-c-compass__panel--BackdropFilter: var(--pf-t--global--background--color--glass--filter);
|
|
3529
3522
|
--pf-v6-c-compass__panel--BorderRadius: var(--pf-t--global--border--radius--large);
|
|
3530
3523
|
--pf-v6-c-compass__panel--m-pill--BorderRadius: var(--pf-t--global--border--radius--pill);
|
|
3531
3524
|
--pf-v6-c-compass__panel--Padding: var(--pf-t--global--spacer--inset--page-chrome);
|
|
@@ -3638,16 +3631,12 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
|
|
|
3638
3631
|
|
|
3639
3632
|
.pf-v6-c-compass__panel {
|
|
3640
3633
|
padding: var(--pf-v6-c-compass__panel--Padding);
|
|
3641
|
-
background-color: var(--pf-v6-c-compass__panel--BackgroundColor
|
|
3642
|
-
backdrop-filter: var(--pf-v6-c-compass__panel--BackdropFilter
|
|
3634
|
+
background-color: var(--pf-v6-c-compass__panel--BackgroundColor);
|
|
3635
|
+
backdrop-filter: var(--pf-v6-c-compass__panel--BackdropFilter);
|
|
3643
3636
|
border: var(--pf-v6-c-compass__panel--BorderWidth) solid var(--pf-v6-c-compass__panel--BorderColor);
|
|
3644
3637
|
border-radius: var(--pf-v6-c-compass__panel--BorderRadius);
|
|
3645
3638
|
box-shadow: var(--pf-v6-c-compass__panel--BoxShadow);
|
|
3646
3639
|
}
|
|
3647
|
-
:root:where(.pf-v6-theme-dark) .pf-v6-c-compass__panel {
|
|
3648
|
-
--pf-v6-c-compass__panel--BackdropFilter: var(--pf-v6-c-compass__panel--BackdropFilter--dark);
|
|
3649
|
-
--pf-v6-c-compass__panel--BackgroundColor: var(--pf-v6-c-compass__panel--BackgroundColor--dark);
|
|
3650
|
-
}
|
|
3651
3640
|
.pf-v6-c-compass__panel.pf-m-no-border {
|
|
3652
3641
|
border-width: 0;
|
|
3653
3642
|
}
|
|
@@ -3687,13 +3676,6 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
|
|
|
3687
3676
|
width: min(var(--pf-v6-c-compass__hero-body--Width), var(--pf-v6-c-compass__hero-body--MaxWidth));
|
|
3688
3677
|
}
|
|
3689
3678
|
|
|
3690
|
-
:where(:root.pf-v6-theme-no-glass) .pf-v6-c-compass {
|
|
3691
|
-
--pf-v6-c-compass--glass--opacity: 100%;
|
|
3692
|
-
--pf-v6-c-compass--glass--border: var(--pf-t--global--border--color--default);
|
|
3693
|
-
--pf-v6-c-compass--glass--blend-mode: none;
|
|
3694
|
-
--pf-v6-c-compass--glass--blend-mode--dark: none;
|
|
3695
|
-
}
|
|
3696
|
-
|
|
3697
3679
|
/* stylelint-disable */
|
|
3698
3680
|
@media (max-width: 1200px) {
|
|
3699
3681
|
.pf-v6-c-compass * {
|
|
@@ -6035,6 +6017,9 @@ ul) {
|
|
|
6035
6017
|
--pf-v6-c-drawer--m-pill__panel--BorderColor: var(--pf-t--global--border--color--default);
|
|
6036
6018
|
--pf-v6-c-drawer--m-pill__panel--BorderRadius: var(--pf-t--global--border--radius--large);
|
|
6037
6019
|
--pf-v6-c-drawer--m-pill--m-expanded__panel--inset: var(--pf-t--global--spacer--inset--page-chrome);
|
|
6020
|
+
--pf-v6-c-drawer__panel--m-glass--BackgroundColor: var(--pf-t--global--background--color--glass--default);
|
|
6021
|
+
--pf-v6-c-drawer__panel--m-glass--BackdropFilter: var(--pf-t--global--background--color--glass--filter);
|
|
6022
|
+
--pf-v6-c-drawer__panel--m-glass--BorderColor: var(--pf-t--global--border--color--alt);
|
|
6038
6023
|
--pf-v6-c-drawer__head--ColumnGap: var(--pf-t--global--spacer--gap--text-to-element--default);
|
|
6039
6024
|
--pf-v6-c-drawer__head--PaddingBlockStart: var(--pf-t--global--spacer--sm);
|
|
6040
6025
|
--pf-v6-c-drawer__head--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
|
|
@@ -6295,6 +6280,11 @@ ul) {
|
|
|
6295
6280
|
.pf-v6-c-drawer__panel.pf-m-no-background {
|
|
6296
6281
|
--pf-v6-c-drawer__panel--BackgroundColor: transparent;
|
|
6297
6282
|
}
|
|
6283
|
+
.pf-v6-c-drawer__panel.pf-m-glass {
|
|
6284
|
+
--pf-v6-c-drawer__panel--BackgroundColor: var(--pf-v6-c-drawer__panel--m-glass--BackgroundColor);
|
|
6285
|
+
--pf-v6-c-drawer__panel--BorderColor: var(--pf-v6-c-drawer__panel--m-glass--BorderColor);
|
|
6286
|
+
backdrop-filter: var(--pf-v6-c-drawer__panel--m-glass--BackdropFilter);
|
|
6287
|
+
}
|
|
6298
6288
|
@media screen and (min-width: 48rem) {
|
|
6299
6289
|
.pf-v6-c-drawer__panel {
|
|
6300
6290
|
--pf-v6-c-drawer__panel--FlexBasis:
|
|
@@ -20247,7 +20237,6 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
|
20247
20237
|
.pf-v6-c-tabs.pf-m-nav {
|
|
20248
20238
|
--pf-v6-c-tabs__link--disabled--BackgroundColor: transparent;
|
|
20249
20239
|
--pf-v6-c-tabs__link--disabled--Color: var(--pf-v6-c-tabs--m-nav__link--disabled--Color);
|
|
20250
|
-
--pf-v6-c-tabs__link--hover--BorderColor: transparent;
|
|
20251
20240
|
--pf-v6-c-tabs__link--BorderRadius: var(--pf-v6-c-tabs--m-nav__link--BorderRadius);
|
|
20252
20241
|
}
|
|
20253
20242
|
.pf-v6-c-tabs.pf-m-nav::before,
|