@patternfly/patternfly 6.5.0-prerelease.10 → 6.5.0-prerelease.11

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 (147) hide show
  1. package/components/Compass/compass.css +9 -9
  2. package/components/Compass/compass.scss +13 -14
  3. package/components/_index.css +9 -9
  4. package/docs/components/Compass/examples/Compass.css +11 -0
  5. package/docs/components/Compass/examples/Compass.md +41 -4584
  6. package/docs/demos/Compass/examples/Compass.md +4550 -0
  7. package/icons/PfIcons/add-circle-o.svg +4 -0
  8. package/icons/PfIcons/ansible-tower.svg +4 -0
  9. package/icons/PfIcons/applications.svg +4 -0
  10. package/icons/PfIcons/arrow.svg +4 -0
  11. package/icons/PfIcons/asleep.svg +4 -0
  12. package/icons/PfIcons/attention-bell.svg +4 -0
  13. package/icons/PfIcons/automation.svg +4 -0
  14. package/icons/PfIcons/bell.svg +4 -0
  15. package/icons/PfIcons/blueprint.svg +4 -0
  16. package/icons/PfIcons/build.svg +4 -0
  17. package/icons/PfIcons/builder-image.svg +4 -0
  18. package/icons/PfIcons/bundle.svg +4 -0
  19. package/icons/PfIcons/catalog.svg +4 -0
  20. package/icons/PfIcons/chat.svg +4 -0
  21. package/icons/PfIcons/close.svg +4 -0
  22. package/icons/PfIcons/cloud-security.svg +4 -0
  23. package/icons/PfIcons/cloud-tenant.svg +4 -0
  24. package/icons/PfIcons/cluster.svg +4 -0
  25. package/icons/PfIcons/connected.svg +4 -0
  26. package/icons/PfIcons/container-node.svg +4 -0
  27. package/icons/PfIcons/cpu.svg +4 -0
  28. package/icons/PfIcons/critical-risk.svg +4 -0
  29. package/icons/PfIcons/data-processor.svg +4 -0
  30. package/icons/PfIcons/data-sink.svg +4 -0
  31. package/icons/PfIcons/data-source.svg +4 -0
  32. package/icons/PfIcons/degraded.svg +4 -0
  33. package/icons/PfIcons/disconnected.svg +4 -0
  34. package/icons/PfIcons/domain.svg +4 -0
  35. package/icons/PfIcons/edit.svg +4 -0
  36. package/icons/PfIcons/enhancement.svg +4 -0
  37. package/icons/PfIcons/enterprise.svg +4 -0
  38. package/icons/PfIcons/equalizer.svg +4 -0
  39. package/icons/PfIcons/error-circle-o.svg +4 -0
  40. package/icons/PfIcons/export.svg +4 -0
  41. package/icons/PfIcons/filter.svg +4 -0
  42. package/icons/PfIcons/flavor.svg +4 -0
  43. package/icons/PfIcons/folder-close.svg +4 -0
  44. package/icons/PfIcons/folder-open.svg +4 -0
  45. package/icons/PfIcons/globe-route.svg +4 -0
  46. package/icons/PfIcons/help.svg +4 -0
  47. package/icons/PfIcons/history.svg +4 -0
  48. package/icons/PfIcons/home.svg +4 -0
  49. package/icons/PfIcons/import.svg +4 -0
  50. package/icons/PfIcons/in-progress.svg +4 -0
  51. package/icons/PfIcons/info.svg +4 -0
  52. package/icons/PfIcons/infrastructure.svg +4 -0
  53. package/icons/PfIcons/integration.svg +4 -0
  54. package/icons/PfIcons/key.svg +4 -0
  55. package/icons/PfIcons/locked.svg +4 -0
  56. package/icons/PfIcons/maintenance.svg +4 -0
  57. package/icons/PfIcons/memory.svg +4 -0
  58. package/icons/PfIcons/messages.svg +4 -0
  59. package/icons/PfIcons/middleware.svg +4 -0
  60. package/icons/PfIcons/migration.svg +4 -0
  61. package/icons/PfIcons/module.svg +4 -0
  62. package/icons/PfIcons/monitoring.svg +4 -0
  63. package/icons/PfIcons/multicluster.svg +4 -0
  64. package/icons/PfIcons/namespaces.svg +4 -0
  65. package/icons/PfIcons/network.svg +4 -0
  66. package/icons/PfIcons/new-process.svg +4 -0
  67. package/icons/PfIcons/not-started.svg +4 -0
  68. package/icons/PfIcons/off.svg +4 -0
  69. package/icons/PfIcons/ok.svg +4 -0
  70. package/icons/PfIcons/on-running.svg +4 -0
  71. package/icons/PfIcons/on.svg +4 -0
  72. package/icons/PfIcons/open-drawer-right.svg +4 -0
  73. package/icons/PfIcons/openshift.svg +4 -0
  74. package/icons/PfIcons/openstack.svg +4 -0
  75. package/icons/PfIcons/optimize.svg +4 -0
  76. package/icons/PfIcons/orders.svg +4 -0
  77. package/icons/PfIcons/os-image.svg +4 -0
  78. package/icons/PfIcons/package.svg +4 -0
  79. package/icons/PfIcons/panel-close.svg +4 -0
  80. package/icons/PfIcons/panel-open.svg +4 -0
  81. package/icons/PfIcons/paused.svg +4 -0
  82. package/icons/PfIcons/pending.svg +4 -0
  83. package/icons/PfIcons/pficon-dragdrop.svg +4 -0
  84. package/icons/PfIcons/pficon-history.svg +4 -0
  85. package/icons/PfIcons/pficon-network-range.svg +4 -0
  86. package/icons/PfIcons/pficon-satellite.svg +4 -0
  87. package/icons/PfIcons/pficon-sort-common-asc.svg +4 -0
  88. package/icons/PfIcons/pficon-sort-common-desc.svg +4 -0
  89. package/icons/PfIcons/pficon-template.svg +4 -0
  90. package/icons/PfIcons/pficon-vcenter.svg +4 -0
  91. package/icons/PfIcons/plugged.svg +4 -0
  92. package/icons/PfIcons/port.svg +4 -0
  93. package/icons/PfIcons/print.svg +4 -0
  94. package/icons/PfIcons/private.svg +4 -0
  95. package/icons/PfIcons/process-automation.svg +4 -0
  96. package/icons/PfIcons/project.svg +4 -0
  97. package/icons/PfIcons/rebalance.svg +4 -0
  98. package/icons/PfIcons/rebooting.svg +4 -0
  99. package/icons/PfIcons/regions.svg +4 -0
  100. package/icons/PfIcons/registry.svg +4 -0
  101. package/icons/PfIcons/remove2.svg +4 -0
  102. package/icons/PfIcons/replicator.svg +4 -0
  103. package/icons/PfIcons/repository.svg +4 -0
  104. package/icons/PfIcons/resource-pool.svg +4 -0
  105. package/icons/PfIcons/resources-almost-empty.svg +4 -0
  106. package/icons/PfIcons/resources-almost-full.svg +4 -0
  107. package/icons/PfIcons/resources-empty.svg +4 -0
  108. package/icons/PfIcons/resources-full.svg +4 -0
  109. package/icons/PfIcons/running.svg +4 -0
  110. package/icons/PfIcons/save.svg +4 -0
  111. package/icons/PfIcons/screen.svg +4 -0
  112. package/icons/PfIcons/security.svg +4 -0
  113. package/icons/PfIcons/server-group.svg +4 -0
  114. package/icons/PfIcons/server.svg +4 -0
  115. package/icons/PfIcons/service-catalog.svg +4 -0
  116. package/icons/PfIcons/service.svg +4 -0
  117. package/icons/PfIcons/services.svg +4 -0
  118. package/icons/PfIcons/severity-critical.svg +4 -0
  119. package/icons/PfIcons/severity-important.svg +4 -0
  120. package/icons/PfIcons/severity-minor.svg +4 -0
  121. package/icons/PfIcons/severity-moderate.svg +4 -0
  122. package/icons/PfIcons/severity-none.svg +4 -0
  123. package/icons/PfIcons/severity-undefined.svg +4 -0
  124. package/icons/PfIcons/spinner.svg +4 -0
  125. package/icons/PfIcons/spinner2.svg +4 -0
  126. package/icons/PfIcons/storage-domain.svg +4 -0
  127. package/icons/PfIcons/task.svg +4 -0
  128. package/icons/PfIcons/tenant.svg +4 -0
  129. package/icons/PfIcons/thumb-tack.svg +4 -0
  130. package/icons/PfIcons/topology.svg +4 -0
  131. package/icons/PfIcons/treeview.svg +4 -0
  132. package/icons/PfIcons/trend-down.svg +4 -0
  133. package/icons/PfIcons/trend-up.svg +4 -0
  134. package/icons/PfIcons/unknown.svg +4 -0
  135. package/icons/PfIcons/unlocked.svg +4 -0
  136. package/icons/PfIcons/unplugged.svg +4 -0
  137. package/icons/PfIcons/user.svg +4 -0
  138. package/icons/PfIcons/users.svg +4 -0
  139. package/icons/PfIcons/virtual-machine.svg +4 -0
  140. package/icons/PfIcons/volume.svg +4 -0
  141. package/icons/PfIcons/warning-triangle.svg +4 -0
  142. package/icons/PfIcons/zone.svg +4 -0
  143. package/package.json +24 -12
  144. package/patternfly-no-globals.css +9 -9
  145. package/patternfly.css +9 -9
  146. package/patternfly.min.css +1 -1
  147. package/patternfly.min.css.map +1 -1
