@patternfly/patternfly 5.0.0-prerelease.1 → 5.0.0-prerelease.10

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 (90) hide show
  1. package/base/_common.scss +7 -0
  2. package/base/_fonts.scss +1 -1
  3. package/base/_variables.scss +4 -7
  4. package/base/patternfly-common.css +6 -0
  5. package/base/patternfly-fonts.css +1 -1
  6. package/base/patternfly-themes.css +14 -0
  7. package/base/patternfly-variables.css +8 -6
  8. package/base/themes/dark/_chart-globals.scss +1 -1
  9. package/base/themes/dark/_variables.scss +4 -0
  10. package/components/AboutModalBox/about-modal-box.css +7 -8
  11. package/components/Accordion/accordion.css +2 -0
  12. package/components/Alert/alert.css +2 -0
  13. package/components/Banner/banner.css +9 -8
  14. package/components/CalendarMonth/calendar-month.css +5 -0
  15. package/components/CalendarMonth/calendar-month.scss +2 -0
  16. package/components/CalendarMonth/themes/dark/calendar-month.scss +4 -0
  17. package/components/Card/card.css +4 -0
  18. package/components/Card/themes/dark/card.scss +7 -1
  19. package/components/Chip/chip-group.css +2 -0
  20. package/components/Chip/chip.css +2 -0
  21. package/components/ContextSelector/context-selector.css +2 -0
  22. package/components/DataList/data-list.css +2 -0
  23. package/components/FormControl/form-control.css +2 -0
  24. package/components/LogViewer/log-viewer.css +7 -8
  25. package/components/Login/login.css +8 -9
  26. package/components/Masthead/masthead.css +11 -14
  27. package/components/Masthead/masthead.scss +1 -7
  28. package/components/Masthead/themes/dark/masthead.scss +1 -0
  29. package/components/Menu/menu.css +2 -0
  30. package/components/MenuToggle/menu-toggle.css +13 -11
  31. package/components/MenuToggle/menu-toggle.scss +14 -12
  32. package/components/MenuToggle/themes/dark/menu-toggle.scss +2 -1
  33. package/components/Page/page.css +11 -10
  34. package/components/Select/select.css +2 -0
  35. package/components/Switch/switch.css +3 -0
  36. package/components/Switch/switch.scss +3 -0
  37. package/components/Switch/themes/dark/switch.scss +1 -0
  38. package/components/Table/table.css +2 -0
  39. package/components/TextInputGroup/text-input-group.css +2 -2
  40. package/components/TextInputGroup/text-input-group.scss +2 -2
  41. package/components/Wizard/wizard.css +7 -8
  42. package/docs/components/Drawer/examples/Drawer.md +2 -2
  43. package/docs/components/Dropdown/deprecated/Dropdown.css +64 -0
  44. package/docs/components/Dropdown/{examples → deprecated}/Dropdown.md +1 -0
  45. package/docs/components/Nav/examples/Navigation.md +2 -2
  46. package/docs/components/Select/deprecated/Select.css +56 -0
  47. package/docs/components/Select/{examples → deprecated}/Select.md +1 -0
  48. package/docs/components/Switch/examples/Switch.md +36 -0
  49. package/docs/demos/AboutModal/examples/AboutModal.md +42 -774
  50. package/docs/demos/Alert/examples/Alert.md +126 -2322
  51. package/docs/demos/BackToTop/examples/BackToTop.md +42 -774
  52. package/docs/demos/Banner/examples/Banner.md +84 -1588
  53. package/docs/demos/CardView/examples/CardView.md +42 -774
  54. package/docs/demos/ContextSelector/examples/ContextSelector.md +136 -2448
  55. package/docs/demos/Dashboard/examples/Dashboard.md +42 -774
  56. package/docs/demos/DataList/examples/DataList.md +191 -3119
  57. package/docs/demos/DescriptionList/examples/DescriptionList.md +126 -2322
  58. package/docs/demos/Drawer/examples/Drawer.md +210 -3870
  59. package/docs/demos/JumpLinks/examples/JumpLinks.md +252 -4644
  60. package/docs/demos/Masthead/examples/Masthead.md +144 -1962
  61. package/docs/demos/Modal/examples/Modal.md +252 -4644
  62. package/docs/demos/Nav/examples/Nav.md +337 -6193
  63. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +231 -3891
  64. package/docs/demos/Page/examples/Page.md +378 -6966
  65. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +426 -5550
  66. package/docs/demos/Skeleton/examples/Skeleton.md +42 -774
  67. package/docs/demos/Table/examples/Table.md +752 -11732
  68. package/docs/demos/Tabs/examples/Tabs.md +252 -4644
  69. package/docs/demos/Toolbar/examples/Toolbar.md +84 -1548
  70. package/docs/demos/Wizard/examples/Wizard.md +378 -6966
  71. package/package.json +2 -2
  72. package/patternfly-base-no-globals-theme-dark-unversioned.css +22 -7
  73. package/patternfly-base-no-globals.css +22 -7
  74. package/patternfly-base-theme-dark-unversioned.css +22 -7
  75. package/patternfly-base.css +22 -7
  76. package/patternfly-charts-theme-dark-unversioned.css +66 -66
  77. package/patternfly-charts-theme-dark.css +66 -66
  78. package/patternfly-no-globals.css +314 -609
  79. package/patternfly-theme-dark-unversioned.css +314 -609
  80. package/patternfly.css +314 -609
  81. package/patternfly.min.css +1 -1
  82. package/patternfly.min.css.map +1 -1
  83. package/sass-utilities/placeholders.scss +8 -0
  84. package/sass-utilities/scss-variables.scss +6 -2
  85. package/sass-utilities/themes/dark/placeholders.scss +3 -8
  86. package/sass-utilities/themes/dark/scss-variables.scss +6 -3
  87. package/RELEASE-NOTES.md +0 -1815
  88. package/UPGRADE-GUIDE.md +0 -1298
  89. package/docs/components/Dropdown/examples/Dropdown.css +0 -64
  90. package/docs/components/Select/examples/Select.css +0 -55
