[EuiMarkdownEditor] Fix styling for Amsterdam (#4289)

* Adding amsterdam styles for markdown editor * CL and removing outline for edge, firefox and safari. * Update src/themes/eui-amsterdam/overrides/_index.scss Co-authored-by: Caroline Horn <[email protected]> * Addressing PR review * CL Co-authored-by: Caroline Horn <[email protected]>
elastic · Nov 20, 2020 · d5f5d6f · d5f5d6f
1 parent 7cdafea
commit d5f5d6f
Show file tree

Hide file tree

Showing 6 changed files with 23 additions and 10 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -4,6 +4,10 @@
 
 - Fixed initial focus of an `EuiButtonGroup` when first item in a popover ([#4288](https://github.com/elastic/eui/pull/4288))
 
+**Theme: Amsterdam**
+
+- Fixed styles for `EuiMarkdownEditor` ([#4289](https://github.com/elastic/eui/pull/4289))
+
 ## [`30.4.1`](https://github.com/elastic/eui/tree/v30.4.1)
 
 - Exported `useDataGridColumnSelector`, `useDataGridColumnSorting`, and `useDataGridStyleSelector` hooks ([#4271](https://github.com/elastic/eui/pull/4271))

diff --git a/src/components/markdown_editor/_index.scss b/src/components/markdown_editor/_index.scss
@@ -1,4 +1,3 @@
-@import 'markdown_editor';
 @import 'markdown_editor_drop_zone';
 @import 'markdown_format';
 @import 'markdown_editor_footer';

diff --git a/src/components/markdown_editor/_markdown_editor.scss b/src/components/markdown_editor/_markdown_editor.scss
diff --git a/src/components/markdown_editor/_markdown_editor_drop_zone.scss b/src/components/markdown_editor/_markdown_editor_drop_zone.scss
@@ -1,5 +1,4 @@
 .euiMarkdownEditorDropZone {
-  @include euiFormControlDefaultShadow;
   display: flex;
   position: relative;
   flex-direction: column;

diff --git a/src/themes/eui-amsterdam/overrides/_index.scss b/src/themes/eui-amsterdam/overrides/_index.scss
@@ -12,6 +12,7 @@
 @import 'header';
 @import 'image';
 @import 'mark';
+@import 'markdown_editor';
 @import 'modal';
 @import 'overlay_mask';
 @import 'popover';

diff --git a/src/themes/eui-amsterdam/overrides/_markdown_editor.scss b/src/themes/eui-amsterdam/overrides/_markdown_editor.scss
@@ -0,0 +1,18 @@
+.euiMarkdownEditorToolbar {
+  border-radius: $euiFormControlBorderRadius $euiFormControlBorderRadius 0 0;
+}
+
+.euiMarkdownEditorTextArea {
+  &:focus {
+    outline: none;
+  }
+
+  &:focus:focus-visible {
+    outline-style: none;
+  }
+}
+
+.euiMarkdownEditorPreview,
+.euiMarkdownEditorFooter {
+  border-radius: 0 0 $euiFormControlBorderRadius $euiFormControlBorderRadius;
+}