From 8517f99438fcf4b9aa3c391cb52358faef0a98a0 Mon Sep 17 00:00:00 2001
From: vato007 <contact@michaelpivato.dev>
Date: Thu, 18 Jul 2024 06:55:51 +0930
Subject: [PATCH] Fix overflow in editor edit component, add margin between
 review toggle and copy button

---
 src/app/editor/editor.component.html |  4 +++-
 src/app/editor/editor.component.scss | 13 +++++++++++++
 2 files changed, 16 insertions(+), 1 deletion(-)

diff --git a/src/app/editor/editor.component.html b/src/app/editor/editor.component.html
index 5e58df2..b13c18e 100644
--- a/src/app/editor/editor.component.html
+++ b/src/app/editor/editor.component.html
@@ -25,7 +25,9 @@
       <mat-button-toggle value="diff">Diff</mat-button-toggle>
       }
     </mat-button-toggle-group>
-    <button mat-flat-button (click)="copyToClipboard()">Copy</button>
+    <button mat-flat-button class="copy-button" (click)="copyToClipboard()">
+      Copy
+    </button>
   </h2>
 
   @switch (previewType()) { @case ('raw') {
diff --git a/src/app/editor/editor.component.scss b/src/app/editor/editor.component.scss
index e386a09..55e8770 100644
--- a/src/app/editor/editor.component.scss
+++ b/src/app/editor/editor.component.scss
@@ -11,6 +11,15 @@
   overflow: auto;
 }
 
+pre {
+  overflow: auto;
+}
+
+.preview {
+  display: flex;
+  flex-direction: column;
+}
+
 .editor-items {
   padding: 16px;
 }
@@ -28,3 +37,7 @@ ngx-monaco-editor,
 ngx-monaco-diff-editor {
   height: 100%;
 }
+
+.copy-button {
+  margin-left: 10px;
+}