package/sass-utilities/placeholders.scss CHANGED
@@ -6,6 +6,8 @@
6
6
  --#{$pf-global}--link--Color: var(--#{$pf-global}--link--Color--dark);
7
7
  --#{$pf-global}--link--Color--hover: var(--#{$pf-global}--link--Color--dark--hover);
8
8
  --#{$pf-global}--BackgroundColor--100: var(--#{$pf-global}--BackgroundColor--light-100);
9
+ --#{$pf-global}--icon--Color--light: var(--#{$pf-global}--icon--Color--light--dark);
10
+ --#{$pf-global}--icon--Color--dark: var(--#{$pf-global}--icon--Color--dark--dark);
9
11
  }
10
12
 
11
13
  %pf-v5-t-dark {
@@ -16,6 +18,12 @@
16
18
  --#{$pf-global}--link--Color: var(--#{$pf-global}--link--Color--light);
17
19
  --#{$pf-global}--link--Color--hover: var(--#{$pf-global}--link--Color--light);
18
20
  --#{$pf-global}--BackgroundColor--100: var(--#{$pf-global}--BackgroundColor--dark-100);
21
+ --#{$pf-global}--icon--Color--light: var(--#{$pf-global}--icon--Color--light--light);
22
+ --#{$pf-global}--icon--Color--dark: var(--#{$pf-global}--icon--Color--dark--light);
23
+
24
+ .#{$button} {
25
+ --#{$button}--m-primary--BackgroundColor: var(--#{$pf-global}--primary-color--dark-100);
26
+ }
19
27
  }
20
28
 
21
29
  // stylelint-disable
package/sass-utilities/scss-variables.scss CHANGED
@@ -183,8 +183,12 @@ $pf-v5-global--BorderRadius--sm: 3px !default;
183
183
  $pf-v5-global--BorderRadius--lg: 30em !default; // This is a sufficiently large number to ensure in most cases that the ends are evenly rounded.
184
184
 
185
185
  // Icons
