From e1418301fcead7fee064622e3a7c693aab5888f0 Mon Sep 17 00:00:00 2001
From: seaerchin <44049504+seaerchin@users.noreply.github.com>
Date: Tue, 14 Nov 2023 14:57:43 +0800
Subject: [PATCH] fix(markdown): update styling to remove overflow (#1671)

* fix(template): u9pdate styling for editor

* refactor(editor): update styling to own file
---
 src/components/pages/MarkdownEditor.jsx        | 2 ++
 src/components/pages/editor.scss               | 5 +++++
 src/styles/isomer-cms/pages/Editor.module.scss | 1 +
 src/styles/isomer-template.scss                | 7 +------
 4 files changed, 9 insertions(+), 6 deletions(-)
 create mode 100644 src/components/pages/editor.scss

diff --git a/src/components/pages/MarkdownEditor.jsx b/src/components/pages/MarkdownEditor.jsx
index 629aa6c1d..38dd11c53 100644
--- a/src/components/pages/MarkdownEditor.jsx
+++ b/src/components/pages/MarkdownEditor.jsx
@@ -7,6 +7,7 @@ import EditorModals from "components/pages/EditorModals"
 import { useMarkdown } from "hooks/useMarkdown"
 
 import editorStyles from "styles/isomer-cms/pages/Editor.module.scss"
+import "./editor.scss"
 
 import {
   boldButton,
@@ -137,6 +138,7 @@ const MarkdownEditor = ({ siteName, onChange, value, isLoading }) => {
       >
         <StatusIcon />
         <SimpleMDE
+          className={editorStyles.cm}
           id="simplemde-editor"
           onChange={onChange}
           value={value}
diff --git a/src/components/pages/editor.scss b/src/components/pages/editor.scss
new file mode 100644
index 000000000..c945daf7a
--- /dev/null
+++ b/src/components/pages/editor.scss
@@ -0,0 +1,5 @@
+.CodeMirror {
+  height: calc(100% - 6rem) !important;
+
+  overflow-y: scroll;
+}
diff --git a/src/styles/isomer-cms/pages/Editor.module.scss b/src/styles/isomer-cms/pages/Editor.module.scss
index ce39f3082..731ebf65e 100644
--- a/src/styles/isomer-cms/pages/Editor.module.scss
+++ b/src/styles/isomer-cms/pages/Editor.module.scss
@@ -130,6 +130,7 @@
   box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.2);
   box-sizing: border-box;
   position: relative;
+  height: calc(100vh - #{$header-height} - #{$footer-height} - 1rem);
 }
 
 .pageEditorSidebarLoading {
diff --git a/src/styles/isomer-template.scss b/src/styles/isomer-template.scss
index 827df8503..3c7c514a5 100644
--- a/src/styles/isomer-template.scss
+++ b/src/styles/isomer-template.scss
@@ -12654,7 +12654,7 @@ html.has-navbar-fixed-top-widescreen {
 }
 
 .remove-after:after {
-  content: "" !important
+  content: "" !important;
 }
 
 .bg-primary {
@@ -13073,11 +13073,6 @@ a.navbar-item {
   max-width: 100%;
 }
 
-.CodeMirror {
-  height: 100% !important;
-  overflow-y: scroll;
-}
-
 .page-header-container {
   padding-left: 3.125rem;
   margin: 0 0 !important;