@patternfly/patternfly 4.196.1 → 4.196.4

package/assets/images/icon-github.hbs

@@ -0,0 +1,4 @@
+<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
+  <title>GitHub logo</title>
+  <path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"/>
+</svg>

package/assets/images/icon-google.hbs

@@ -0,0 +1,4 @@
+<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="#4285F4">
+  <title>Google logo</title>
+  <path d="M12.24 10.285V14.4h6.806c-.275 1.765-2.056 5.174-6.806 5.174-4.095 0-7.439-3.389-7.439-7.574s3.345-7.574 7.439-7.574c2.33 0 3.891.989 4.785 1.849l3.254-3.138C18.189 1.186 15.479 0 12.24 0c-6.635 0-12 5.365-12 12s5.365 12 12 12c6.926 0 11.52-4.869 11.52-11.726 0-.788-.085-1.39-.189-1.989H12.24z"/>
+</svg>

package/assets/images/icon-red-hat.hbs

@@ -0,0 +1 @@
+<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 192 145"><defs><style>.cls-1{fill:#e00;}</style></defs><title>RedHat-Logo-Hat-Color</title><path d="M157.77,62.61a14,14,0,0,1,.31,3.42c0,14.88-18.1,17.46-30.61,17.46C78.83,83.49,42.53,53.26,42.53,44a6.43,6.43,0,0,1,.22-1.94l-3.66,9.06a18.45,18.45,0,0,0-1.51,7.33c0,18.11,41,45.48,87.74,45.48,20.69,0,36.43-7.76,36.43-21.77,0-1.08,0-1.94-1.73-10.13Z"/><path class="cls-1" d="M127.47,83.49c12.51,0,30.61-2.58,30.61-17.46a14,14,0,0,0-.31-3.42l-7.45-32.36c-1.72-7.12-3.23-10.35-15.73-16.6C124.89,8.69,103.76.5,97.51.5,91.69.5,90,8,83.06,8c-6.68,0-11.64-5.6-17.89-5.6-6,0-9.91,4.09-12.93,12.5,0,0-8.41,23.72-9.49,27.16A6.43,6.43,0,0,0,42.53,44c0,9.22,36.3,39.45,84.94,39.45M160,72.07c1.73,8.19,1.73,9.05,1.73,10.13,0,14-15.74,21.77-36.43,21.77C78.54,104,37.58,76.6,37.58,58.49a18.45,18.45,0,0,1,1.51-7.33C22.27,52,.5,55,.5,74.22c0,31.48,74.59,70.28,133.65,70.28,45.28,0,56.7-20.48,56.7-36.65,0-12.72-11-27.16-30.83-35.78"/></svg>

package/base/patternfly-variables.css

@@ -280,7 +280,7 @@
   --pf-global--BorderColor--200: #444548;
   --pf-global--BorderColor--300: #57585a;
   --pf-global--BorderColor--400: #aaabac;
-  --pf-global--Color--100: #fff;
+  --pf-global--Color--100: #e0e0e0;
   --pf-global--Color--200: #aaabac;
   --pf-global--active-color--100: #1fa7f8;
   --pf-global--primary-color--100: #1fa7f8;
@@ -297,9 +297,9 @@
   --pf-global--disabled-color--300: #aaabac;
   --pf-global--icon--Color--light: #aaabac;
   --pf-global--icon--Color--dark: #aaabac;
-  --pf-global--Color--dark-100: #fff;
+  --pf-global--Color--dark-100: #e0e0e0;
   --pf-global--Color--dark-200: #aaabac;
-  --pf-global--Color--light-100: #fff;
+  --pf-global--Color--light-100: #e0e0e0;
   --pf-global--Color--light-200: #aaabac;
   --pf-global--Color--light-300: #3c3f42;
   --pf-global--BorderColor--dark-100: #444548;

package/components/AboutModalBox/about-modal-box.css