package/components/Compass/compass.css CHANGED
@@ -26,7 +26,7 @@
26
26
  --pf-v6-c-compass__message-bar--Width: 450px;
27
27
  --pf-v6-c-compass__message-bar--MinWidth: 300px;
28
28
  --pf-v6-c-compass__message-bar--MaxWidth: 600px;
29
- --pf-v6-c-compass__hero--gradient--angle: 289deg;
29
+ --pf-v6-c-compass__hero--gradient--angle: 109deg;
30
30
  --pf-v6-c-compass__hero--gradient--stop-1--light: transparent;
31
31
  --pf-v6-c-compass__hero--gradient--stop-2--light: transparent;
32
32
  --pf-v6-c-compass__hero--gradient--stop-3--light: transparent;
@@ -151,9 +151,6 @@
151
151
  .pf-v6-c-compass__panel.pf-m-scrollable {
152
152
  overflow: auto;
153
153
  }
154
- .pf-v6-c-compass__panel.pf-m-padding {
155
- padding: 0;
156
- }
157
154
 
158
155
  .pf-v6-c-compass__hero {
159
156
  display: flex;
@@ -187,21 +184,24 @@
187
184
 
188
185
  /* stylelint-disable */
189
186
  @media (max-width: 1200px) {
190
- .pf-v6-c-compass {
187
+ .pf-v6-c-compass * {
191
188
  display: none;
192
189
  }
193
- body {
190
+ .pf-v6-c-compass {
191
+ position: relative;
194
192
  display: grid;
195
- min-height: 100%;
193
+ grid-template-columns: auto;
194
+ grid-template-rows: auto;
196
195
  place-content: center;
196
+ gap: 0;
197
197
  }
198
- body::after {
198
+ .pf-v6-c-compass::after {
199
199
  padding: 1em;
200
200
  border-radius: var(--pf-t--global--border--radius--large);
201
201
  background: var(--pf-t--global--background--color--primary--default);
202
202
  content: "This page is optimized for wide screens.\a\aPlease view on a larger display and/or make your browser window wider.";
203
203
  width: 80%;
204
- max-width: 360px;
204
+ width: 300px;
205
205
  border: 1px solid var(--pf-t--global--border--color--default);
206
206
  box-shadow: var(--pf-t--global--box-shadow--md);
207
207
  white-space: pre-wrap;
package/components/Compass/compass.scss CHANGED
@@ -28,15 +28,15 @@
28
28
  --#{$compass}__message-bar--Width: 450px;
29
29
  --#{$compass}__message-bar--MinWidth: 300px;
30
30
  --#{$compass}__message-bar--MaxWidth: 600px;
31
- --#{$compass}__hero--gradient--angle: 289deg;
31
+ --#{$compass}__hero--gradient--angle: 109deg;
32
32
  --#{$compass}__hero--gradient--stop-1--light: transparent;
33
33
  --#{$compass}__hero--gradient--stop-2--light: transparent;
34
34
  --#{$compass}__hero--gradient--stop-3--light: transparent;
35
- --#{$compass}__hero--gradient--stop-1--dark: transparent; // #000;
36
- --#{$compass}__hero--gradient--stop-2--dark: transparent; // #1b0d33;
37
- --#{$compass}__hero--gradient--stop-3--dark: transparent; // #3d2785;
38
- --#{$compass}__hero--BackgroundImage--light: none; // url("./assets/images/compass--hero-bg.png");
39
- --#{$compass}__hero--BackgroundImage--dark: none; // url("./assets/images/compass--hero-bg.png");
35
+ --#{$compass}__hero--gradient--stop-1--dark: transparent;
36
+ --#{$compass}__hero--gradient--stop-2--dark: transparent;
37
+ --#{$compass}__hero--gradient--stop-3--dark: transparent;
38
+ --#{$compass}__hero--BackgroundImage--light: none;
39
+ --#{$compass}__hero--BackgroundImage--dark: none;
40
40
  --#{$compass}__hero-body--Width: 800px;
41
41
  --#{$compass}__hero-body--MaxWidth: 80%;
42
42
  }
@@ -174,10 +174,6 @@
174
174
  &.pf-m-scrollable {
175
175
  overflow: auto;
176
176
  }
177
-
178
- &.pf-m-padding {
179
- padding: 0;
180
- }
181
177
  }
182
178
 
183
179
  .#{$compass}__hero {
@@ -251,13 +247,16 @@
251
247
 
252
248
  /* stylelint-disable */
253
249
  @media (max-width: 1200px) {
254
- .#{$compass} {
250
+ .#{$compass} * {
255
251
  display: none;
256
252
  }
257
- body {
253
+ .#{$compass} {
254
+ position: relative;
258
255
  display: grid;
259
- min-height: 100%;
256
+ grid-template-columns: auto;
257
+ grid-template-rows: auto;
260
258
  place-content: center;
259
+ gap: 0;
261
260
 
262
261
  &::after {
263
262
  padding: 1em;
@@ -265,7 +264,7 @@
265
264
  background: var(--pf-t--global--background--color--primary--default);
266
265
  content: "This page is optimized for wide screens.\a\a Please view on a larger display and/or make your browser window wider.";
267
266
  width: 80%;
268
- max-width: 360px;
267
+ width: 300px;
269
268
  border: 1px solid var(--pf-t--global--border--color--default);
270
269
  box-shadow: var(--pf-t--global--box-shadow--md);
271
270
  white-space: pre-wrap;
package/components/_index.css CHANGED
@@ -3517,7 +3517,7 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
3517
3517
  --pf-v6-c-compass__message-bar--Width: 450px;
3518
3518
  --pf-v6-c-compass__message-bar--MinWidth: 300px;
3519
3519
  --pf-v6-c-compass__message-bar--MaxWidth: 600px;
3520
- --pf-v6-c-compass__hero--gradient--angle: 289deg;
3520
+ --pf-v6-c-compass__hero--gradient--angle: 109deg;
3521
3521
  --pf-v6-c-compass__hero--gradient--stop-1--light: transparent;
3522
3522
  --pf-v6-c-compass__hero--gradient--stop-2--light: transparent;
3523
3523
  --pf-v6-c-compass__hero--gradient--stop-3--light: transparent;
@@ -3642,9 +3642,6 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
3642
3642
  .pf-v6-c-compass__panel.pf-m-scrollable {
3643
3643
  overflow: auto;
3644
3644
  }
3645
- .pf-v6-c-compass__panel.pf-m-padding {
3646
- padding: 0;
3647
- }
3648
3645
 
3649
3646
  .pf-v6-c-compass__hero {
3650
3647
  display: flex;
@@ -3678,21 +3675,24 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
3678
3675
 
3679
3676
  /* stylelint-disable */
3680
3677
  @media (max-width: 1200px) {
3681
- .pf-v6-c-compass {
3678
+ .pf-v6-c-compass * {
3682
3679
  display: none;
3683
3680
  }
3684
- body {
3681
+ .pf-v6-c-compass {
3682
+ position: relative;
3685
3683
  display: grid;
3686
- min-height: 100%;
3684
+ grid-template-columns: auto;
3685
+ grid-template-rows: auto;
3687
3686
  place-content: center;
3687
+ gap: 0;
3688
3688
  }
3689
- body::after {
3689
+ .pf-v6-c-compass::after {
3690
3690
  padding: 1em;
3691
3691
  border-radius: var(--pf-t--global--border--radius--large);
3692
3692
  background: var(--pf-t--global--background--color--primary--default);
3693
3693
  content: "This page is optimized for wide screens.\a\aPlease view on a larger display and/or make your browser window wider.";
3694
3694
  width: 80%;
3695
- max-width: 360px;
3695
+ width: 300px;
3696
3696
  border: 1px solid var(--pf-t--global--border--color--default);
3697
3697
  box-shadow: var(--pf-t--global--box-shadow--md);
3698
3698
  white-space: pre-wrap;
package/docs/components/Compass/examples/Compass.css ADDED
@@ -0,0 +1,11 @@
1
+ #ws-core-c-compass-basic [class*="pf-v6-c-compass"] {
2
+ position: relative;
3
+ }
4
+
5
+ #ws-core-c-compass-basic [class*="pf-v6-c-compass"]::after {
6
+ position: absolute;
7
+ inset: 0;
8
+ pointer-events: none;
9
+ content: "";
10
+ border: var(--pf-t--global--border--width--regular) dashed var(--pf-t--global--border--color--default);
11
+ }