diff --git a/x-pack/legacy/plugins/canvas/canvas_plugin_src/uis/arguments/axis_config/__examples__/__snapshots__/extended_template.examples.storyshot b/x-pack/legacy/plugins/canvas/canvas_plugin_src/uis/arguments/axis_config/__examples__/__snapshots__/extended_template.examples.storyshot
index 5efbbe01065054b..167c1f21ee4e229 100644
--- a/x-pack/legacy/plugins/canvas/canvas_plugin_src/uis/arguments/axis_config/__examples__/__snapshots__/extended_template.examples.storyshot
+++ b/x-pack/legacy/plugins/canvas/canvas_plugin_src/uis/arguments/axis_config/__examples__/__snapshots__/extended_template.examples.storyshot
@@ -11,7 +11,7 @@ exports[`Storyshots arguments/AxisConfig extended 1`] = `
   }
 >
   <div
-    className="euiFormRow euiFormRow--compressed"
+    className="euiFormRow euiFormRow--compressed euiFormRow--horizontal"
   >
     <div
       className="euiFormRow__labelWrapper"
@@ -91,7 +91,7 @@ exports[`Storyshots arguments/AxisConfig/components extended 1`] = `
   }
 >
   <div
-    className="euiFormRow euiFormRow--compressed"
+    className="euiFormRow euiFormRow--compressed euiFormRow--horizontal"
   >
     <div
       className="euiFormRow__labelWrapper"
@@ -171,12 +171,14 @@ exports[`Storyshots arguments/AxisConfig/components extended disabled 1`] = `
   }
 >
   <div
-    className="euiText euiText--medium"
+    className="euiText euiText--extraSmall"
   >
     <div
       className="euiTextColor euiTextColor--subdued"
     >
-      The axis is disabled
+      <p>
+        Swtich on to view axis settings
+      </p>
     </div>
   </div>
 </div>
diff --git a/x-pack/legacy/plugins/canvas/public/components/shape_picker_popover/__examples__/__snapshots__/shape_picker_popover.examples.storyshot b/x-pack/legacy/plugins/canvas/public/components/shape_picker_popover/__examples__/__snapshots__/shape_picker_popover.examples.storyshot
index 426c07dac497ec2..a23452a43ae1e48 100644
--- a/x-pack/legacy/plugins/canvas/public/components/shape_picker_popover/__examples__/__snapshots__/shape_picker_popover.examples.storyshot
+++ b/x-pack/legacy/plugins/canvas/public/components/shape_picker_popover/__examples__/__snapshots__/shape_picker_popover.examples.storyshot
@@ -13,20 +13,24 @@ exports[`Storyshots components/Shapes/ShapePickerPopover default 1`] = `
   <div
     className="euiPopover__anchor"
   >
-    <button
-      className="euiLink euiLink--primary"
-      onClick={[Function]}
-      style={
-        Object {
-          "fontSize": 0,
-        }
-      }
-      type="button"
+    <div
+      className="euiPanel euiPanel--paddingSmall"
     >
-      <div
-        className="canvasShapePreview"
-      />
-    </button>
+      <button
+        className="euiLink euiLink--primary"
+        onClick={[Function]}
+        style={
+          Object {
+            "fontSize": 0,
+          }
+        }
+        type="button"
+      >
+        <div
+          className="canvasShapePreview"
+        />
+      </button>
+    </div>
   </div>
 </div>
 `;
@@ -44,27 +48,31 @@ exports[`Storyshots components/Shapes/ShapePickerPopover interactive 1`] = `
   <div
     className="euiPopover__anchor"
   >
-    <button
-      className="euiLink euiLink--primary"
-      onClick={[Function]}
-      style={
-        Object {
-          "fontSize": 0,
-        }
-      }
-      type="button"
+    <div
+      className="euiPanel euiPanel--paddingSmall"
     >
-      <div
-        className="canvasShapePreview"
-        dangerouslySetInnerHTML={
+      <button
+        className="euiLink euiLink--primary"
+        onClick={[Function]}
+        style={
           Object {
-            "__html": "<svg xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"-2.5 -2.5 105 105\\" fill=\\"none\\" stroke=\\"black\\">
+            "fontSize": 0,
+          }
+        }
+        type="button"
+      >
+        <div
+          className="canvasShapePreview"
+          dangerouslySetInnerHTML={
+            Object {
+              "__html": "<svg xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"-2.5 -2.5 105 105\\" fill=\\"none\\" stroke=\\"black\\">
       <rect x=\\"0\\" y=\\"0\\" width=\\"100\\" height=\\"100\\"></rect>
     </svg>",
+            }
           }
-        }
-      />
-    </button>
+        />
+      </button>
+    </div>
   </div>
 </div>
 `;
@@ -82,27 +90,31 @@ exports[`Storyshots components/Shapes/ShapePickerPopover shape selected 1`] = `
   <div
     className="euiPopover__anchor"
   >
