From 0256d7a8f8aecc08bc2b36e8e95f8485c7590b0a Mon Sep 17 00:00:00 2001
From: btzr-io <btzr.io@gmail.com>
Date: Sat, 14 Oct 2017 23:40:15 -0600
Subject: [PATCH] minor update for publish layout

update markdown styles

css fixes
---
 ui/js/component/publishForm/view.jsx    |  4 +++-
 ui/scss/_vars.scss                      |  4 ++--
 ui/scss/component/_markdown-editor.scss | 27 +++++++++++++++----------
 3 files changed, 21 insertions(+), 14 deletions(-)

diff --git a/ui/js/component/publishForm/view.jsx b/ui/js/component/publishForm/view.jsx
index 8e80854be..dcaa60c42 100644
--- a/ui/js/component/publishForm/view.jsx
+++ b/ui/js/component/publishForm/view.jsx
@@ -584,9 +584,11 @@ class PublishForm extends React.PureComponent {
                       }}
                     />
                   </div>
+                  <div className="card__content">
+                    <h4>{__("Description")}</h4>
+                  </div>
                   <div className="card__content">
                     <FormRow
-                      label={__("Description")}
                       type="SimpleMDE"
                       ref="meta_description"
                       name="description"
diff --git a/ui/scss/_vars.scss b/ui/scss/_vars.scss
index 71d3e69db..ec6f5e439 100644
--- a/ui/scss/_vars.scss
+++ b/ui/scss/_vars.scss
@@ -72,7 +72,7 @@ $text-color: #000;
   /* input:hover */
   --input-hover-border-color: rgba(0, 0, 0, 0.87);
  /* input:placeholder */
-  --input-placeholder-color: var(--text-color);
+  --input-placeholder-color: rgba(0, 0, 0, 0.42);
   --input-placeholder-opacity: 1;
 
   /* Select */
@@ -88,7 +88,7 @@ $text-color: #000;
   --button-height: $spacing-vertical * 1.5;
   --button-intra-margin: $spacing-vertical;
   --button-radius: 3px;
-  
+
   /* Header */
   --header-bg: var(--color-bg);
   --header-color: #666;
diff --git a/ui/scss/component/_markdown-editor.scss b/ui/scss/component/_markdown-editor.scss
index a2b311f5b..71482487a 100644
--- a/ui/scss/component/_markdown-editor.scss
+++ b/ui/scss/component/_markdown-editor.scss
@@ -1,20 +1,23 @@
 .CodeMirror {
-    background: var(--input-active-bg) !important;
-    border: 1px solid var(--input-border-color) !important;
+    background: var(--color-bg-alt) !important;
+    border: 0 !important;
+    border-radius: 0px !important;
     color: var(--text-color) !important;
-}
-
-.CodeMirror-fullscreen {
-    background: var(--input-bg);
+    box-shadow: var(--box-shadow-layer);
 }
 
 .editor-toolbar {
-    border: 1px solid var(--input-border-color) !important;
-    border-bottom: 0 !important;
+    opacity: 1 !important;
+    border: 0 !important;
+    background: var(--color-bg-alt);
+    border-radius: 0 !important;
+    border-bottom: var(--divider) !important;
+    box-shadow: var(--box-shadow-layer);
 }
 
 .editor-toolbar i.separator {
-    border-color:  var(--input-border-color) !important;
+  border: 0 !important;
+  border-right: var(--divider) !important;
 }
 
 .editor-toolbar.fullscreen {
@@ -22,22 +25,24 @@
 }
 
 div.editor-toolbar a {
+    opacity: 0.75;
     color:  var(--text-color) !important;
 }
 
 .editor-toolbar a.active,
 .editor-toolbar a:hover {
+    opacity: 1;
     background: var(--button-bg) !important;
     border-color: transparent !important;
 }
 
 .editor-toolbar.disabled-for-preview a:not(.no-disable) {
-    background: transparent !important;
+    background:  var(--color-bg-alt) !important;
     border-color: transparent !important;
 }
 
 .editor-statusbar {
-    color: #959694;
+    color: var(--form-label-color) !important;
 }
 
 .editor-preview {