From 043dd3db0ebd81b3232fff926ab9c0819feb912b Mon Sep 17 00:00:00 2001
From: Kiran <kpinnipati@gmail.com>
Date: Wed, 26 Aug 2020 12:19:12 -0700
Subject: [PATCH 1/2] Preview UI and Editor UI fixed.

---
 src/CodeSnippetDisplay.tsx |  2 +-
 src/PreviewSnippet.tsx     |  2 +-
 style/index.css            | 13 +++++++------
 3 files changed, 9 insertions(+), 8 deletions(-)

diff --git a/src/CodeSnippetDisplay.tsx b/src/CodeSnippetDisplay.tsx
index bab96f3..e6d6ddb 100644
--- a/src/CodeSnippetDisplay.tsx
+++ b/src/CodeSnippetDisplay.tsx
@@ -409,7 +409,7 @@ export class CodeSnippetDisplay extends React.Component<
     const intID = parseInt(id, 10);
     const realTarget = document.getElementsByClassName(TITLE_CLASS)[intID];
     // distDown is the number of pixels to shift the preview down
-    let distDown: number = realTarget.getBoundingClientRect().top - 40;
+    let distDown: number = realTarget.getBoundingClientRect().top - 43;
     if (realTarget.getBoundingClientRect().top > window.screen.height / 2) {
       distDown = distDown - 66;
     }
diff --git a/src/PreviewSnippet.tsx b/src/PreviewSnippet.tsx
index 1a124b5..59d9acc 100644
--- a/src/PreviewSnippet.tsx
+++ b/src/PreviewSnippet.tsx
@@ -169,7 +169,7 @@ export class Preview<T> extends Widget {
         })
       });
     }
-    this.editor.setSize({ width: 200, height: 106 });
+    /*this.editor.setSize({ width: 150, height: 106 });*/
     if (this.isVisible) {
       this._hasRefreshedSinceAttach = true;
       this.editor.refresh();
diff --git a/style/index.css b/style/index.css
index bb5a2f8..a643b90 100644
--- a/style/index.css
+++ b/style/index.css
@@ -165,17 +165,17 @@
 
 .jp-codeSnippet-preview-content {
   background: var(--jp-layout-color1);
-  padding: 10px;
-  /* min-width: 960px; */
-  width: 200px;
-  height: 106px;
+  padding: 5px;
+  width: 180px;
+  height: fit-content;
+  max-height: 150px;
   box-sizing: border-box;
   box-shadow: var(--jp-elevation-z2);
   word-wrap: break-word;
   border-radius: var(--jp-border-radius);
   font-size: var(--jp-ui-font-size1);
   color: var(--jp-ui-font-color1);
-  margin: 10px 10px 10px 10px;
+  margin: 10px 10px 10px 0px;
 }
 
 /* Code Snippet Drag and Drop CSS */
@@ -318,7 +318,7 @@
   flex-direction: column;
   height: 100%;
   width: 98.5%;
-  padding: 12px;
+  padding-left: 12px;
 }
 
 .jp-codeSnippetInputArea-editor {
@@ -351,6 +351,7 @@
   align-self: flex-end;
   margin-top: 12px;
   margin-right: 3%;
+  margin-bottom: 12px;
 }
 
 /* code snippet create button */

From e7bd1cf0915e51c169fe95b6bdf737ef45df4f3b Mon Sep 17 00:00:00 2001
From: Kiran <kpinnipati@gmail.com>
Date: Wed, 26 Aug 2020 15:25:11 -0700
Subject: [PATCH 2/2] Re-fixed height for preview.

---
 style/index.css | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/style/index.css b/style/index.css
index a643b90..1dc0006 100644
--- a/style/index.css
+++ b/style/index.css
@@ -167,8 +167,9 @@
   background: var(--jp-layout-color1);
   padding: 5px;
   width: 180px;
-  height: fit-content;
-  max-height: 150px;
+  /*height: fit-content;
+  max-height: 150px;*/
+  height: 106px;
   box-sizing: border-box;
   box-shadow: var(--jp-elevation-z2);
   word-wrap: break-word;