186
- $pf-v5-global--icon--Color--light: $pf-v5-color-black-600 !default;
187
- $pf-v5-global--icon--Color--dark: $pf-v5-color-black-900 !default;
186
+ $pf-v5-global--icon--Color--light: $pf-v5-color-black-600 !default; // actionable icon color - eg, plain button default color
187
+ $pf-v5-global--icon--Color--dark: $pf-v5-color-black-900 !default; // static icon color and hover/focus color for actionable icons - eg, plain button hover color
188
+ $pf-v5-global--icon--Color--light--light: $pf-v5-color-black-200 !default; // "lighter" icon color for actionable icons - for use in pf-[v]-t-dark
189
+ $pf-v5-global--icon--Color--dark--light: $pf-v5-color-white !default; // "lighter" icon color for static icons - for use in pf-[v]-t-dark
190
+ $pf-v5-global--icon--Color--light--dark: $pf-v5-color-black-600 !default; // "darker" icon color for actionable icons - for use in pf-[v]-t-light
191
+ $pf-v5-global--icon--Color--dark--dark: $pf-v5-color-black-900 !default; // "darker" icon color for static icons - for use in pf-[v]-t-light
188
192
  $pf-v5-global--icon--FontSize--sm: pf-font-prem(12px) !default;
189
193
  $pf-v5-global--icon--FontSize--md: pf-font-prem(16px) !default;
190
194
  $pf-v5-global--icon--FontSize--lg: pf-font-prem(24px) !default;
package/sass-utilities/themes/dark/placeholders.scss CHANGED
@@ -1,10 +1,5 @@
1
1
  %pf-v5-theme-dark--t-dark {
2
- // global
3
- --#{$pf-global}--Color--100: #{$pf-v5-global--Color--100};
4
- --#{$pf-global}--Color--200: #{$pf-v5-global--Color--200};
5
- --#{$pf-global}--BorderColor--100: #{$pf-v5-global--BorderColor--100};
6
- --#{$pf-global}--primary-color--100: #{$pf-v5-global--primary-color--100};
7
- --#{$pf-global}--link--Color: #{$pf-v5-global--link--Color};
8
- --#{$pf-global}--link--Color--hover: #{$pf-v5-global--link--Color--hover};
9
- --#{$pf-global}--BackgroundColor--100: #{$pf-v5-global--BackgroundColor--100};
2
+ .#{$button} {
3
+ --#{$button}--m-primary--BackgroundColor: var(--#{$pf-global}--primary-color--300);
4
+ }
10
5
  }
package/sass-utilities/themes/dark/scss-variables.scss CHANGED
@@ -30,7 +30,8 @@ $pf-v5-global--disabled-color--200: $pf-v5-color-black-500; // disabled backgrou
30
30
  $pf-v5-global--disabled-color--300: $pf-v5-color-black-200; // disabled text on disabled or floating background color - except form elements
31
31
 
32
32
  // icons
33
- $pf-v5-global--icon--Color--light: $pf-v5-color-black-300;
33
+ $pf-v5-global--icon--Color--light: $pf-v5-color-black-200;
34
+ $pf-v5-global--icon--Color--dark: $pf-v5-color-black-50;
34
35
 
35
36
  // theme color resets
36
37
  $pf-v5-global--Color--dark-100: $pf-v5-global--Color--100;
@@ -53,8 +54,10 @@ $pf-v5-global--BackgroundColor--dark-100: $pf-v5-global--BackgroundColor--100;
53
54
  $pf-v5-global--BackgroundColor--dark-200: $pf-v5-global--BackgroundColor--200;
54
55
  $pf-v5-global--BackgroundColor--dark-300: $pf-v5-global--BackgroundColor--300;
55
56
  $pf-v5-global--BackgroundColor--dark-400: $pf-v5-global--BackgroundColor--400;
56
- $pf-v5-global--icon--Color--light: $pf-v5-color-black-200;
57
- $pf-v5-global--icon--Color--dark: $pf-v5-color-black-50;
57
+ $pf-v5-global--icon--Color--light--dark: $pf-v5-global--icon--Color--light;
58
+ $pf-v5-global--icon--Color--dark--dark: $pf-v5-global--icon--Color--dark;
59
+ $pf-v5-global--icon--Color--light--light: $pf-v5-global--icon--Color--light;
60
+ $pf-v5-global--icon--Color--dark--light: $pf-v5-global--icon--Color--dark;
58
61
 
59
62
  // Shadows
60
63
  // small