Merge branch 'dagjaneiro-split-same-size'

Author: moughxyz

app/stylesheets/main.scss

@@ -1,7 +1,7 @@
 @import '~highlightjs_css';
 
 body, html {
-  font-family: sans-serif;
+  font-family: var(--sn-stylekit-sans-serif-font);
   height: 100%;
   width: 100%;
   margin: 0;
@@ -27,6 +27,10 @@ body, html {
 
   background-color: var(--sn-stylekit-editor-background-color);
   color: var(--sn-stylekit-editor-foreground-color);
+
+  .sk-label {
+    width: 48px;
+  }
 }
 
 #editor-container {
@@ -41,13 +45,14 @@ body, html {
   color: var(--sn-stylekit-editor-foreground-color);
   font-size: var(--sn-stylekit-font-size-editor);
   -webkit-overflow-scrolling: touch;
+  font-family: var(--sn-stylekit-sans-serif-font);
 
   &.edit {
     width: 100% !important;
   }
 
   &.split {
-    width: calc(50% - 20px);
+    width: calc(50% - 4px);
   }
 
   &.preview {
@@ -78,9 +83,13 @@ body, html {
 }
 
 #preview {
-  padding: 10px;
+  padding: 12px;
   padding-top: 0;
-  padding-left: 16px;
+  font-family: var(--sn-stylekit-sans-serif-font);
+
+  // To align top with textarea.
+  margin-top: -4px;
+
   -webkit-overflow-scrolling: touch;
 
   background-color: var(--sn-stylekit-background-color);
@@ -93,7 +102,7 @@ body, html {
   }
 
   &.split {
-    width: calc(50% - 20px);
+    width: calc(50% - 4px);
   }
 
   &.preview {