@patternfly/patternfly 5.1.0-prerelease.12 → 5.1.0-prerelease.14

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 (27) hide show
  1. package/components/Alert/alert.css +3 -0
  2. package/components/Alert/alert.scss +2 -0
  3. package/components/CalendarMonth/calendar-month.css +4 -0
  4. package/components/CalendarMonth/calendar-month.scss +2 -0
  5. package/components/Card/card.css +3 -0
  6. package/components/Card/card.scss +2 -0
  7. package/components/ClipboardCopy/clipboard-copy.css +3 -0
  8. package/components/ClipboardCopy/clipboard-copy.scss +2 -0
  9. package/components/JumpLinks/jump-links.css +3 -0
  10. package/components/JumpLinks/jump-links.scss +2 -0
  11. package/components/Menu/menu.css +11 -0
  12. package/components/Menu/menu.scss +12 -2
  13. package/components/Nav/nav.css +20 -0
  14. package/components/Nav/nav.scss +22 -2
  15. package/components/NotificationDrawer/notification-drawer.css +4 -0
  16. package/components/NotificationDrawer/notification-drawer.scss +2 -0
  17. package/components/Page/page.css +4 -0
  18. package/components/Page/page.scss +6 -1
  19. package/components/Tabs/tabs.css +10 -0
  20. package/components/Tabs/tabs.scss +8 -0
  21. package/docs/demos/Card/examples/Card.md +23 -7
  22. package/package.json +2 -2
  23. package/patternfly-no-globals.css +65 -0
  24. package/patternfly-theme-dark-unversioned.css +65 -0
  25. package/patternfly.css +65 -0
  26. package/patternfly.min.css +1 -1
  27. package/patternfly.min.css.map +1 -1
package/patternfly-no-globals.css CHANGED
@@ -5967,6 +5967,9 @@
5967
5967
  transition: var(--pf-v5-c-alert__toggle-icon--Transition);
5968
5968
  transform: rotate(var(--pf-v5-c-alert__toggle-icon--Rotate));
5969
5969
  }
5970
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-alert__toggle-icon {
5971
+ scale: -1 1;
5972
+ }
5970
5973
 
