@patternfly/patternfly 6.0.0-alpha.24 → 6.0.0-alpha.26

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 (11) hide show
  1. package/components/BackToTop/back-to-top.css +17 -15
  2. package/components/BackToTop/back-to-top.scss +12 -11
  3. package/components/SkipToContent/skip-to-content.css +6 -3
  4. package/components/SkipToContent/skip-to-content.scss +8 -6
  5. package/components/Tooltip/tooltip.scss +1 -1
  6. package/package.json +2 -2
  7. package/patternfly-no-globals.css +23 -18
  8. package/patternfly-theme-dark-unversioned.css +23 -18
  9. package/patternfly.css +23 -18
  10. package/patternfly.min.css +1 -1
  11. package/patternfly.min.css.map +1 -1
package/components/BackToTop/back-to-top.css CHANGED
@@ -1,23 +1,25 @@
1
- .pf-v5-c-back-to-top {
2
- --pf-v5-c-back-to-top--Right: var(--pf-v5-global--spacer--2xl);
3
- --pf-v5-c-back-to-top--Bottom: var(--pf-v5-global--spacer--lg);
4
- --pf-v5-c-back-to-top--md--Bottom: var(--pf-v5-global--spacer--2xl);
5
- --pf-v5-c-back-to-top--c-button--FontSize: var(--pf-v5-global--FontSize--xs);
6
- --pf-v5-c-back-to-top--c-button--BorderRadius: var(--pf-v5-global--BorderRadius--lg);
7
- --pf-v5-c-back-to-top--c-button--PaddingTop: var(--pf-v5-global--spacer--xs);
8
- --pf-v5-c-back-to-top--c-button--PaddingRight: var(--pf-v5-global--spacer--sm);
9
- --pf-v5-c-back-to-top--c-button--PaddingBottom: var(--pf-v5-global--spacer--xs);
10
- --pf-v5-c-back-to-top--c-button--PaddingLeft: var(--pf-v5-global--spacer--sm);
11
- --pf-v5-c-back-to-top--c-button--BoxShadow: var(--pf-v5-global--BoxShadow--lg-bottom);
12
- position: absolute;
13
- inset-block-end: var(--pf-v5-c-back-to-top--Bottom);
14
- inset-inline-end: var(--pf-v5-c-back-to-top--Right);
1
+ :root {
2
+ --pf-v5-c-back-to-top--Right: var(--pf-t--global--spacer--2xl);
3
+ --pf-v5-c-back-to-top--Bottom: var(--pf-t--global--spacer--lg);
4
+ --pf-v5-c-back-to-top--md--Bottom: var(--pf-t--global--spacer--2xl);
5
+ --pf-v5-c-back-to-top--c-button--FontSize: var(--pf-t--global--font--size--body--sm);
6
+ --pf-v5-c-back-to-top--c-button--PaddingTop: var(--pf-t--global--spacer--xs);
7
+ --pf-v5-c-back-to-top--c-button--PaddingRight: var(--pf-t--global--spacer--sm);
8
+ --pf-v5-c-back-to-top--c-button--PaddingBottom: var(--pf-t--global--spacer--xs);
9
+ --pf-v5-c-back-to-top--c-button--PaddingLeft: var(--pf-t--global--spacer--sm);
10
+ --pf-v5-c-back-to-top--c-button--BoxShadow: var(--pf-t--global--box-shadow--sm);
15
11
  }
16
12
  @media (min-width: 768px) {
17
- .pf-v5-c-back-to-top {
13
+ :root {
18
14
  --pf-v5-c-back-to-top--Bottom: var(--pf-v5-c-back-to-top--md--Bottom);
19
15
  }
20
16
  }
17
+
18
+ .pf-v5-c-back-to-top {
19
+ position: absolute;
20
+ inset-block-end: var(--pf-v5-c-back-to-top--Bottom);
21
+ inset-inline-end: var(--pf-v5-c-back-to-top--Right);
22
+ }
21
23
  .pf-v5-c-back-to-top.pf-m-hidden {
22
24
  display: none;
23
25
  }
package/components/BackToTop/back-to-top.scss CHANGED
@@ -1,21 +1,22 @@
1
1
  // @debug $back-to-top; // check your variable names located in src/patternfly/sass-utilities/component-namespaces.scss
2
2
 
3
- .#{$back-to-top} {
4
- --#{$back-to-top}--Right: var(--#{$pf-global}--spacer--2xl);
5
- --#{$back-to-top}--Bottom: var(--#{$pf-global}--spacer--lg);
6
- --#{$back-to-top}--md--Bottom: var(--#{$pf-global}--spacer--2xl);
7
- --#{$back-to-top}--c-button--FontSize: var(--#{$pf-global}--FontSize--xs);
8
- --#{$back-to-top}--c-button--BorderRadius: var(--#{$pf-global}--BorderRadius--lg);
9
- --#{$back-to-top}--c-button--PaddingTop: var(--#{$pf-global}--spacer--xs);
10
- --#{$back-to-top}--c-button--PaddingRight: var(--#{$pf-global}--spacer--sm);
11
- --#{$back-to-top}--c-button--PaddingBottom: var(--#{$pf-global}--spacer--xs);
12
- --#{$back-to-top}--c-button--PaddingLeft: var(--#{$pf-global}--spacer--sm);
13
- --#{$back-to-top}--c-button--BoxShadow: var(--#{$pf-global}--BoxShadow--lg-bottom);
3
+ :root {
4
+ --#{$back-to-top}--Right: var(--pf-t--global--spacer--2xl);
5
+ --#{$back-to-top}--Bottom: var(--pf-t--global--spacer--lg);
6
+ --#{$back-to-top}--md--Bottom: var(--pf-t--global--spacer--2xl);
7
+ --#{$back-to-top}--c-button--FontSize: var(--pf-t--global--font--size--body--sm);
8
+ --#{$back-to-top}--c-button--PaddingTop: var(--pf-t--global--spacer--xs);
9
+ --#{$back-to-top}--c-button--PaddingRight: var(--pf-t--global--spacer--sm);
10
+ --#{$back-to-top}--c-button--PaddingBottom: var(--pf-t--global--spacer--xs);
11
+ --#{$back-to-top}--c-button--PaddingLeft: var(--pf-t--global--spacer--sm);
12
+ --#{$back-to-top}--c-button--BoxShadow: var(--pf-t--global--box-shadow--sm);
14
13
 
15
14
  @media (min-width: $pf-v5-global--breakpoint--md) {
16
15
  --#{$back-to-top}--Bottom: var(--#{$back-to-top}--md--Bottom);
17
16
  }
17
+ }
18
18
 
19
+ .#{$back-to-top} {
19
20
  position: absolute;
20
21
  inset-block-end: var(--#{$back-to-top}--Bottom);
21
22
  inset-inline-end: var(--#{$back-to-top}--Right);
package/components/SkipToContent/skip-to-content.css CHANGED
@@ -1,7 +1,10 @@
1
- .pf-v5-c-skip-to-content {
2
- --pf-v5-c-skip-to-content--Top: var(--pf-v5-global--spacer--md);
1
+ :root {
2
+ --pf-v5-c-skip-to-content--Top: var(--pf-t--global--spacer--md);
3
3
  --pf-v5-c-skip-to-content--ZIndex: var(--pf-v5-global--ZIndex--2xl);
4
- --pf-v5-c-skip-to-content--focus--Left: var(--pf-v5-global--spacer--md);
4
+ --pf-v5-c-skip-to-content--focus--Left: var(--pf-t--global--spacer--md);
5
+ }
6
+
7
+ .pf-v5-c-skip-to-content {
5
8
  position: absolute;
6
9
  inset-block-start: var(--pf-v5-c-skip-to-content--Top);
7
10
  inset-inline-start: -300%;
package/components/SkipToContent/skip-to-content.scss CHANGED
@@ -1,16 +1,18 @@
1
1
  // @debug $skip-to-content; // check your variable names located in src/patternfly/sass-utilities/component-namespaces.scss
2
2
 
3
- .#{$skip-to-content} {
4
- --#{$skip-to-content}--Top: var(--#{$pf-global}--spacer--md);
3
+ :root {
4
+ --#{$skip-to-content}--Top: var(--pf-t--global--spacer--md);
5
5
  --#{$skip-to-content}--ZIndex: var(--#{$pf-global}--ZIndex--2xl);
6
- --#{$skip-to-content}--focus--Left: var(--#{$pf-global}--spacer--md);
6
+ --#{$skip-to-content}--focus--Left: var(--pf-t--global--spacer--md);
7
+ }
7
8
 
9
+ .#{$skip-to-content} {
8
10
  position: absolute;
9
- inset-block-start: var(--#{$skip-to-content}--Top);
10
- inset-inline-start: -300%; // moves off screen
11
+ inset-block-start: var(--#{$skip-to-content}--Top);
12
+ inset-inline-start: -300%; // moves off screen
11
13
  z-index: var(--#{$skip-to-content}--ZIndex);
12
14
 
13
15
  &:focus-within {
14
- inset-inline-start: var(--#{$skip-to-content}--focus--Left);
16
+ inset-inline-start: var(--#{$skip-to-content}--focus--Left);
15
17
  }
16
18
  }
package/components/Tooltip/tooltip.scss CHANGED
@@ -54,7 +54,7 @@
54
54
  .pf-m-bottom,
55
55
  .pf-m-bottom-left,
56
56
  .pf-m-bottom-right
57
- ) {
57
+ ) {
58
58
  --#{$tooltip}__arrow--Top: var(--#{$tooltip}--m-bottom--Top, 0);
59
59
  --#{$tooltip}__arrow--Left: var(--#{$tooltip}--m-bottom--Left, 50%);
60
60
  --#{$tooltip}__arrow--TranslateX: var(--#{$tooltip}__arrow--m-bottom--TranslateX);
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@patternfly/patternfly",
3
3
  "description": "Assets, source, tooling, and content for PatternFly 4",
4
- "version": "6.0.0-alpha.24",
4
+ "version": "6.0.0-alpha.26",
5
5
  "keywords": [],
6
6
  "license": "MIT",
7
7
  "scripts": {
@@ -45,7 +45,7 @@
45
45
  "@commitlint/config-conventional": "^17.6.7",
46
46
  "@fortawesome/fontawesome": "^1.1.8",
47
47
  "@octokit/rest": "^20.0.1",
48
- "@patternfly/documentation-framework": "5.3.1",
48
+ "@patternfly/documentation-framework": "5.3.8",
49
49
  "@patternfly/patternfly-a11y": "4.3.1",
50
50
  "@patternfly/react-code-editor": "5.1.1",
51
51
  "@patternfly/react-core": "5.1.1",
package/patternfly-no-globals.css CHANGED
@@ -7470,26 +7470,28 @@
7470
7470
  --pf-v5-c-background-image--BackgroundPosition: bottom left;
7471
7471
  }
7472
7472
 
7473
- .pf-v5-c-back-to-top {
7474
- --pf-v5-c-back-to-top--Right: var(--pf-v5-global--spacer--2xl);
7475
- --pf-v5-c-back-to-top--Bottom: var(--pf-v5-global--spacer--lg);
7476
- --pf-v5-c-back-to-top--md--Bottom: var(--pf-v5-global--spacer--2xl);
7477
- --pf-v5-c-back-to-top--c-button--FontSize: var(--pf-v5-global--FontSize--xs);
7478
- --pf-v5-c-back-to-top--c-button--BorderRadius: var(--pf-v5-global--BorderRadius--lg);
7479
- --pf-v5-c-back-to-top--c-button--PaddingTop: var(--pf-v5-global--spacer--xs);
7480
- --pf-v5-c-back-to-top--c-button--PaddingRight: var(--pf-v5-global--spacer--sm);
7481
- --pf-v5-c-back-to-top--c-button--PaddingBottom: var(--pf-v5-global--spacer--xs);
7482
- --pf-v5-c-back-to-top--c-button--PaddingLeft: var(--pf-v5-global--spacer--sm);
7483
- --pf-v5-c-back-to-top--c-button--BoxShadow: var(--pf-v5-global--BoxShadow--lg-bottom);
7484
- position: absolute;
7485
- inset-block-end: var(--pf-v5-c-back-to-top--Bottom);
7486
- inset-inline-end: var(--pf-v5-c-back-to-top--Right);
7473
+ :root {
7474
+ --pf-v5-c-back-to-top--Right: var(--pf-t--global--spacer--2xl);
7475
+ --pf-v5-c-back-to-top--Bottom: var(--pf-t--global--spacer--lg);
7476
+ --pf-v5-c-back-to-top--md--Bottom: var(--pf-t--global--spacer--2xl);
7477
+ --pf-v5-c-back-to-top--c-button--FontSize: var(--pf-t--global--font--size--body--sm);
7478
+ --pf-v5-c-back-to-top--c-button--PaddingTop: var(--pf-t--global--spacer--xs);
7479
+ --pf-v5-c-back-to-top--c-button--PaddingRight: var(--pf-t--global--spacer--sm);
7480
+ --pf-v5-c-back-to-top--c-button--PaddingBottom: var(--pf-t--global--spacer--xs);
7481
+ --pf-v5-c-back-to-top--c-button--PaddingLeft: var(--pf-t--global--spacer--sm);
7482
+ --pf-v5-c-back-to-top--c-button--BoxShadow: var(--pf-t--global--box-shadow--sm);
7487
7483
  }
7488
7484
  @media (min-width: 768px) {
7489
- .pf-v5-c-back-to-top {
7485
+ :root {
7490
7486
  --pf-v5-c-back-to-top--Bottom: var(--pf-v5-c-back-to-top--md--Bottom);
7491
7487
  }
7492
7488
  }
7489
+
7490
+ .pf-v5-c-back-to-top {
7491
+ position: absolute;
7492
+ inset-block-end: var(--pf-v5-c-back-to-top--Bottom);
7493
+ inset-inline-end: var(--pf-v5-c-back-to-top--Right);
7494
+ }
7493
7495
  .pf-v5-c-back-to-top.pf-m-hidden {
7494
7496
  display: none;
7495
7497
  }
@@ -25230,10 +25232,13 @@ label.pf-v5-c-radio, .pf-v5-c-radio__label,
25230
25232
  --pf-v5-c-skeleton--after--LinearGradientColorStop3: var(--pf-v5-global--palette--black-600);
25231
25233
  }
25232
25234
 
25233
- .pf-v5-c-skip-to-content {
25234
- --pf-v5-c-skip-to-content--Top: var(--pf-v5-global--spacer--md);
25235
+ :root {
25236
+ --pf-v5-c-skip-to-content--Top: var(--pf-t--global--spacer--md);
25235
25237
  --pf-v5-c-skip-to-content--ZIndex: var(--pf-v5-global--ZIndex--2xl);
25236
- --pf-v5-c-skip-to-content--focus--Left: var(--pf-v5-global--spacer--md);
25238
+ --pf-v5-c-skip-to-content--focus--Left: var(--pf-t--global--spacer--md);
25239
+ }
25240
+
25241
+ .pf-v5-c-skip-to-content {
25237
25242
  position: absolute;
25238
25243
  inset-block-start: var(--pf-v5-c-skip-to-content--Top);
25239
25244
  inset-inline-start: -300%;
package/patternfly-theme-dark-unversioned.css CHANGED
@@ -7586,26 +7586,28 @@ button) {
7586
7586
  --pf-v5-c-background-image--BackgroundPosition: bottom left;
7587
7587
  }
7588
7588
 
7589
- .pf-v5-c-back-to-top {
7590
- --pf-v5-c-back-to-top--Right: var(--pf-v5-global--spacer--2xl);
7591
- --pf-v5-c-back-to-top--Bottom: var(--pf-v5-global--spacer--lg);
7592
- --pf-v5-c-back-to-top--md--Bottom: var(--pf-v5-global--spacer--2xl);
7593
- --pf-v5-c-back-to-top--c-button--FontSize: var(--pf-v5-global--FontSize--xs);
7594
- --pf-v5-c-back-to-top--c-button--BorderRadius: var(--pf-v5-global--BorderRadius--lg);
7595
- --pf-v5-c-back-to-top--c-button--PaddingTop: var(--pf-v5-global--spacer--xs);
7596
- --pf-v5-c-back-to-top--c-button--PaddingRight: var(--pf-v5-global--spacer--sm);
7597
- --pf-v5-c-back-to-top--c-button--PaddingBottom: var(--pf-v5-global--spacer--xs);
7598
- --pf-v5-c-back-to-top--c-button--PaddingLeft: var(--pf-v5-global--spacer--sm);
7599
- --pf-v5-c-back-to-top--c-button--BoxShadow: var(--pf-v5-global--BoxShadow--lg-bottom);
7600
- position: absolute;
7601
- inset-block-end: var(--pf-v5-c-back-to-top--Bottom);
7602
- inset-inline-end: var(--pf-v5-c-back-to-top--Right);
7589
+ :root {
7590
+ --pf-v5-c-back-to-top--Right: var(--pf-t--global--spacer--2xl);
7591
+ --pf-v5-c-back-to-top--Bottom: var(--pf-t--global--spacer--lg);
7592
+ --pf-v5-c-back-to-top--md--Bottom: var(--pf-t--global--spacer--2xl);
7593
+ --pf-v5-c-back-to-top--c-button--FontSize: var(--pf-t--global--font--size--body--sm);
7594
+ --pf-v5-c-back-to-top--c-button--PaddingTop: var(--pf-t--global--spacer--xs);
7595
+ --pf-v5-c-back-to-top--c-button--PaddingRight: var(--pf-t--global--spacer--sm);
7596
+ --pf-v5-c-back-to-top--c-button--PaddingBottom: var(--pf-t--global--spacer--xs);
7597
+ --pf-v5-c-back-to-top--c-button--PaddingLeft: var(--pf-t--global--spacer--sm);
7598
+ --pf-v5-c-back-to-top--c-button--BoxShadow: var(--pf-t--global--box-shadow--sm);
7603
7599
  }
7604
7600
  @media (min-width: 768px) {
7605
- .pf-v5-c-back-to-top {
7601
+ :root {
7606
7602
  --pf-v5-c-back-to-top--Bottom: var(--pf-v5-c-back-to-top--md--Bottom);
7607
7603
  }
7608
7604
  }
7605
+
7606
+ .pf-v5-c-back-to-top {
7607
+ position: absolute;
7608
+ inset-block-end: var(--pf-v5-c-back-to-top--Bottom);
7609
+ inset-inline-end: var(--pf-v5-c-back-to-top--Right);
7610
+ }
7609
7611
  .pf-v5-c-back-to-top.pf-m-hidden {
7610
7612
  display: none;
7611
7613
  }
@@ -25346,10 +25348,13 @@ label.pf-v5-c-radio, .pf-v5-c-radio__label,
25346
25348
  --pf-v5-c-skeleton--after--LinearGradientColorStop3: var(--pf-v5-global--palette--black-600);
25347
25349
  }
25348
25350
 
25349
- .pf-v5-c-skip-to-content {
25350
- --pf-v5-c-skip-to-content--Top: var(--pf-v5-global--spacer--md);
25351
+ :root {
25352
+ --pf-v5-c-skip-to-content--Top: var(--pf-t--global--spacer--md);
25351
25353
  --pf-v5-c-skip-to-content--ZIndex: var(--pf-v5-global--ZIndex--2xl);
25352
- --pf-v5-c-skip-to-content--focus--Left: var(--pf-v5-global--spacer--md);
25354
+ --pf-v5-c-skip-to-content--focus--Left: var(--pf-t--global--spacer--md);
25355
+ }
25356
+
25357
+ .pf-v5-c-skip-to-content {
25353
25358
  position: absolute;
25354
25359
  inset-block-start: var(--pf-v5-c-skip-to-content--Top);
25355
25360
  inset-inline-start: -300%;
package/patternfly.css CHANGED
@@ -7586,26 +7586,28 @@ button) {
7586
7586
  --pf-v5-c-background-image--BackgroundPosition: bottom left;
7587
7587
  }
7588
7588
 
7589
- .pf-v5-c-back-to-top {
7590
- --pf-v5-c-back-to-top--Right: var(--pf-v5-global--spacer--2xl);
7591
- --pf-v5-c-back-to-top--Bottom: var(--pf-v5-global--spacer--lg);
7592
- --pf-v5-c-back-to-top--md--Bottom: var(--pf-v5-global--spacer--2xl);
7593
- --pf-v5-c-back-to-top--c-button--FontSize: var(--pf-v5-global--FontSize--xs);
7594
- --pf-v5-c-back-to-top--c-button--BorderRadius: var(--pf-v5-global--BorderRadius--lg);
7595
- --pf-v5-c-back-to-top--c-button--PaddingTop: var(--pf-v5-global--spacer--xs);
7596
- --pf-v5-c-back-to-top--c-button--PaddingRight: var(--pf-v5-global--spacer--sm);
7597
- --pf-v5-c-back-to-top--c-button--PaddingBottom: var(--pf-v5-global--spacer--xs);
7598
- --pf-v5-c-back-to-top--c-button--PaddingLeft: var(--pf-v5-global--spacer--sm);
7599
- --pf-v5-c-back-to-top--c-button--BoxShadow: var(--pf-v5-global--BoxShadow--lg-bottom);
7600
- position: absolute;
7601
- inset-block-end: var(--pf-v5-c-back-to-top--Bottom);
7602
- inset-inline-end: var(--pf-v5-c-back-to-top--Right);
7589
+ :root {
7590
+ --pf-v5-c-back-to-top--Right: var(--pf-t--global--spacer--2xl);
7591
+ --pf-v5-c-back-to-top--Bottom: var(--pf-t--global--spacer--lg);
7592
+ --pf-v5-c-back-to-top--md--Bottom: var(--pf-t--global--spacer--2xl);
7593
+ --pf-v5-c-back-to-top--c-button--FontSize: var(--pf-t--global--font--size--body--sm);
7594
+ --pf-v5-c-back-to-top--c-button--PaddingTop: var(--pf-t--global--spacer--xs);
7595
+ --pf-v5-c-back-to-top--c-button--PaddingRight: var(--pf-t--global--spacer--sm);
7596
+ --pf-v5-c-back-to-top--c-button--PaddingBottom: var(--pf-t--global--spacer--xs);
7597
+ --pf-v5-c-back-to-top--c-button--PaddingLeft: var(--pf-t--global--spacer--sm);
7598
+ --pf-v5-c-back-to-top--c-button--BoxShadow: var(--pf-t--global--box-shadow--sm);
7603
7599
  }
7604
7600
  @media (min-width: 768px) {
7605
- .pf-v5-c-back-to-top {
7601
+ :root {
7606
7602
  --pf-v5-c-back-to-top--Bottom: var(--pf-v5-c-back-to-top--md--Bottom);
7607
7603
  }
7608
7604
  }
7605
+
7606
+ .pf-v5-c-back-to-top {
7607
+ position: absolute;
7608
+ inset-block-end: var(--pf-v5-c-back-to-top--Bottom);
7609
+ inset-inline-end: var(--pf-v5-c-back-to-top--Right);
7610
+ }
7609
7611
  .pf-v5-c-back-to-top.pf-m-hidden {
7610
7612
  display: none;
7611
7613
  }
@@ -25346,10 +25348,13 @@ label.pf-v5-c-radio, .pf-v5-c-radio__label,
25346
25348
  --pf-v5-c-skeleton--after--LinearGradientColorStop3: var(--pf-v5-global--palette--black-600);
25347
25349
  }
25348
25350
 
25349
- .pf-v5-c-skip-to-content {
25350
- --pf-v5-c-skip-to-content--Top: var(--pf-v5-global--spacer--md);
25351
+ :root {
25352
+ --pf-v5-c-skip-to-content--Top: var(--pf-t--global--spacer--md);
25351
25353
  --pf-v5-c-skip-to-content--ZIndex: var(--pf-v5-global--ZIndex--2xl);
25352
- --pf-v5-c-skip-to-content--focus--Left: var(--pf-v5-global--spacer--md);
25354
+ --pf-v5-c-skip-to-content--focus--Left: var(--pf-t--global--spacer--md);
25355
+ }
25356
+
25357
+ .pf-v5-c-skip-to-content {
25353
25358
  position: absolute;
25354
25359
  inset-block-start: var(--pf-v5-c-skip-to-content--Top);
25355
25360
  inset-inline-start: -300%;