adjust table spacings and kebab font size

openshift · Apr 24, 2019 · e2369ac · e2369ac
1 parent 1e27b7b
commit e2369ac
Show file tree

Hide file tree

Showing 3 changed files with 26 additions and 6 deletions.
diff --git a/frontend/public/components/deployment.jsx b/frontend/public/components/deployment.jsx
@@ -152,9 +152,7 @@ const DeploymentTableRow = (o, index) => {
       title: <Selector selector={o.spec.selector} namespace={o.metadata.namespace} />,
     },
     {
-      title: <div className="dropdown-kebab-pf">
-        <ResourceKebab actions={menuActions} kind={kind} resource={o} />
-      </div>,
+      title: <ResourceKebab actions={menuActions} kind={kind} resource={o} />,
       props: { className: 'pf-c-table__action'},
     },
   ]
@@ -180,8 +178,8 @@ const DeploymentTableHeader = props => {
 const DeploymentsList = props => <React.Fragment>
   <Table {...props} aria-label="Deployments" Header={DeploymentTableHeader} Rows={DeploymentTableRows} virtualize />
   {/* <br />
-  <br />
-  <List {...props} Header={WorkloadListHeader} Row={Row} /> */}
+  <br /> */}
+  {/* <List {...props} Header={WorkloadListHeader} Row={Row} virtualize /> */}
 </React.Fragment>;
 
 const DeploymentsPage = props => <ListPage canCreate={true} ListComponent={DeploymentsList} {...props} />;

diff --git a/frontend/public/style/_overrides.scss b/frontend/public/style/_overrides.scss
@@ -476,4 +476,26 @@ tags-input .autocomplete .suggestion-item em {
   .pf-c-table .meta-status {
     min-width: 100px;
   }
+}
+
+// pf4 table spacings adjusted to match existing styles
+.pf-c-table tr > * {
+  --pf-c-table-cell--PaddingLeft: 16px;
+  --pf-c-table-cell--PaddingRight: 16px;
+  --pf-c-table--m-compact-cell--first-last-child--PaddingLeft: 16px;
+  --pf-c-table--m-compact-cell--first-last-child--PaddingRight: 16px;
+}
+
+.pf-c-table.pf-m-compact .pf-c-table__action {
+  --pf-c-table__action--PaddingLeft: 16px;
+  --pf-c-table__action--PaddingRight: 16px;
+  --pf-c-table__action--PaddingTop: 8px;
+  --pf-c-table__action--PaddingBottom: 8px;
+
+  .pf-c-dropdown__toggle {
+    font-size: $font-size-base;
+  }
+  .pf-c-dropdown__menu-item {
+    font-size: $font-size-base;
+  }
 }
diff --git a/frontend/yarn.lock b/frontend/yarn.lock
@@ -207,7 +207,7 @@
 
 "@patternfly/react-virtualized-extension@git+https://git@github.com/priley86/react-virtualized-extension.git":
   version "2.1.0"
-  resolved "git+https://git@github.com/priley86/react-virtualized-extension.git#f7c06d5333f0f6a1ff3c6c5664afa7f5d1f28b35"
+  resolved "git+https://git@github.com/priley86/react-virtualized-extension.git#e40440d2bd6ebbf0f3d0210074f9d50c64127344"
   dependencies:
     "@patternfly/patternfly" "2.4.1"
     "@patternfly/react-icons" "^3.7.3"