-    <button
-      className="euiLink euiLink--primary"
-      onClick={[Function]}
-      style={
-        Object {
-          "fontSize": 0,
-        }
-      }
-      type="button"
+    <div
+      className="euiPanel euiPanel--paddingSmall"
     >
-      <div
-        className="canvasShapePreview"
-        dangerouslySetInnerHTML={
+      <button
+        className="euiLink euiLink--primary"
+        onClick={[Function]}
+        style={
           Object {
-            "__html": "<svg xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"-2.5 -2.5 105 105\\" fill=\\"none\\" stroke=\\"black\\">
+            "fontSize": 0,
+          }
+        }
+        type="button"
+      >
+        <div
+          className="canvasShapePreview"
+          dangerouslySetInnerHTML={
+            Object {
+              "__html": "<svg xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"-2.5 -2.5 105 105\\" fill=\\"none\\" stroke=\\"black\\">
       <rect x=\\"0\\" y=\\"0\\" width=\\"100\\" height=\\"100\\"></rect>
     </svg>",
+            }
           }
-        }
-      />
-    </button>
+        />
+      </button>
+    </div>
   </div>
 </div>
 `;
diff --git a/x-pack/legacy/plugins/canvas/public/expression_types/arg_types/series_style/__examples__/__snapshots__/extended_template.examples.storyshot b/x-pack/legacy/plugins/canvas/public/expression_types/arg_types/series_style/__examples__/__snapshots__/extended_template.examples.storyshot
index 5525df639be016f..ffe87129c76fae6 100644
--- a/x-pack/legacy/plugins/canvas/public/expression_types/arg_types/series_style/__examples__/__snapshots__/extended_template.examples.storyshot
+++ b/x-pack/legacy/plugins/canvas/public/expression_types/arg_types/series_style/__examples__/__snapshots__/extended_template.examples.storyshot
@@ -12,7 +12,7 @@ exports[`Storyshots arguments/SeriesStyle extended 1`] = `
 >
   <div>
     <div
-      className="euiFormRow euiFormRow--compressed"
+      className="euiFormRow euiFormRow--compressed euiFormRow--horizontal"
     >
       <div
         className="euiFormRow__labelWrapper"
@@ -21,7 +21,7 @@ exports[`Storyshots arguments/SeriesStyle extended 1`] = `
           className="euiFormLabel euiFormRow__label"
           htmlFor="generated-id"
         >
-          Series Identifier
+          Series id
         </label>
       </div>
       <div
@@ -45,7 +45,7 @@ exports[`Storyshots arguments/SeriesStyle extended 1`] = `
               <option
                 value=""
               >
-                Select Series
+                Select series
               </option>
               <option
                 value="label1"
diff --git a/x-pack/legacy/plugins/canvas/public/expression_types/arg_types/series_style/__examples__/__snapshots__/simple_template.examples.storyshot b/x-pack/legacy/plugins/canvas/public/expression_types/arg_types/series_style/__examples__/__snapshots__/simple_template.examples.storyshot
index 6a27d784ef069af..c843a62702b164a 100644
--- a/x-pack/legacy/plugins/canvas/public/expression_types/arg_types/series_style/__examples__/__snapshots__/simple_template.examples.storyshot
+++ b/x-pack/legacy/plugins/canvas/public/expression_types/arg_types/series_style/__examples__/__snapshots__/simple_template.examples.storyshot
@@ -11,23 +11,22 @@ exports[`Storyshots arguments/SeriesStyle simple 1`] = `
   }
 >
   <div
-    className="euiFlexGroup euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive canvasArgSeries__colorPicker"
+    className="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive canvasArgSeries__colorPicker"
   >
     <div
       className="euiFlexItem euiFlexItem--flexGrowZero"
     >
       <div
-        className="euiText euiText--small"
+        className="euiText euiText--extraSmall"
       >
         Color
-         
       </div>
     </div>
     <div
       className="euiFlexItem euiFlexItem--flexGrowZero"
     >
       <div
-        className="euiText euiText--small"
+        className="euiText euiText--extraSmall"
       >
         <button
           aria-label="Color: Auto"
@@ -35,16 +34,7 @@ exports[`Storyshots arguments/SeriesStyle simple 1`] = `
           onClick={[Function]}
           type="button"
         >
-          Auto 
-          <svg
-            className="euiIcon euiIcon--medium euiIcon-isLoading"
-            focusable="false"
-            height={16}
-            style={null}
-            viewBox="0 0 16 16"
-            width={16}
-            xmlns="http://www.w3.org/2000/svg"
-          />
+          Auto
         </button>
       </div>
     </div>