@@ -263,7 +263,7 @@
 }
 
 :where(.pf-theme-dark) .pf-c-about-modal-box {
-  --pf-global--Color--100: #fff;
+  --pf-global--Color--100: #e0e0e0;
   --pf-global--Color--200: #aaabac;
   --pf-global--BorderColor--100: #444548;
   --pf-global--primary-color--100: #1fa7f8;

package/components/Banner/banner.css

@@ -127,7 +127,7 @@
 }
 
 :where(.pf-theme-dark) .pf-c-banner {
-  --pf-global--Color--100: #fff;
+  --pf-global--Color--100: #e0e0e0;
   --pf-global--Color--200: #aaabac;
   --pf-global--BorderColor--100: #444548;
   --pf-global--primary-color--100: #1fa7f8;

package/components/CalendarMonth/calendar-month.css

@@ -19,10 +19,10 @@
   --pf-c-calendar-month__header-year--Width: 8ch;
   --pf-c-calendar-month__header-nav-control--MarginRight: 0;
   --pf-c-calendar-month__header-nav-control--MarginLeft: 0;
-  --pf-c-calendar-month__header-nav-control--m-prev-month--MarginRight: var(--pf-global--spacer--sm);
-  --pf-c-calendar-month__header-nav-control--m-prev-month--MarginLeft: calc(var(--pf-global--spacer--md) * -1);
-  --pf-c-calendar-month__header-nav-control--m-next-month--MarginRight: calc(var(--pf-global--spacer--md) * -1);
-  --pf-c-calendar-month__header-nav-control--m-next-month--MarginLeft: var(--pf-global--spacer--sm);
+  --pf-c-calendar-month__header-nav-control--m-prev-month--MarginRight: 0;
+  --pf-c-calendar-month__header-nav-control--m-prev-month--MarginLeft: 0;
+  --pf-c-calendar-month__header-nav-control--m-next-month--MarginRight: 0;
+  --pf-c-calendar-month__header-nav-control--m-next-month--MarginLeft: 0;
   --pf-c-calendar-month__days--BorderBottomWidth: var(--pf-global--BorderWidth--sm);
   --pf-c-calendar-month__days--BorderBottomColor: var(--pf-global--BorderColor--100);
   --pf-c-calendar-month__day--PaddingBottom: var(--pf-global--spacer--md);

package/components/CalendarMonth/calendar-month.scss

@@ -11,10 +11,10 @@
   --pf-c-calendar-month__header-year--Width: 8ch;
   --pf-c-calendar-month__header-nav-control--MarginRight: 0;
   --pf-c-calendar-month__header-nav-control--MarginLeft: 0;
-  --pf-c-calendar-month__header-nav-control--m-prev-month--MarginRight: var(--pf-global--spacer--sm);
-  --pf-c-calendar-month__header-nav-control--m-prev-month--MarginLeft: calc(var(--pf-global--spacer--md) * -1);
-  --pf-c-calendar-month__header-nav-control--m-next-month--MarginRight: calc(var(--pf-global--spacer--md) * -1);
-  --pf-c-calendar-month__header-nav-control--m-next-month--MarginLeft: var(--pf-global--spacer--sm);
+  --pf-c-calendar-month__header-nav-control--m-prev-month--MarginRight: 0; // remove in breaking change
+  --pf-c-calendar-month__header-nav-control--m-prev-month--MarginLeft: 0; // remove in breaking change
+  --pf-c-calendar-month__header-nav-control--m-next-month--MarginRight: 0; // remove in breaking change
+  --pf-c-calendar-month__header-nav-control--m-next-month--MarginLeft: 0; // remove in breaking change
 
   // week days thead
   --pf-c-calendar-month__days--BorderBottomWidth: var(--pf-global--BorderWidth--sm);

package/components/LogViewer/log-viewer.css

@@ -201,7 +201,7 @@
 }
 
 :where(.pf-theme-dark) .pf-c-log-viewer.pf-m-dark .pf-c-log-viewer__main {
-  --pf-global--Color--100: #fff;
+  --pf-global--Color--100: #e0e0e0;
   --pf-global--Color--200: #aaabac;
   --pf-global--BorderColor--100: #444548;
   --pf-global--primary-color--100: #1fa7f8;

package/components/Login/login.css

@@ -298,7 +298,7 @@
 
 :where(.pf-theme-dark) .pf-c-login__header,
 :where(.pf-theme-dark) .pf-c-login__footer {
-  --pf-global--Color--100: #fff;
+  --pf-global--Color--100: #e0e0e0;
   --pf-global--Color--200: #aaabac;
   --pf-global--BorderColor--100: #444548;
   --pf-global--primary-color--100: #1fa7f8;

package/components/Masthead/masthead.css

@@ -660,7 +660,7 @@
 }
 
 :where(.pf-theme-dark) .pf-c-masthead {
-  --pf-global--Color--100: #fff;
+  --pf-global--Color--100: #e0e0e0;
   --pf-global--Color--200: #aaabac;
   --pf-global--BorderColor--100: #444548;
   --pf-global--primary-color--100: #1fa7f8;

package/components/Page/page.css

@@ -272,11 +272,11 @@
 .pf-c-page__header,
 .pf-c-page > .pf-c-masthead {
   grid-area: header;
+  z-index: var(--pf-c-page__header--ZIndex);
 }
 
 .pf-c-page__header {
   color: var(--pf-global--Color--100);
-  z-index: var(--pf-c-page__header--ZIndex);
   grid-template-columns: auto auto;
   display: grid;
   align-items: center;
@@ -782,7 +782,7 @@
 :where(.pf-theme-dark) .pf-c-page__sidebar-body.pf-m-menu .pf-c-context-selector,
 :where(.pf-theme-dark) .pf-c-page__main-section[class*=pf-m-dark-],
 :where(.pf-theme-dark) .pf-c-page__header {
-  --pf-global--Color--100: #fff;
+  --pf-global--Color--100: #e0e0e0;
   --pf-global--Color--200: #aaabac;
   --pf-global--BorderColor--100: #444548;
   --pf-global--primary-color--100: #1fa7f8;

package/components/Page/page.scss

@@ -210,12 +210,12 @@ $pf-c-page--breakpoint-map: build-breakpoint-map("base", "sm", "md", "lg", "xl",
 .pf-c-page__header,
 .pf-c-page > .pf-c-masthead {
   grid-area: header;
+  z-index: var(--pf-c-page__header--ZIndex);
 }
 
 .pf-c-page__header {
   @include pf-t-dark; // force the container to follow the dark theme
 
-  z-index: var(--pf-c-page__header--ZIndex);
   grid-template-columns: auto auto;
   display: grid;
   align-items: center;

package/components/Wizard/wizard.css

@@ -512,7 +512,7 @@
 }
 
 :where(.pf-theme-dark) .pf-c-wizard__header {
-  --pf-global--Color--100: #fff;
+  --pf-global--Color--100: #e0e0e0;
   --pf-global--Color--200: #aaabac;
   --pf-global--BorderColor--100: #444548;
   --pf-global--primary-color--100: #1fa7f8;