Move constrained max-width into a variable.

elastic · May 1, 2018 · 4a30b31 · 4a30b31
1 parent 1ed4be0
commit 4a30b31
Show file tree

Hide file tree

Showing 6 changed files with 9 additions and 11 deletions.
diff --git a/src-docs/src/views/empty_prompt/custom.js b/src-docs/src/views/empty_prompt/custom.js
@@ -7,7 +7,7 @@ import {
 
 export default () => (
   <EuiEmptyPrompt
-    iconType="editorStrike"
+    iconType="dataVisualizer"
     iconColor={null}
     iconSize="xs"
     title={<h2>You have no spice</h2>}

diff --git a/src/components/empty_prompt/_empty_prompt.scss b/src/components/empty_prompt/_empty_prompt.scss
@@ -1,7 +1,7 @@
-@import '../text/_mixins';
+@import '../text/_variables';
 
 .euiEmptyPrompt {
-  @include euiTextConstrainedWidth;
+  max-width: $euiTextConstrainedMaxWidth;
   text-align: center;
   padding: $euiSizeL;
   margin: auto;

diff --git a/src/components/text/_index.scss b/src/components/text/_index.scss
@@ -1,4 +1,4 @@
-@import 'mixins';
+@import 'variables';
 @import 'text';
 @import 'text_color';
 @import 'text_align';
diff --git a/src/components/text/_mixins.scss b/src/components/text/_mixins.scss
diff --git a/src/components/text/_text.scss b/src/components/text/_text.scss
@@ -193,7 +193,10 @@
   @include euiScaleText($euiFontSize);
 
   &.euiText--constrainedWidth {
-    @include euiTextConstrainedWidth;
+    max-width: $euiTextConstrainedMaxWidth;
+    // If the max-width is way too short of the width of the container,
+    // at least make it 2/3 of it's parent
+    min-width: 75%;
   }
 
   &.euiText--small {

diff --git a/src/components/text/_variables.scss b/src/components/text/_variables.scss
@@ -0,0 +1 @@
+$euiTextConstrainedMaxWidth: 36em;