@@ -63,23 +53,22 @@ exports[`Storyshots arguments/SeriesStyle/components simple: defaults 1`] = `
   }
 >
   <div
-    className="euiFlexGroup euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive canvasArgSeries__colorPicker"
+    className="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive canvasArgSeries__colorPicker"
   >
     <div
       className="euiFlexItem euiFlexItem--flexGrowZero"
     >
       <div
-        className="euiText euiText--small"
+        className="euiText euiText--extraSmall"
       >
         Color
-         
       </div>
     </div>
     <div
       className="euiFlexItem euiFlexItem--flexGrowZero"
     >
       <div
-        className="euiText euiText--small"
+        className="euiText euiText--extraSmall"
       >
         <button
           aria-label="Color: Auto"
@@ -87,16 +76,7 @@ exports[`Storyshots arguments/SeriesStyle/components simple: defaults 1`] = `
           onClick={[Function]}
           type="button"
         >
-          Auto 
-          <svg
-            className="euiIcon euiIcon--medium euiIcon-isLoading"
-            focusable="false"
-            height={16}
-            style={null}
-            viewBox="0 0 16 16"
-            width={16}
-            xmlns="http://www.w3.org/2000/svg"
-          />
+          Auto
         </button>
       </div>
     </div>
@@ -115,23 +95,22 @@ exports[`Storyshots arguments/SeriesStyle/components simple: no labels 1`] = `
   }
 >
   <div
-    className="euiFlexGroup euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive canvasArgSeries__colorPicker"
+    className="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive canvasArgSeries__colorPicker"
   >
     <div
       className="euiFlexItem euiFlexItem--flexGrowZero"
     >
       <div
-        className="euiText euiText--small"
+        className="euiText euiText--extraSmall"
       >
         Color
-         
       </div>
     </div>
     <div
       className="euiFlexItem euiFlexItem--flexGrowZero"
     >
       <div
-        className="euiText euiText--small"
+        className="euiText euiText--extraSmall"
       >
         <button
           aria-label="Color: Auto"
@@ -139,16 +118,7 @@ exports[`Storyshots arguments/SeriesStyle/components simple: no labels 1`] = `
           onClick={[Function]}
           type="button"
         >
-          Auto 
-          <svg
-            className="euiIcon euiIcon--medium euiIcon-isLoading"
-            focusable="false"
-            height={16}
-            style={null}
-            viewBox="0 0 16 16"
-            width={16}
-            xmlns="http://www.w3.org/2000/svg"
-          />
+          Auto
         </button>
       </div>
     </div>
@@ -167,23 +137,22 @@ exports[`Storyshots arguments/SeriesStyle/components simple: no series 1`] = `
   }
 >
   <div
-    className="euiFlexGroup euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive canvasArgSeries__colorPicker"
+    className="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive canvasArgSeries__colorPicker"
   >
     <div
       className="euiFlexItem euiFlexItem--flexGrowZero"
     >
       <div
-        className="euiText euiText--small"
+        className="euiText euiText--extraSmall"
       >
         Color
-         
       </div>
     </div>
     <div
       className="euiFlexItem euiFlexItem--flexGrowZero"
     >
       <div
-        className="euiText euiText--small"
+        className="euiText euiText--extraSmall"
       >
         <button
           aria-label="Color: Auto"
@@ -191,16 +160,7 @@ exports[`Storyshots arguments/SeriesStyle/components simple: no series 1`] = `
           onClick={[Function]}
           type="button"
         >
-          Auto 
-          <svg
-            className="euiIcon euiIcon--medium euiIcon-isLoading"
-            focusable="false"
-            height={16}
-            style={null}
-            viewBox="0 0 16 16"
-            width={16}
-            xmlns="http://www.w3.org/2000/svg"
-          />
+          Auto
         </button>
       </div>
     </div>
@@ -242,23 +202,22 @@ exports[`Storyshots arguments/SeriesStyle/components simple: with series 1`] = `
   }
 >
   <div
-    className="euiFlexGroup euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive canvasArgSeries__colorPicker"
+    className="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive canvasArgSeries__colorPicker"
   >
     <div
       className="euiFlexItem euiFlexItem--flexGrowZero"
     >
       <div
-        className="euiText euiText--small"
+        className="euiText euiText--extraSmall"
       >
         Color
-         
       </div>
     </div>
     <div
       className="euiFlexItem euiFlexItem--flexGrowZero"
     >
       <div
-        className="euiText euiText--small"
+        className="euiText euiText--extraSmall"
       >
         <button
           aria-label="Color: Auto"
@@ -266,16 +225,7 @@ exports[`Storyshots arguments/SeriesStyle/components simple: with series 1`] = `
           onClick={[Function]}
           type="button"
         >
-          Auto 
-          <svg
-            className="euiIcon euiIcon--medium euiIcon-isLoading"
-            focusable="false"
-            height={16}
-            style={null}
-            viewBox="0 0 16 16"
-            width={16}
-            xmlns="http://www.w3.org/2000/svg"
-          />
+          Auto
         </button>
       </div>
     </div>