details and table heading styles

priley86 · Jun 3, 2019 · 00f2ea7 · 00f2ea7
1 parent 18a8d8d
commit 00f2ea7
Show file tree

Hide file tree

Showing 8 changed files with 20 additions and 14 deletions.
diff --git a/frontend/integration-tests/protractor.conf.ts b/frontend/integration-tests/protractor.conf.ts
@@ -36,7 +36,7 @@ export const config: Config = {
     chromeOptions: {
       args: [
         '--disable-gpu',
-        // '--headless',
+        '--headless',
         '--no-sandbox',
         '--window-size=1920,1200',
         '--disable-background-timer-throttling',

diff --git a/frontend/public/components/network-policy.jsx b/frontend/public/components/network-policy.jsx
@@ -99,9 +99,9 @@ export const NetworkPoliciesPage = props => <ListPage {...props} ListComponent={
 
 
 const IngressHeader = () => <div className="row co-m-table-grid__head">
-  <div className="col-xs-4">target pods</div>
-  <div className="col-xs-5">from</div>
-  <div className="col-xs-3">to ports</div>
+  <div className="col-xs-4">Target Pods</div>
+  <div className="col-xs-5">From</div>
+  <div className="col-xs-3">To Ports</div>
 </div>;
 
 const IngressRow = ({ingress, namespace, podSelector}) => {

diff --git a/frontend/public/style.scss b/frontend/public/style.scss
@@ -1,5 +1,7 @@
 // Config
 @import '~patternfly/dist/sass/patternfly/color-variables';
+@import '~@patternfly/patternfly/sass-utilities/all';
+@import "~@patternfly/patternfly/_variables";
 @import "style/vars";
 
 // External dependency variables or mixins that are required/extended by our custom styles (tilde tells Webpack not to use relative path)

diff --git a/frontend/public/style/_base.scss b/frontend/public/style/_base.scss
@@ -8,11 +8,11 @@ ol {
 dl {
   margin: 0px; }
 
+// match pf4 styling / table col head styling
 dt {
-  text-transform: uppercase;
   font-weight: 400;
   color: $color-text-secondary;
-  font-size: ($font-size-base - 1); }
+  font-size: $font-size-base; }
 
 dd {
   margin-bottom: 20px; }

diff --git a/frontend/public/style/_common.scss b/frontend/public/style/_common.scss
@@ -154,6 +154,7 @@
   table {
     thead {
       th {
+        font-size: $font-size-base;
         color: $color-text-secondary;
         font-weight: 400;
       }
@@ -478,9 +479,8 @@
   }
   &__head {
     color: $color-text-secondary;
-    font-size: ($font-size-base - 1);
+    font-size: $font-size-base;
     padding: 0 20px 10px 0; // right padding to maintain alignment with __body .row
-    text-transform: uppercase;
     a {
       cursor: pointer;
     }

diff --git a/frontend/public/style/_overrides.scss b/frontend/public/style/_overrides.scss
@@ -203,7 +203,8 @@ tags-input .autocomplete .suggestion-item em {
   }
   th {
     padding-top: 0 !important;
-    text-transform: uppercase;
+    color: $color-text-secondary;
+    font-weight: 400;
   }
   thead > tr > th {
     border-bottom: 0;

diff --git a/frontend/public/style/_vars.scss b/frontend/public/style/_vars.scss
@@ -55,7 +55,7 @@ $color-rbac-role-dark: $color-pf-orange-600;
 $color-secret-dark: $color-pf-orange-400;
 $color-service-dark: $color-pf-light-green-500;
 $color-text-muted: $color-pf-black-600;
-$color-text-secondary: $color-pf-black-600;
+$color-text-secondary: $pf-global--Color--200;
 // -- Depend on color vars defined above
 $color-alert-dark: $color-container-dark;
 $color-alertrule-dark: $color-configmap-dark;

diff --git a/frontend/public/vendor.scss b/frontend/public/vendor.scss
@@ -1,5 +1,7 @@
 // Config
 @import '~patternfly/dist/sass/patternfly/color-variables';
+@import '~@patternfly/patternfly/sass-utilities/all';
+@import "~@patternfly/patternfly/_variables";
 @import "style/vars";
 
 // External dependencies (tilde tells Webpack not to use relative path). Seperate SCSS entrypoint here because some modules break sourcemaps.
@@ -57,9 +59,10 @@
 @import '~patternfly-react-extensions/dist/sass/filter-side-panel';
 @import '~patternfly-react-extensions/dist/sass/properties-side-panel';
 @import '~patternfly-react-extensions/dist/sass/vertical-tabs';
-@import '~@patternfly/patternfly/sass-utilities/all';
-@import '~@patternfly/patternfly/utilities/Display/display';
-@import '~@patternfly/patternfly/utilities/Flex/flex';
-@import "~@patternfly/patternfly/_variables";
+
+// Note: PF Sass load order is important and can cause issues if changed
 @import "~@patternfly/patternfly/_fonts";
 @import "~@patternfly/patternfly/_base";
+@import '~@patternfly/patternfly/layouts/Flex/flex';
+@import '~@patternfly/patternfly/utilities/Display/display';
+@import '~@patternfly/patternfly/utilities/Flex/flex';