From 2dd3e9c5bfa4c3813eb9e4c664c7e2449e3abfeb Mon Sep 17 00:00:00 2001
From: Ryan Keairns <rkeairns@chef.io>
Date: Wed, 13 Feb 2019 10:38:48 -0600
Subject: [PATCH] [Canvas] K7 design related fixes (#30833)

* K7 design related fixes

* remove compressed from table for consistency

* remove fullscreen styles related to K6 nav elements
---
 .../public/apps/workpad/workpad_app/workpad_app.scss |  4 ++++
 .../public/components/asset_manager/asset_manager.js |  4 +---
 .../public/components/fullscreen/fullscreen.scss     | 12 +++---------
 .../components/refresh_control/refresh_control.js    |  2 +-
 .../public/components/router/canvas_loading.js       |  8 ++------
 .../public/components/sidebar/sidebar_component.js   |  2 +-
 .../components/workpad_loader/workpad_loader.js      |  1 -
 7 files changed, 12 insertions(+), 21 deletions(-)

diff --git a/x-pack/plugins/canvas/public/apps/workpad/workpad_app/workpad_app.scss b/x-pack/plugins/canvas/public/apps/workpad/workpad_app/workpad_app.scss
index a7b01436ffed9..a27b18c5b4c57 100644
--- a/x-pack/plugins/canvas/public/apps/workpad/workpad_app/workpad_app.scss
+++ b/x-pack/plugins/canvas/public/apps/workpad/workpad_app/workpad_app.scss
@@ -1,3 +1,5 @@
+$canvasLayoutFontSize: $euiFontSizeS;
+
 .canvasLayout {
   display: flex;
   background: $euiPageBackgroundColor;
@@ -29,6 +31,7 @@
   flex-grow: 0;
   flex-basis: auto;
   padding: $euiSizeM $euiSize $euiSizeS $euiSize;
+  font-size: $canvasLayoutFontSize;
 }
 
 .canvasLayout__stageContent {
@@ -69,4 +72,5 @@
   width: 100%;
   background-color: $euiPageBackgroundColor;
   z-index: $euiZNavigation;
+  font-size: $canvasLayoutFontSize;
 }
diff --git a/x-pack/plugins/canvas/public/components/asset_manager/asset_manager.js b/x-pack/plugins/canvas/public/components/asset_manager/asset_manager.js
index f10691b0ca021..bbde11f8aedac 100644
--- a/x-pack/plugins/canvas/public/components/asset_manager/asset_manager.js
+++ b/x-pack/plugins/canvas/public/components/asset_manager/asset_manager.js
@@ -241,9 +241,7 @@ export class AssetManager extends React.PureComponent {
 
     return (
       <Fragment>
-        <EuiButtonEmpty size="s" onClick={this.showModal}>
-          Manage assets
-        </EuiButtonEmpty>
+        <EuiButtonEmpty onClick={this.showModal}>Manage assets</EuiButtonEmpty>
 
         {assetModal}
 
diff --git a/x-pack/plugins/canvas/public/components/fullscreen/fullscreen.scss b/x-pack/plugins/canvas/public/components/fullscreen/fullscreen.scss
index 9acace1498ba3..d3fd182e06c0b 100644
--- a/x-pack/plugins/canvas/public/components/fullscreen/fullscreen.scss
+++ b/x-pack/plugins/canvas/public/components/fullscreen/fullscreen.scss
@@ -1,8 +1,8 @@
 body.canvas-isFullscreen {
-  // this is a hack that overwrites Kibana's core chrome
-  .kbnGlobalNav.kbnGlobalNav-isOpen + .app-wrapper,
-  .app-wrapper {
+  // remove space for global nav elements
+  .header-global-wrapper + .app-wrapper {
     left: 0;
+    top: 0;
   }
 
   // set the background color
@@ -11,7 +11,6 @@ body.canvas-isFullscreen {
   }
 
   // hide all the interface parts
-  nav.kbnGlobalNav, // K6 global side nav
   .header-global-wrapper, // K7 global top nav
   .canvasLayout__stageHeader,
   .canvasLayout__sidebar,
@@ -20,11 +19,6 @@ body.canvas-isFullscreen {
     display: none;
   }
 
-  // remove space for K7 global top nav
-  .header-global-wrapper + .app-wrapper {
-    top: 0;
-  }
-
   .canvasLayout__stageContentOverflow {
     display: block; // fixes center alignment for Safari
     overflow: visible;
diff --git a/x-pack/plugins/canvas/public/components/refresh_control/refresh_control.js b/x-pack/plugins/canvas/public/components/refresh_control/refresh_control.js
index d3a22542a5767..89c0f84c130f8 100644
--- a/x-pack/plugins/canvas/public/components/refresh_control/refresh_control.js
+++ b/x-pack/plugins/canvas/public/components/refresh_control/refresh_control.js
@@ -40,7 +40,7 @@ export const RefreshControl = ({ inFlight, setRefreshInterval, refreshInterval,
   const setRefresh = val => setRefreshInterval(getRefreshInterval(val));
 
   const popoverButton = handleClick => (
-    <EuiButtonEmpty size="s" onClick={handleClick}>
+    <EuiButtonEmpty onClick={handleClick}>
       <div style={{ display: 'flex', alignItems: 'center' }}>
         {inFlight && (
           <Fragment>
diff --git a/x-pack/plugins/canvas/public/components/router/canvas_loading.js b/x-pack/plugins/canvas/public/components/router/canvas_loading.js
index 8e6e1fdb4376f..cd85c75dea38a 100644
--- a/x-pack/plugins/canvas/public/components/router/canvas_loading.js
+++ b/x-pack/plugins/canvas/public/components/router/canvas_loading.js
@@ -13,12 +13,8 @@ export const CanvasLoading = ({ msg }) => (
     <EuiPanel>
       <EuiLoadingChart size="m" />
       <EuiSpacer size="s" />
-      <EuiText>
-        {/*
-            For some reason a styled color is required,
-            likely something with the chrome css from Kibana
-          */}
-        <p style={{ color: '#000' }}>{msg}</p>
+      <EuiText color="default" size="s">
+        <p>{msg}</p>
       </EuiText>
     </EuiPanel>
   </div>
diff --git a/x-pack/plugins/canvas/public/components/sidebar/sidebar_component.js b/x-pack/plugins/canvas/public/components/sidebar/sidebar_component.js
index 2af995285594c..41a4943c85dc8 100644
--- a/x-pack/plugins/canvas/public/components/sidebar/sidebar_component.js
+++ b/x-pack/plugins/canvas/public/components/sidebar/sidebar_component.js
@@ -121,7 +121,7 @@ export const SidebarComponent = ({
               </EuiFlexGroup>
             </EuiFlexItem>
           </EuiFlexGroup>
-          <EuiTabbedContent tabs={tabs} initialSelectedTab={tabs[0]} />
+          <EuiTabbedContent tabs={tabs} initialSelectedTab={tabs[0]} size="s" />
         </div>
       )}
     </div>
diff --git a/x-pack/plugins/canvas/public/components/workpad_loader/workpad_loader.js b/x-pack/plugins/canvas/public/components/workpad_loader/workpad_loader.js
index bd01ec43228ce..87e546f0371aa 100644
--- a/x-pack/plugins/canvas/public/components/workpad_loader/workpad_loader.js
+++ b/x-pack/plugins/canvas/public/components/workpad_loader/workpad_loader.js
@@ -235,7 +235,6 @@ export class WorkpadLoader extends React.PureComponent {
       <Fragment>
         <WorkpadDropzone onUpload={this.onUpload} disabled={createPending || !canUserWrite}>
           <EuiBasicTable
-            compressed
             items={rows}
             itemId="id"
             columns={columns}