5971
5974
  .pf-v5-c-alert__icon {
5972
5975
  display: flex;
@@ -7618,6 +7621,10 @@ button.pf-v5-c-breadcrumb__link {
7618
7621
  margin-inline-start: var(--pf-v5-c-calendar-month__header-nav-control--MarginLeft);
7619
7622
  margin-inline-end: var(--pf-v5-c-calendar-month__header-nav-control--MarginRight);
7620
7623
  }
7624
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-calendar-month__header-nav-control {
7625
+ scale: -1 1;
7626
+ }
7627
+
7621
7628
  .pf-v5-c-calendar-month__header-nav-control.pf-m-prev-month {
7622
7629
  --pf-v5-c-calendar-month__header-nav-control--MarginRight: var(--pf-v5-c-calendar-month__header-nav-control--m-prev-month--MarginRight);
7623
7630
  --pf-v5-c-calendar-month__header-nav-control--MarginLeft: var(--pf-v5-c-calendar-month__header-nav-control--m-prev-month--MarginLeft);
@@ -8044,6 +8051,9 @@ button.pf-v5-c-breadcrumb__link {
8044
8051
  display: inline-block;
8045
8052
  transition: var(--pf-v5-c-card__header-toggle-icon--Transition);
8046
8053
  }
8054
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-card__header-toggle-icon {
8055
+ scale: -1 1;
8056
+ }
8047
8057
 
8048
8058
  .pf-v5-c-card__title-text {
8049
8059
  font-family: var(--pf-v5-c-card__title-text--FontFamily);
@@ -8509,6 +8519,9 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
8509
8519
  .pf-v5-c-clipboard-copy__toggle-icon {
8510
8520
  transition: var(--pf-v5-c-clipboard-copy__toggle-icon--Transition);
8511
8521
  }
8522
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-clipboard-copy__toggle-icon {
8523
+ scale: -1 1;
8524
+ }
8512
8525
 
8513
8526
  .pf-v5-c-clipboard-copy__expandable-content {
8514
8527
  padding-block-start: var(--pf-v5-c-clipboard-copy__expandable-content--PaddingTop);
@@ -15854,6 +15867,9 @@ label.pf-v5-c-input-group__text {
15854
15867
  transition: var(--pf-v5-c-jump-links__toggle-icon--Transition);
15855
15868
  transform: rotate(var(--pf-v5-c-jump-links__toggle-icon--Rotate));
15856
15869
  }
15870
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-jump-links__toggle-icon {
15871
+ scale: -1 1;
15872
+ }
15857
15873
 
15858
15874
  .pf-v5-c-jump-links__toggle-text {
15859
15875
  margin-inline-start: var(--pf-v5-c-jump-links__toggle-text--MarginLeft);
@@ -17856,6 +17872,10 @@ ul.pf-v5-c-list {
17856
17872
  .pf-v5-c-menu.pf-m-drilldown.pf-m-drilled-in > .pf-v5-c-menu__list {
17857
17873
  transform: translateX(-100%);
17858
17874
  }
17875
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-menu.pf-m-drilldown.pf-m-drilled-in > .pf-v5-c-menu__content > .pf-v5-c-menu__list, .pf-v5-c-menu.pf-m-drilldown.pf-m-drilled-in > .pf-v5-c-menu__list {
17876
+ transform: translateX(calc(-100% * var(--pf-v5-global--inverse--multiplier)));
17877
+ }
17878
+
17859
17879
  .pf-v5-c-menu.pf-m-drilldown > .pf-v5-c-menu__content .pf-v5-c-menu {
17860
17880
  --pf-v5-c-menu--BoxShadow: none;
17861
17881
  position: absolute;
@@ -17867,6 +17887,10 @@ ul.pf-v5-c-list {
17867
17887
  .pf-v5-c-menu.pf-m-drilldown > .pf-v5-c-menu__content .pf-v5-c-menu.pf-m-drilled-in {
17868
17888
  transform: translateX(-100%);
17869
17889
  }
17890
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-menu.pf-m-drilldown > .pf-v5-c-menu__content .pf-v5-c-menu.pf-m-drilled-in {
17891
+ transform: translateX(calc(-100% * var(--pf-v5-global--inverse--multiplier)));
17892
+ }
17893
+
17870
17894
  .pf-v5-c-menu.pf-m-drilldown .pf-v5-c-menu__list {
17871
17895
  position: relative;
17872
17896
  overflow: hidden;
@@ -18166,6 +18190,9 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
18166
18190
  padding-inline-end: var(--pf-v5-c-menu__item-toggle-icon--PaddingRight);
18167
18191
  color: var(--pf-v5-c-menu__item-toggle-icon, inherit);
18168
18192
  }
18193
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-menu__item-toggle-icon {
18194
+ scale: -1 1;
18195
+ }
18169
18196
 
18170
18197
  .pf-v5-c-menu__item-text + .pf-v5-c-menu__item-toggle-icon {
18171
18198
  margin-inline-start: var(--pf-v5-c-menu__item-text--item-toggle-icon--MarginLeft);
@@ -19489,6 +19516,10 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
19489
19516
  .pf-v5-c-nav .pf-v5-c-menu__item-toggle-icon {
19490
19517
  margin-inline-start: calc(var(--pf-v5-c-menu__item-toggle-icon--PaddingLeft) * -1);
19491
19518
  }
19519
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-nav .pf-v5-c-menu__item-toggle-icon {
19520
+ scale: -1 1;
19521
+ }
19522
+
19492
19523
  .pf-v5-c-nav.pf-m-horizontal .pf-v5-c-nav__link::after, .pf-v5-c-nav.pf-m-tertiary .pf-v5-c-nav__link::after {
19493
19524
  content: none;
19494
19525
  }
@@ -19932,6 +19963,10 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
19932
19963
  display: inline-block;
19933
19964
  transition: var(--pf-v5-c-nav__toggle-icon--Transition);
19934
19965
  }
19966
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-nav__toggle-icon {
19967
+ scale: -1 1;
19968
+ }
19969
+
19935
19970
  .pf-v5-c-nav__item.pf-m-expanded .pf-v5-c-nav__toggle-icon {
19936
19971
  transform: rotate(var(--pf-v5-c-nav__item--m-expanded__toggle-icon--Rotate));
19937
19972
  }
@@ -19987,6 +20022,10 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
19987
20022
  opacity: 0;
19988
20023
  transition: var(--pf-v5-c-nav__scroll-button--Transition);
19989
20024
  }
20025
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-nav__scroll-button > * {
20026
+ scale: -1 1;
20027
+ }
20028
+
19990
20029
  .pf-v5-c-nav__scroll-button::before {
19991
20030
  position: absolute;
19992
20031
  inset-block-start: 0;
@@ -20014,6 +20053,10 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
20014
20053
  margin-inline-end: calc(var(--pf-v5-c-nav__scroll-button--Width) * -1);
20015
20054
  transform: translateX(-100%);
20016
20055
  }
20056
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-nav__scroll-button:nth-of-type(1) {
20057
+ transform: translateX(calc(-100% * var(--pf-v5-global--inverse--multiplier)));
20058
+ }
20059
+
20017
20060
  .pf-v5-c-nav__scroll-button:nth-of-type(1)::before {
20018
20061
  inset-inline-end: 0;
20019
20062
  }
@@ -20022,6 +20065,10 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
20022
20065
  margin-inline-start: calc(var(--pf-v5-c-nav__scroll-button--Width) * -1);
20023
20066
  transform: translateX(100%);
20024
20067
  }
20068
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-nav__scroll-button:nth-of-type(2) {
20069
+ transform: translateX(calc(100% * var(--pf-v5-global--inverse--multiplier)));
20070
+ }
20071
+
20025
20072
  .pf-v5-c-nav__scroll-button:nth-of-type(2)::before {
20026
20073
  inset-inline-start: 0;
20027
20074
  }
@@ -20456,6 +20503,10 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
20456
20503
  color: var(--pf-v5-c-notification-drawer__group-toggle-icon--Color);
20457
20504
  transition: var(--pf-v5-c-notification-drawer__group-toggle-icon--Transition);
20458
20505
  }
20506
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-notification-drawer__group-toggle-icon {
20507
+ scale: -1 1;
20508
+ }
20509
+
20459
20510
  .pf-v5-c-notification-drawer__group.pf-m-expanded .pf-v5-c-notification-drawer__group-toggle-icon {
20460
20511
  transform: rotate(var(--pf-v5-c-notification-drawer__group--m-expanded__group-toggle-icon--Rotate));
20461
20512
  }
@@ -21157,6 +21208,10 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
21157
21208
  transition: var(--pf-v5-c-page__sidebar--Transition);
21158
21209
  transform: translateX(var(--pf-v5-c-page__sidebar--TranslateX)) translateZ(var(--pf-v5-c-page__sidebar--TranslateZ));
21159
21210
  }
21211
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-page__sidebar {
21212
+ transform: translateX(calc(var(--pf-v5-c-page__sidebar--TranslateX) * var(--pf-v5-global--inverse--multiplier))) translateZ(var(--pf-v5-c-page__sidebar--TranslateZ));
21213
+ }
21214
+
21160
21215
  .pf-v5-c-page__sidebar.pf-m-expanded {
21161
21216
  --pf-v5-c-page__sidebar--TranslateX: var(--pf-v5-c-page__sidebar--m-expanded--TranslateX);
21162
21217
  box-shadow: var(--pf-v5-c-page__sidebar--BoxShadow);
@@ -29069,6 +29124,9 @@ svg.pf-v5-c-spinner.pf-m-xl {
29069
29124
  transition: var(--pf-v5-c-tabs__toggle-icon--Transition);
29070
29125
  transform: rotate(var(--pf-v5-c-tabs__toggle-icon--Rotate));
29071
29126
  }
29127
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-tabs__toggle-icon {
29128
+ scale: -1 1;
29129
+ }
29072
29130
 
29073
29131
  .pf-v5-c-tabs__toggle-text {
29074
29132
  margin-inline-start: var(--pf-v5-c-tabs__toggle-text--MarginLeft);
@@ -29243,6 +29301,9 @@ svg.pf-v5-c-spinner.pf-m-xl {
29243
29301
  transition: var(--pf-v5-c-tabs__link-toggle-icon--Transition);
29244
29302
  transform: rotate(var(--pf-v5-c-tabs__link-toggle-icon--Rotate));
29245
29303
  }
29304
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-tabs__link-toggle-icon {
29305
+ scale: -1 1;
29306
+ }
29246
29307
 
29247
29308
  .pf-v5-c-tabs__item-action {
29248
29309
  display: flex;
@@ -29274,6 +29335,10 @@ svg.pf-v5-c-spinner.pf-m-xl {
29274
29335
  opacity: 0;
29275
29336
  transition: margin var(--pf-v5-c-tabs__scroll-button--TransitionDuration--margin), transform var(--pf-v5-c-tabs__scroll-button--TransitionDuration--transform), opacity var(--pf-v5-c-tabs__scroll-button--TransitionDuration--opacity);
29276
29337
  }
29338
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-tabs__scroll-button > * {
29339
+ scale: -1 1;
29340
+ }
29341
+
29277
29342
  .pf-v5-c-tabs__scroll-button:hover, .pf-v5-c-tabs__scroll-button:active, .pf-v5-c-tabs__scroll-button:focus {
29278
29343
  --pf-v5-c-tabs__scroll-button--Color: var(--pf-v5-c-tabs__scroll-button--hover--Color);
29279
29344
  }
package/patternfly-theme-dark-unversioned.css CHANGED
@@ -6084,6 +6084,9 @@ button) {
6084
6084
  transition: var(--pf-v5-c-alert__toggle-icon--Transition);
6085
6085
  transform: rotate(var(--pf-v5-c-alert__toggle-icon--Rotate));
6086
6086
  }
6087
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-alert__toggle-icon {
6088
+ scale: -1 1;
6089
+ }
6087
6090
 
6088
6091
  .pf-v5-c-alert__icon {
6089
6092
  display: flex;
@@ -7735,6 +7738,10 @@ button.pf-v5-c-breadcrumb__link {
7735
7738
  margin-inline-start: var(--pf-v5-c-calendar-month__header-nav-control--MarginLeft);
7736
7739
  margin-inline-end: var(--pf-v5-c-calendar-month__header-nav-control--MarginRight);
7737
7740
  }
7741
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-calendar-month__header-nav-control {
7742
+ scale: -1 1;
7743
+ }
7744
+
7738
7745
  .pf-v5-c-calendar-month__header-nav-control.pf-m-prev-month {
7739
7746
  --pf-v5-c-calendar-month__header-nav-control--MarginRight: var(--pf-v5-c-calendar-month__header-nav-control--m-prev-month--MarginRight);
7740
7747
  --pf-v5-c-calendar-month__header-nav-control--MarginLeft: var(--pf-v5-c-calendar-month__header-nav-control--m-prev-month--MarginLeft);
@@ -8161,6 +8168,9 @@ button.pf-v5-c-breadcrumb__link {
8161
8168
  display: inline-block;
8162
8169
  transition: var(--pf-v5-c-card__header-toggle-icon--Transition);
8163
8170
  }
8171
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-card__header-toggle-icon {
8172
+ scale: -1 1;
8173
+ }
8164
8174
 
8165
8175
  .pf-v5-c-card__title-text {
8166
8176
  font-family: var(--pf-v5-c-card__title-text--FontFamily);
@@ -8626,6 +8636,9 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
8626
8636
  .pf-v5-c-clipboard-copy__toggle-icon {
8627
8637
  transition: var(--pf-v5-c-clipboard-copy__toggle-icon--Transition);
8628
8638
  }
8639
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-clipboard-copy__toggle-icon {
8640
+ scale: -1 1;
8641
+ }
8629
8642
 
8630
8643
  .pf-v5-c-clipboard-copy__expandable-content {
8631
8644
  padding-block-start: var(--pf-v5-c-clipboard-copy__expandable-content--PaddingTop);
@@ -15971,6 +15984,9 @@ label.pf-v5-c-input-group__text {
15971
15984
  transition: var(--pf-v5-c-jump-links__toggle-icon--Transition);
15972
15985
  transform: rotate(var(--pf-v5-c-jump-links__toggle-icon--Rotate));
15973
15986
  }
15987
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-jump-links__toggle-icon {
15988
+ scale: -1 1;
15989
+ }
15974
15990
 
15975
15991
  .pf-v5-c-jump-links__toggle-text {
15976
15992
  margin-inline-start: var(--pf-v5-c-jump-links__toggle-text--MarginLeft);
@@ -17973,6 +17989,10 @@ ul.pf-v5-c-list {
17973
17989
  .pf-v5-c-menu.pf-m-drilldown.pf-m-drilled-in > .pf-v5-c-menu__list {
17974
17990
  transform: translateX(-100%);
17975
17991
  }
17992
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-menu.pf-m-drilldown.pf-m-drilled-in > .pf-v5-c-menu__content > .pf-v5-c-menu__list, .pf-v5-c-menu.pf-m-drilldown.pf-m-drilled-in > .pf-v5-c-menu__list {
17993
+ transform: translateX(calc(-100% * var(--pf-v5-global--inverse--multiplier)));
17994
+ }
17995
+
17976
17996
  .pf-v5-c-menu.pf-m-drilldown > .pf-v5-c-menu__content .pf-v5-c-menu {
17977
17997
  --pf-v5-c-menu--BoxShadow: none;
17978
17998
  position: absolute;
@@ -17984,6 +18004,10 @@ ul.pf-v5-c-list {
17984
18004
  .pf-v5-c-menu.pf-m-drilldown > .pf-v5-c-menu__content .pf-v5-c-menu.pf-m-drilled-in {
17985
18005
  transform: translateX(-100%);
17986
18006
  }
18007
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-menu.pf-m-drilldown > .pf-v5-c-menu__content .pf-v5-c-menu.pf-m-drilled-in {
18008
+ transform: translateX(calc(-100% * var(--pf-v5-global--inverse--multiplier)));
18009
+ }
18010
+
17987
18011
  .pf-v5-c-menu.pf-m-drilldown .pf-v5-c-menu__list {
17988
18012
  position: relative;
17989
18013
  overflow: hidden;
@@ -18283,6 +18307,9 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
18283
18307
  padding-inline-end: var(--pf-v5-c-menu__item-toggle-icon--PaddingRight);
18284
18308
  color: var(--pf-v5-c-menu__item-toggle-icon, inherit);
18285
18309
  }
18310
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-menu__item-toggle-icon {
18311
+ scale: -1 1;
18312
+ }
18286
18313
 
18287
18314
  .pf-v5-c-menu__item-text + .pf-v5-c-menu__item-toggle-icon {
18288
18315
  margin-inline-start: var(--pf-v5-c-menu__item-text--item-toggle-icon--MarginLeft);
@@ -19606,6 +19633,10 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
19606
19633
  .pf-v5-c-nav .pf-v5-c-menu__item-toggle-icon {
19607
19634
  margin-inline-start: calc(var(--pf-v5-c-menu__item-toggle-icon--PaddingLeft) * -1);
19608
19635
  }
19636
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-nav .pf-v5-c-menu__item-toggle-icon {
19637
+ scale: -1 1;
19638
+ }
19639
+
19609
19640
  .pf-v5-c-nav.pf-m-horizontal .pf-v5-c-nav__link::after, .pf-v5-c-nav.pf-m-tertiary .pf-v5-c-nav__link::after {
19610
19641
  content: none;
19611
19642
  }
@@ -20049,6 +20080,10 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
20049
20080
  display: inline-block;
20050
20081
  transition: var(--pf-v5-c-nav__toggle-icon--Transition);
20051
20082
  }
20083
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-nav__toggle-icon {
20084
+ scale: -1 1;
20085
+ }
20086
+
20052
20087
  .pf-v5-c-nav__item.pf-m-expanded .pf-v5-c-nav__toggle-icon {
20053
20088
  transform: rotate(var(--pf-v5-c-nav__item--m-expanded__toggle-icon--Rotate));
20054
20089
  }
@@ -20104,6 +20139,10 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
20104
20139
  opacity: 0;
20105
20140
  transition: var(--pf-v5-c-nav__scroll-button--Transition);
20106
20141
  }
20142
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-nav__scroll-button > * {
20143
+ scale: -1 1;
20144
+ }
20145
+
20107
20146
  .pf-v5-c-nav__scroll-button::before {
20108
20147
  position: absolute;
20109
20148
  inset-block-start: 0;
@@ -20131,6 +20170,10 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
20131
20170
  margin-inline-end: calc(var(--pf-v5-c-nav__scroll-button--Width) * -1);
20132
20171
  transform: translateX(-100%);
20133
20172
  }
20173
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-nav__scroll-button:nth-of-type(1) {
20174
+ transform: translateX(calc(-100% * var(--pf-v5-global--inverse--multiplier)));
20175
+ }
20176
+
20134
20177
  .pf-v5-c-nav__scroll-button:nth-of-type(1)::before {
20135
20178
  inset-inline-end: 0;
20136
20179
  }
@@ -20139,6 +20182,10 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
20139
20182
  margin-inline-start: calc(var(--pf-v5-c-nav__scroll-button--Width) * -1);
20140
20183
  transform: translateX(100%);
20141
20184
  }
20185
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-nav__scroll-button:nth-of-type(2) {
20186
+ transform: translateX(calc(100% * var(--pf-v5-global--inverse--multiplier)));
20187
+ }
20188
+
20142
20189
  .pf-v5-c-nav__scroll-button:nth-of-type(2)::before {
20143
20190
  inset-inline-start: 0;
20144
20191
  }
@@ -20573,6 +20620,10 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
20573
20620
  color: var(--pf-v5-c-notification-drawer__group-toggle-icon--Color);
20574
20621
  transition: var(--pf-v5-c-notification-drawer__group-toggle-icon--Transition);
20575
20622
  }
20623
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-notification-drawer__group-toggle-icon {
20624
+ scale: -1 1;
20625
+ }
20626
+
20576
20627
  .pf-v5-c-notification-drawer__group.pf-m-expanded .pf-v5-c-notification-drawer__group-toggle-icon {
20577
20628
  transform: rotate(var(--pf-v5-c-notification-drawer__group--m-expanded__group-toggle-icon--Rotate));
20578
20629
  }
@@ -21274,6 +21325,10 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
21274
21325
  transition: var(--pf-v5-c-page__sidebar--Transition);
21275
21326
  transform: translateX(var(--pf-v5-c-page__sidebar--TranslateX)) translateZ(var(--pf-v5-c-page__sidebar--TranslateZ));
21276
21327
  }
21328
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-page__sidebar {
21329
+ transform: translateX(calc(var(--pf-v5-c-page__sidebar--TranslateX) * var(--pf-v5-global--inverse--multiplier))) translateZ(var(--pf-v5-c-page__sidebar--TranslateZ));
21330
+ }
21331
+
21277
21332
  .pf-v5-c-page__sidebar.pf-m-expanded {
21278
21333
  --pf-v5-c-page__sidebar--TranslateX: var(--pf-v5-c-page__sidebar--m-expanded--TranslateX);
21279
21334
  box-shadow: var(--pf-v5-c-page__sidebar--BoxShadow);
@@ -29186,6 +29241,9 @@ svg.pf-v5-c-spinner.pf-m-xl {
29186
29241
  transition: var(--pf-v5-c-tabs__toggle-icon--Transition);
29187
29242
  transform: rotate(var(--pf-v5-c-tabs__toggle-icon--Rotate));
29188
29243
  }
29244
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-tabs__toggle-icon {
29245
+ scale: -1 1;
29246
+ }
29189
29247
 
29190
29248
  .pf-v5-c-tabs__toggle-text {
29191
29249
  margin-inline-start: var(--pf-v5-c-tabs__toggle-text--MarginLeft);
@@ -29360,6 +29418,9 @@ svg.pf-v5-c-spinner.pf-m-xl {
29360
29418
  transition: var(--pf-v5-c-tabs__link-toggle-icon--Transition);
29361
29419
  transform: rotate(var(--pf-v5-c-tabs__link-toggle-icon--Rotate));
29362
29420
  }
29421
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-tabs__link-toggle-icon {
29422
+ scale: -1 1;
29423
+ }
29363
29424
 
29364
29425
  .pf-v5-c-tabs__item-action {
29365
29426
  display: flex;
@@ -29391,6 +29452,10 @@ svg.pf-v5-c-spinner.pf-m-xl {
29391
29452
  opacity: 0;
29392
29453
  transition: margin var(--pf-v5-c-tabs__scroll-button--TransitionDuration--margin), transform var(--pf-v5-c-tabs__scroll-button--TransitionDuration--transform), opacity var(--pf-v5-c-tabs__scroll-button--TransitionDuration--opacity);
29393
29454
  }
29455
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-tabs__scroll-button > * {
29456
+ scale: -1 1;
29457
+ }
29458
+
29394
29459
  .pf-v5-c-tabs__scroll-button:hover, .pf-v5-c-tabs__scroll-button:active, .pf-v5-c-tabs__scroll-button:focus {
29395
29460
  --pf-v5-c-tabs__scroll-button--Color: var(--pf-v5-c-tabs__scroll-button--hover--Color);
29396
29461
  }
package/patternfly.css CHANGED
@@ -6084,6 +6084,9 @@ button) {
6084
6084
  transition: var(--pf-v5-c-alert__toggle-icon--Transition);
6085
6085
  transform: rotate(var(--pf-v5-c-alert__toggle-icon--Rotate));
6086
6086
  }
6087
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-alert__toggle-icon {
6088
+ scale: -1 1;
6089
+ }
6087
6090
 
6088
6091
  .pf-v5-c-alert__icon {
6089
6092
  display: flex;
@@ -7735,6 +7738,10 @@ button.pf-v5-c-breadcrumb__link {
7735
7738
  margin-inline-start: var(--pf-v5-c-calendar-month__header-nav-control--MarginLeft);
7736
7739
  margin-inline-end: var(--pf-v5-c-calendar-month__header-nav-control--MarginRight);
7737
7740
  }
7741
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-calendar-month__header-nav-control {
7742
+ scale: -1 1;
7743
+ }
7744
+
7738
7745
  .pf-v5-c-calendar-month__header-nav-control.pf-m-prev-month {
7739
7746
  --pf-v5-c-calendar-month__header-nav-control--MarginRight: var(--pf-v5-c-calendar-month__header-nav-control--m-prev-month--MarginRight);
7740
7747
  --pf-v5-c-calendar-month__header-nav-control--MarginLeft: var(--pf-v5-c-calendar-month__header-nav-control--m-prev-month--MarginLeft);
@@ -8161,6 +8168,9 @@ button.pf-v5-c-breadcrumb__link {
8161
8168
  display: inline-block;
8162
8169
  transition: var(--pf-v5-c-card__header-toggle-icon--Transition);
8163
8170
  }
8171
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-card__header-toggle-icon {
8172
+ scale: -1 1;
8173
+ }
8164
8174
 
8165
8175
  .pf-v5-c-card__title-text {
8166
8176
  font-family: var(--pf-v5-c-card__title-text--FontFamily);
@@ -8626,6 +8636,9 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
8626
8636
  .pf-v5-c-clipboard-copy__toggle-icon {
8627
8637
  transition: var(--pf-v5-c-clipboard-copy__toggle-icon--Transition);
8628
8638
  }
8639
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-clipboard-copy__toggle-icon {
8640
+ scale: -1 1;
8641
+ }
8629
8642
 
8630
8643
  .pf-v5-c-clipboard-copy__expandable-content {
8631
8644
  padding-block-start: var(--pf-v5-c-clipboard-copy__expandable-content--PaddingTop);
@@ -15971,6 +15984,9 @@ label.pf-v5-c-input-group__text {
15971
15984
  transition: var(--pf-v5-c-jump-links__toggle-icon--Transition);
15972
15985
  transform: rotate(var(--pf-v5-c-jump-links__toggle-icon--Rotate));
15973
15986
  }
15987
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-jump-links__toggle-icon {
15988
+ scale: -1 1;
15989
+ }
15974
15990
 
15975
15991
  .pf-v5-c-jump-links__toggle-text {
15976
15992
  margin-inline-start: var(--pf-v5-c-jump-links__toggle-text--MarginLeft);
@@ -17973,6 +17989,10 @@ ul.pf-v5-c-list {
17973
17989
  .pf-v5-c-menu.pf-m-drilldown.pf-m-drilled-in > .pf-v5-c-menu__list {
17974
17990
  transform: translateX(-100%);
17975
17991
  }
17992
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-menu.pf-m-drilldown.pf-m-drilled-in > .pf-v5-c-menu__content > .pf-v5-c-menu__list, .pf-v5-c-menu.pf-m-drilldown.pf-m-drilled-in > .pf-v5-c-menu__list {
17993
+ transform: translateX(calc(-100% * var(--pf-v5-global--inverse--multiplier)));
17994
+ }
17995
+
17976
17996
  .pf-v5-c-menu.pf-m-drilldown > .pf-v5-c-menu__content .pf-v5-c-menu {
17977
17997
  --pf-v5-c-menu--BoxShadow: none;
17978
17998
  position: absolute;
@@ -17984,6 +18004,10 @@ ul.pf-v5-c-list {
17984
18004
  .pf-v5-c-menu.pf-m-drilldown > .pf-v5-c-menu__content .pf-v5-c-menu.pf-m-drilled-in {
17985
18005
  transform: translateX(-100%);
17986
18006
  }
18007
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-menu.pf-m-drilldown > .pf-v5-c-menu__content .pf-v5-c-menu.pf-m-drilled-in {
18008
+ transform: translateX(calc(-100% * var(--pf-v5-global--inverse--multiplier)));
18009
+ }
18010
+
17987
18011
  .pf-v5-c-menu.pf-m-drilldown .pf-v5-c-menu__list {
17988
18012
  position: relative;
17989
18013
  overflow: hidden;
@@ -18283,6 +18307,9 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
18283
18307
  padding-inline-end: var(--pf-v5-c-menu__item-toggle-icon--PaddingRight);
18284
18308
  color: var(--pf-v5-c-menu__item-toggle-icon, inherit);
18285
18309
  }
18310
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-menu__item-toggle-icon {
18311
+ scale: -1 1;
18312
+ }
18286
18313
 
18287
18314
  .pf-v5-c-menu__item-text + .pf-v5-c-menu__item-toggle-icon {
18288
18315
  margin-inline-start: var(--pf-v5-c-menu__item-text--item-toggle-icon--MarginLeft);
@@ -19606,6 +19633,10 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
19606
19633
  .pf-v5-c-nav .pf-v5-c-menu__item-toggle-icon {
19607
19634
  margin-inline-start: calc(var(--pf-v5-c-menu__item-toggle-icon--PaddingLeft) * -1);
19608
19635
  }
19636
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-nav .pf-v5-c-menu__item-toggle-icon {
19637
+ scale: -1 1;
19638
+ }
19639
+
19609
19640
  .pf-v5-c-nav.pf-m-horizontal .pf-v5-c-nav__link::after, .pf-v5-c-nav.pf-m-tertiary .pf-v5-c-nav__link::after {
19610
19641
  content: none;
19611
19642
  }
@@ -20049,6 +20080,10 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
20049
20080
  display: inline-block;
20050
20081
  transition: var(--pf-v5-c-nav__toggle-icon--Transition);
20051
20082
  }
20083
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-nav__toggle-icon {
20084
+ scale: -1 1;
20085
+ }
20086
+
20052
20087
  .pf-v5-c-nav__item.pf-m-expanded .pf-v5-c-nav__toggle-icon {
20053
20088
  transform: rotate(var(--pf-v5-c-nav__item--m-expanded__toggle-icon--Rotate));
20054
20089
  }
@@ -20104,6 +20139,10 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
20104
20139
  opacity: 0;
20105
20140
  transition: var(--pf-v5-c-nav__scroll-button--Transition);
20106
20141
  }
20142
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-nav__scroll-button > * {
20143
+ scale: -1 1;
20144
+ }
20145
+
20107
20146
  .pf-v5-c-nav__scroll-button::before {
20108
20147
  position: absolute;
20109
20148
  inset-block-start: 0;
@@ -20131,6 +20170,10 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
20131
20170
  margin-inline-end: calc(var(--pf-v5-c-nav__scroll-button--Width) * -1);
20132
20171
  transform: translateX(-100%);
20133
20172
  }
20173
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-nav__scroll-button:nth-of-type(1) {
20174
+ transform: translateX(calc(-100% * var(--pf-v5-global--inverse--multiplier)));
20175
+ }
20176
+
20134
20177
  .pf-v5-c-nav__scroll-button:nth-of-type(1)::before {
20135
20178
  inset-inline-end: 0;
20136
20179
  }
@@ -20139,6 +20182,10 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
20139
20182
  margin-inline-start: calc(var(--pf-v5-c-nav__scroll-button--Width) * -1);
20140
20183
  transform: translateX(100%);
20141
20184
  }
20185
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-nav__scroll-button:nth-of-type(2) {
20186
+ transform: translateX(calc(100% * var(--pf-v5-global--inverse--multiplier)));
20187
+ }
20188
+
20142
20189
  .pf-v5-c-nav__scroll-button:nth-of-type(2)::before {
20143
20190
  inset-inline-start: 0;
20144
20191
  }
@@ -20573,6 +20620,10 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
20573
20620
  color: var(--pf-v5-c-notification-drawer__group-toggle-icon--Color);
20574
20621
  transition: var(--pf-v5-c-notification-drawer__group-toggle-icon--Transition);
20575
20622
  }
20623
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-notification-drawer__group-toggle-icon {
20624
+ scale: -1 1;
20625
+ }
20626
+
20576
20627
  .pf-v5-c-notification-drawer__group.pf-m-expanded .pf-v5-c-notification-drawer__group-toggle-icon {
20577
20628
  transform: rotate(var(--pf-v5-c-notification-drawer__group--m-expanded__group-toggle-icon--Rotate));
20578
20629
  }
@@ -21274,6 +21325,10 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
21274
21325
  transition: var(--pf-v5-c-page__sidebar--Transition);
21275
21326
  transform: translateX(var(--pf-v5-c-page__sidebar--TranslateX)) translateZ(var(--pf-v5-c-page__sidebar--TranslateZ));
21276
21327
  }
21328
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-page__sidebar {
21329
+ transform: translateX(calc(var(--pf-v5-c-page__sidebar--TranslateX) * var(--pf-v5-global--inverse--multiplier))) translateZ(var(--pf-v5-c-page__sidebar--TranslateZ));
21330
+ }
21331
+
21277
21332
  .pf-v5-c-page__sidebar.pf-m-expanded {
21278
21333
  --pf-v5-c-page__sidebar--TranslateX: var(--pf-v5-c-page__sidebar--m-expanded--TranslateX);
21279
21334
  box-shadow: var(--pf-v5-c-page__sidebar--BoxShadow);
@@ -29186,6 +29241,9 @@ svg.pf-v5-c-spinner.pf-m-xl {
29186
29241
  transition: var(--pf-v5-c-tabs__toggle-icon--Transition);
29187
29242
  transform: rotate(var(--pf-v5-c-tabs__toggle-icon--Rotate));
29188
29243
  }
29244
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-tabs__toggle-icon {
29245
+ scale: -1 1;
29246
+ }
29189
29247
 
29190
29248
  .pf-v5-c-tabs__toggle-text {
29191
29249
  margin-inline-start: var(--pf-v5-c-tabs__toggle-text--MarginLeft);
@@ -29360,6 +29418,9 @@ svg.pf-v5-c-spinner.pf-m-xl {
29360
29418
  transition: var(--pf-v5-c-tabs__link-toggle-icon--Transition);
29361
29419
  transform: rotate(var(--pf-v5-c-tabs__link-toggle-icon--Rotate));
29362
29420
  }
29421
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-tabs__link-toggle-icon {
29422
+ scale: -1 1;
29423
+ }
29363
29424
 
29364
29425
  .pf-v5-c-tabs__item-action {
29365
29426
  display: flex;
@@ -29391,6 +29452,10 @@ svg.pf-v5-c-spinner.pf-m-xl {
29391
29452
  opacity: 0;
29392
29453
  transition: margin var(--pf-v5-c-tabs__scroll-button--TransitionDuration--margin), transform var(--pf-v5-c-tabs__scroll-button--TransitionDuration--transform), opacity var(--pf-v5-c-tabs__scroll-button--TransitionDuration--opacity);
29393
29454
  }
29455
+ :where(.ws-dir-rtl, .pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-tabs__scroll-button > * {
29456
+ scale: -1 1;
29457
+ }
29458
+
29394
29459
  .pf-v5-c-tabs__scroll-button:hover, .pf-v5-c-tabs__scroll-button:active, .pf-v5-c-tabs__scroll-button:focus {
29395
29460
  --pf-v5-c-tabs__scroll-button--Color: var(--pf-v5-c-tabs__scroll-button--hover--Color);
29396
29461
  }