@patternfly/patternfly 5.0.0-alpha.4 → 5.0.0-alpha.40

package/patternfly-base.css

@@ -17,27 +17,6 @@
   --pf-global--link--Color--hover: var(--pf-global--link--Color--light);
   --pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--dark-100);
 }
-.pf-t-dark .pf-c-card {
-  --pf-c-card--BackgroundColor: var(--pf-global--BackgroundColor--dark-transparent-200);
-}
-.pf-t-dark .pf-c-button {
-  --pf-c-button--m-primary--Color: var(--pf-global--primary-color--dark-100);
-  --pf-c-button--m-primary--hover--Color: var(--pf-global--primary-color--dark-100);
-  --pf-c-button--m-primary--focus--Color: var(--pf-global--primary-color--dark-100);
-  --pf-c-button--m-primary--active--Color: var(--pf-global--primary-color--dark-100);
-  --pf-c-button--m-primary--BackgroundColor: var(--pf-global--BackgroundColor--light-100);
-  --pf-c-button--m-primary--hover--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
-  --pf-c-button--m-primary--focus--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
-  --pf-c-button--m-primary--active--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
-  --pf-c-button--m-secondary--Color: var(--pf-global--Color--light-100);
-  --pf-c-button--m-secondary--hover--Color: var(--pf-global--Color--light-100);
-  --pf-c-button--m-secondary--focus--Color: var(--pf-global--Color--light-100);
-  --pf-c-button--m-secondary--active--Color: var(--pf-global--Color--light-100);
-  --pf-c-button--m-secondary--BorderColor: var(--pf-global--Color--light-100);
-  --pf-c-button--m-secondary--hover--BorderColor: var(--pf-global--Color--light-100);
-  --pf-c-button--m-secondary--focus--BorderColor: var(--pf-global--Color--light-100);
-  --pf-c-button--m-secondary--active--BorderColor: var(--pf-global--Color--light-100);
-}
 
 :root {
   --pf-global--palette--black-100: #fafafa;
@@ -154,9 +133,9 @@
   --pf-global--primary-color--light-100: #73bcf7;
   --pf-global--primary-color--dark-100: #06c;
   --pf-global--secondary-color--100: #6a6e73;
-  --pf-global--default-color--100: #73c5c5;
-  --pf-global--default-color--200: #009596;
-  --pf-global--default-color--300: #003737;
+  --pf-global--custom-color--100: #73c5c5;
+  --pf-global--custom-color--200: #009596;
+  --pf-global--custom-color--300: #003737;
   --pf-global--success-color--100: #3e8635;
   --pf-global--success-color--200: #1e4f18;
   --pf-global--info-color--100: #2b9af3;
@@ -376,133 +355,123 @@
 
 @font-face {
   font-family: "RedHatDisplay";
-  src: url("./assets/fonts/RedHatDisplay/RedHatDisplay-Regular.woff2") format("woff2"), url("./assets/fonts/RedHatDisplay/RedHatDisplay-Regular.woff") format("woff");
   font-style: normal;
   font-weight: 300;
+  src: url("./assets/fonts/RedHatDisplay/RedHatDisplay-Regular.woff2") format("woff2");
   text-rendering: optimizelegibility;
 }
 @font-face {
   font-family: "RedHatDisplay";
-  src: url("./assets/fonts/RedHatDisplay/RedHatDisplay-Medium.woff2") format("woff2"), url("./assets/fonts/RedHatDisplay/RedHatDisplay-Medium.woff") format("woff");
   font-style: normal;
   font-weight: 400;
+  src: url("./assets/fonts/RedHatDisplay/RedHatDisplay-Medium.woff2") format("woff2");
   text-rendering: optimizelegibility;
 }
 @font-face {
   font-family: "RedHatDisplay";
-  src: url("./assets/fonts/RedHatDisplay/RedHatDisplay-Bold.woff2") format("woff2"), url("./assets/fonts/RedHatDisplay/RedHatDisplay-Bold.woff") format("woff");
   font-style: normal;
   font-weight: 700;
+  src: url("./assets/fonts/RedHatDisplay/RedHatDisplay-Bold.woff2") format("woff2");
   text-rendering: optimizelegibility;
 }
 @font-face {
   font-family: "RedHatText";
-  src: url("./assets/fonts/RedHatText/RedHatText-Regular.woff2") format("woff2"), url("./assets/fonts/RedHatText/RedHatText-Regular.woff") format("woff");
   font-style: normal;
   font-weight: 400;
+  src: url("./assets/fonts/RedHatText/RedHatText-Regular.woff2") format("woff2");
   text-rendering: optimizelegibility;
 }
 @font-face {
   font-family: "RedHatText";
-  src: url("./assets/fonts/RedHatText/RedHatText-Medium.woff2") format("woff2"), url("./assets/fonts/RedHatText/RedHatText-Medium.woff") format("woff");
   font-style: normal;
   font-weight: 700;
+  src: url("./assets/fonts/RedHatText/RedHatText-Medium.woff2") format("woff2");
   text-rendering: optimizelegibility;
 }
 @font-face {
   font-family: "RedHatDisplayUpdated";
-  src: url("./assets/fonts/RedHatFont-updated/RedHatDisplay/RedHatDisplay-updated-Regular.woff2") format("woff2");
   font-style: normal;
   font-weight: 300;
+  src: url("./assets/fonts/RedHatFont-updated/RedHatDisplay/RedHatDisplay-updated-Regular.woff2") format("woff2");
   text-rendering: optimizelegibility;
 }
 @font-face {
   font-family: "RedHatDisplayUpdated";
-  src: url("./assets/fonts/RedHatFont-updated/RedHatDisplay/RedHatDisplay-updated-Medium.woff2") format("woff2");
   font-style: normal;
   font-weight: 400;
+  src: url("./assets/fonts/RedHatFont-updated/RedHatDisplay/RedHatDisplay-updated-Medium.woff2") format("woff2");
   text-rendering: optimizelegibility;
 }
 @font-face {
   font-family: "RedHatDisplayUpdated";
-  src: url("./assets/fonts/RedHatFont-updated/RedHatDisplay/RedHatDisplay-updated-Bold.woff2") format("woff2");
   font-style: normal;
   font-weight: 700;
+  src: url("./assets/fonts/RedHatFont-updated/RedHatDisplay/RedHatDisplay-updated-Bold.woff2") format("woff2");
   text-rendering: optimizelegibility;
 }
 @font-face {
   font-family: "RedHatTextUpdated";
-  src: url("./assets/fonts/RedHatFont-updated/RedHatText/RedHatText-updated-Regular.woff2") format("woff2");
   font-style: normal;
   font-weight: 400;
+  src: url("./assets/fonts/RedHatFont-updated/RedHatText/RedHatText-updated-Regular.woff2") format("woff2");
   text-rendering: optimizelegibility;
 }
 @font-face {
   font-family: "RedHatTextUpdated";
-  src: url("./assets/fonts/RedHatFont-updated/RedHatText/RedHatText-updated-Medium.woff2") format("woff2");
   font-style: normal;
   font-weight: 700;
+  src: url("./assets/fonts/RedHatFont-updated/RedHatText/RedHatText-updated-Medium.woff2") format("woff2");
   text-rendering: optimizelegibility;
 }
 @font-face {
   font-family: "RedHatMono";
-  src: url("./assets/fonts/RedHatFont-updated/RedHatMono/RedHatMono-updated-Regular.woff2") format("woff2");
   font-style: normal;
   font-weight: 400;
+  src: url("./assets/fonts/RedHatFont-updated/RedHatMono/RedHatMono-updated-Regular.woff2") format("woff2");
   font-display: fallback;
 }
 @font-face {
   font-family: "RedHatDisplayVF";
-  src: url("./assets/fonts/RedHatFont-updated/modified/RedHatDisplayVFModified-updated.woff2") format("woff2-variations");
   font-style: normal;
   font-weight: 300 900;
+  src: url("./assets/fonts/RedHatFont-updated/modified/RedHatDisplayVFModified-updated.woff2") format("woff2-variations");
   font-display: fallback;
 }
 @font-face {
   font-family: "RedHatDisplayVF";
-  src: url("./assets/fonts/RedHatFont-updated/modified/RedHatDisplayVF-updated-ItalicModified.woff2") format("woff2-variations");
   font-style: italic;
   font-weight: 300 900;
+  src: url("./assets/fonts/RedHatFont-updated/modified/RedHatDisplayVF-updated-ItalicModified.woff2") format("woff2-variations");
   font-display: fallback;
 }
 @font-face {
   font-family: "RedHatTextVF";
-  src: url("./assets/fonts/RedHatFont-updated/modified/RedHatTextVFModified-updated.woff2") format("woff2-variations");
   font-style: normal;
   font-weight: 400 500;
+  src: url("./assets/fonts/RedHatFont-updated/modified/RedHatTextVFModified-updated.woff2") format("woff2-variations");
   font-display: fallback;
 }
 @font-face {
   font-family: "RedHatTextVF";
-  src: url("./assets/fonts/RedHatFont-updated/modified/RedHatTextVF-updated-ItalicModified.woff2") format("woff2-variations");
   font-style: italic;
   font-weight: 400 500;
+  src: url("./assets/fonts/RedHatFont-updated/modified/RedHatTextVF-updated-ItalicModified.woff2") format("woff2-variations");
   font-display: fallback;
 }
 @font-face {
   font-family: "RedHatMonoVF";
-  src: url("./assets/fonts/RedHatFont-updated/RedHatMono/RedHatMonoVF-updated.woff2") format("woff2-variations");
   font-style: normal;
   font-weight: 300 700;
+  src: url("./assets/fonts/RedHatFont-updated/RedHatMono/RedHatMonoVF-updated.woff2") format("woff2-variations");
   font-display: fallback;
 }
 @font-face {
   font-family: "RedHatMonoVF";
-  src: url("./assets/fonts/RedHatFont-updated/RedHatMono/RedHatMonoVF-updated-Italic.woff2") format("woff2-variations");
   font-style: italic;
   font-weight: 300 700;
+  src: url("./assets/fonts/RedHatFont-updated/RedHatMono/RedHatMonoVF-updated-Italic.woff2") format("woff2-variations");
   font-display: fallback;
 }
-[class*=pf-c-], [class*=pf-c-]::before, [class*=pf-c-]::after {
-  padding: 0;
-  margin: 0;
-  background-color: transparent;
-}
-
-html {
-  font-size: var(--pf-global--root--FontSize, unset) !important;
-}
-
 .pf-screen-reader {
   position: fixed;
   top: 0;
@@ -524,7 +493,7 @@ html {
   font-variant-numeric: tabular-nums;
 }
 
-html,
+:where(html,
 body,
 p,
 ol,
@@ -546,35 +515,48 @@ h2,
 h3,
 h4,
 h5,
-h6 {
+h6) {
   padding: 0;
   margin: 0;
 }
 
-html,
-body {
+*,
+:where(*::before,
+*::after) {
+  box-sizing: border-box;
+}
+
+:where(html,
+body) {
   height: 100%;
 }
 
-h1,
+:where(body) {
+  font-family: var(--pf-global--FontFamily--sans-serif);
+  font-size: var(--pf-global--FontSize--md);
+  font-weight: var(--pf-global--FontWeight--normal);
+  line-height: var(--pf-global--LineHeight--md);
+}
+
+:where(h1,
 h2,
 h3,
 h4,
 h5,
-h6 {
+h6) {
   font-size: 100%;
   font-weight: var(--pf-global--FontWeight--normal);
 }
 
-ul {
+:where(ul) {
   list-style: none;
 }
 
-button,
+:where(button,
 input,
 optgroup,
 select,
-textarea {
+textarea) {
   margin: 0;
   font-family: inherit;
   font-size: 100%;
@@ -582,68 +564,49 @@ textarea {
   color: var(--pf-global--Color--100);
 }
 
-img,
+:where(img,
 embed,
 iframe,
 object,
 audio,
-video {
+video) {
   max-width: 100%;
   height: auto;
 }
 
-iframe {
+:where(iframe) {
   border: 0;
 }
 
-table {
+:where(table) {
   border-spacing: 0;
   border-collapse: collapse;
 }
 
-td,
-th {
+:where(td,
+th) {
   padding: 0;
   text-align: left;
 }
 
-code,
-pre {
+:where(code,
+pre) {
   font-family: var(--pf-global--FontFamily--monospace);
 }
 
-*,
-*::before,
-*::after {
-  box-sizing: border-box;
-}
-
-html {
-  font-family: sans-serif;
-  line-height: 1.15;
-}
-
-body {
-  font-family: var(--pf-global--FontFamily--sans-serif);
-  font-size: var(--pf-global--FontSize--md);
-  font-weight: var(--pf-global--FontWeight--normal);
-  line-height: var(--pf-global--LineHeight--md);
-  text-align: left;
-  background-color: var(--pf-global--BackgroundColor--100);
-}
-
-a {
+:where(a) {
   font-weight: var(--pf-global--link--FontWeight);
   color: var(--pf-global--link--Color);
   text-decoration: var(--pf-global--link--TextDecoration);
 }
-a:hover {
+
+:where(a:hover) {
   --pf-global--link--Color: var(--pf-global--link--Color--hover);
   --pf-global--link--TextDecoration: var(--pf-global--link--TextDecoration--hover);
 }
 
-button,
-a {
+:where(a,
+button) {
   cursor: pointer;
 }
 
@@ -4860,7 +4823,7 @@ a {
   font-family: "Font Awesome 5 Free";
   font-style: normal;
   font-weight: 900;
-  src: url("./assets/fonts/webfonts/fa-solid-900.woff2") format("woff2"), url("./assets/fonts/webfonts/fa-solid-900.woff") format("woff");
+  src: url("./assets/fonts/webfonts/fa-solid-900.woff2") format("woff2");
 }
 .fa,
 .fas {
@@ -4870,9 +4833,9 @@ a {
 
 @font-face {
   font-family: "pficon";
-  src: url("./assets/pficon/pficon.woff2") format("woff2"), url("./assets/pficon/pficon.woff") format("woff");
+  src: url("./assets/pficon/pficon.woff2") format("woff2");
 }
-.pf-icon-zone:before, .pf-icon-warning-triangle:before, .pf-icon-volume:before, .pf-icon-virtual-machine:before, .pf-icon-users:before, .pf-icon-user:before, .pf-icon-unplugged:before, .pf-icon-unlocked:before, .pf-icon-unknown:before, .pf-icon-trend-up:before, .pf-icon-trend-down:before, .pf-icon-topology:before, .pf-icon-thumb-tack:before, .pf-icon-tenant:before, .pf-icon-task:before, .pf-icon-storage-domain:before, .pf-icon-spinner2:before, .pf-icon-spinner:before, .pf-icon-services:before, .pf-icon-service:before, .pf-icon-service-catalog:before, .pf-icon-server:before, .pf-icon-server-group:before, .pf-icon-security:before, .pf-icon-screen:before, .pf-icon-save:before, .pf-icon-running:before, .pf-icon-resources-full:before, .pf-icon-resources-empty:before, .pf-icon-resources-almost-full:before, .pf-icon-resources-almost-empty:before, .pf-icon-resource-pool:before, .pf-icon-repository:before, .pf-icon-replicator:before, .pf-icon-remove2:before, .pf-icon-registry:before, .pf-icon-regions:before, .pf-icon-rebooting:before, .pf-icon-rebalance:before, .pf-icon-project:before, .pf-icon-process-automation:before, .pf-icon-private:before, .pf-icon-print:before, .pf-icon-port:before, .pf-icon-plugged:before, .pf-icon-pficon-vcenter:before, .pf-icon-pficon-template:before, .pf-icon-pficon-sort-common-desc:before, .pf-icon-pficon-sort-common-asc:before, .pf-icon-pficon-satellite:before, .pf-icon-pficon-network-range:before, .pf-icon-pficon-history:before, .pf-icon-pficon-dragdrop:before, .pf-icon-pending:before, .pf-icon-paused:before, .pf-icon-panel-open:before, .pf-icon-panel-close:before, .pf-icon-package:before, .pf-icon-os-image:before, .pf-icon-orders:before, .pf-icon-optimize:before, .pf-icon-openstack:before, .pf-icon-openshift:before, .pf-icon-open-drawer-right:before, .pf-icon-on:before, .pf-icon-on-running:before, .pf-icon-ok:before, .pf-icon-off:before, .pf-icon-not-started:before, .pf-icon-new-process:before, .pf-icon-network:before, .pf-icon-namespaces:before, .pf-icon-monitoring:before, .pf-icon-module:before, .pf-icon-migration:before, .pf-icon-middleware:before, .pf-icon-messages:before, .pf-icon-memory:before, .pf-icon-maintenance:before, .pf-icon-locked:before, .pf-icon-key:before, .pf-icon-integration:before, .pf-icon-infrastructure:before, .pf-icon-info:before, .pf-icon-in-progress:before, .pf-icon-import:before, .pf-icon-home:before, .pf-icon-history:before, .pf-icon-help:before, .pf-icon-globe-route:before, .pf-icon-folder-open:before, .pf-icon-folder-close:before, .pf-icon-flavor:before, .pf-icon-filter:before, .pf-icon-export:before, .pf-icon-error-circle-o:before, .pf-icon-equalizer:before, .pf-icon-enterprise:before, .pf-icon-enhancement:before, .pf-icon-edit:before, .pf-icon-domain:before, .pf-icon-disconnected:before, .pf-icon-degraded:before, .pf-icon-data-source:before, .pf-icon-data-sink:before, .pf-icon-critical-risk:before, .pf-icon-cpu:before, .pf-icon-container-node:before, .pf-icon-connected:before, .pf-icon-cluster:before, .pf-icon-cloud-tenant:before, .pf-icon-cloud-security:before, .pf-icon-close:before, .pf-icon-chat:before, .pf-icon-catalog:before, .pf-icon-bundle:before, .pf-icon-builder-image:before, .pf-icon-build:before, .pf-icon-blueprint:before, .pf-icon-bell:before, .pf-icon-automation:before, .pf-icon-attention-bell:before, .pf-icon-asleep:before, .pf-icon-arrow:before, .pf-icon-applications:before, .pf-icon-ansible-tower:before, .pf-icon-add-circle-o:before {
+.pf-icon-zone:before, .pf-icon-warning-triangle:before, .pf-icon-volume:before, .pf-icon-virtual-machine:before, .pf-icon-users:before, .pf-icon-user:before, .pf-icon-unplugged:before, .pf-icon-unlocked:before, .pf-icon-unknown:before, .pf-icon-trend-up:before, .pf-icon-trend-down:before, .pf-icon-topology:before, .pf-icon-thumb-tack:before, .pf-icon-tenant:before, .pf-icon-task:before, .pf-icon-storage-domain:before, .pf-icon-spinner2:before, .pf-icon-spinner:before, .pf-icon-services:before, .pf-icon-service:before, .pf-icon-service-catalog:before, .pf-icon-server:before, .pf-icon-server-group:before, .pf-icon-security:before, .pf-icon-screen:before, .pf-icon-save:before, .pf-icon-running:before, .pf-icon-resources-full:before, .pf-icon-resources-empty:before, .pf-icon-resources-almost-full:before, .pf-icon-resources-almost-empty:before, .pf-icon-resource-pool:before, .pf-icon-repository:before, .pf-icon-replicator:before, .pf-icon-remove2:before, .pf-icon-registry:before, .pf-icon-regions:before, .pf-icon-rebooting:before, .pf-icon-rebalance:before, .pf-icon-project:before, .pf-icon-process-automation:before, .pf-icon-private:before, .pf-icon-print:before, .pf-icon-port:before, .pf-icon-plugged:before, .pf-icon-pficon-vcenter:before, .pf-icon-pficon-template:before, .pf-icon-pficon-sort-common-desc:before, .pf-icon-pficon-sort-common-asc:before, .pf-icon-pficon-satellite:before, .pf-icon-pficon-network-range:before, .pf-icon-pficon-history:before, .pf-icon-pficon-dragdrop:before, .pf-icon-pending:before, .pf-icon-paused:before, .pf-icon-panel-open:before, .pf-icon-panel-close:before, .pf-icon-package:before, .pf-icon-os-image:before, .pf-icon-orders:before, .pf-icon-optimize:before, .pf-icon-openstack:before, .pf-icon-openshift:before, .pf-icon-open-drawer-right:before, .pf-icon-on:before, .pf-icon-on-running:before, .pf-icon-ok:before, .pf-icon-off:before, .pf-icon-not-started:before, .pf-icon-new-process:before, .pf-icon-network:before, .pf-icon-namespaces:before, .pf-icon-monitoring:before, .pf-icon-module:before, .pf-icon-migration:before, .pf-icon-middleware:before, .pf-icon-messages:before, .pf-icon-memory:before, .pf-icon-maintenance:before, .pf-icon-locked:before, .pf-icon-key:before, .pf-icon-integration:before, .pf-icon-infrastructure:before, .pf-icon-info:before, .pf-icon-in-progress:before, .pf-icon-import:before, .pf-icon-home:before, .pf-icon-history:before, .pf-icon-help:before, .pf-icon-globe-route:before, .pf-icon-folder-open:before, .pf-icon-folder-close:before, .pf-icon-flavor:before, .pf-icon-filter:before, .pf-icon-export:before, .pf-icon-error-circle-o:before, .pf-icon-equalizer:before, .pf-icon-enterprise:before, .pf-icon-enhancement:before, .pf-icon-edit:before, .pf-icon-domain:before, .pf-icon-disconnected:before, .pf-icon-degraded:before, .pf-icon-data-source:before, .pf-icon-data-sink:before, .pf-icon-data-processor:before, .pf-icon-critical-risk:before, .pf-icon-cpu:before, .pf-icon-container-node:before, .pf-icon-connected:before, .pf-icon-cluster:before, .pf-icon-cloud-tenant:before, .pf-icon-cloud-security:before, .pf-icon-close:before, .pf-icon-chat:before, .pf-icon-catalog:before, .pf-icon-bundle:before, .pf-icon-builder-image:before, .pf-icon-build:before, .pf-icon-blueprint:before, .pf-icon-bell:before, .pf-icon-automation:before, .pf-icon-attention-bell:before, .pf-icon-asleep:before, .pf-icon-arrow:before, .pf-icon-applications:before, .pf-icon-ansible-tower:before, .pf-icon-add-circle-o:before {
   font-family: "pficon";
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
@@ -4971,6 +4934,10 @@ a {
   content: "\e976";
 }
 
+.pf-icon-data-processor:before {
+  content: "\e97b";
+}
+
 .pf-icon-data-sink:before {
   content: "\e978";
 }
@@ -5391,26 +5358,8 @@ a {
   content: "\e911";
 }
 
-.pf-svg-size-sm {
+.pf-svg {
   width: 1em;
   height: 1em;
   vertical-align: -0.125em;
-}
-
-.pf-svg-size-md {
-  width: 1.5em;
-  height: 1.5em;
-  vertical-align: -0.1875em;
-}
-
-.pf-svg-size-lg {
-  width: 2em;
-  height: 2em;
-  vertical-align: -0.25em;
-}
-
-.pf-svg-size-xl {
-  width: 3em;
-  height: 3em;
-  vertical-align: -0.375em;
 }