From 322643e7407261dede00b5514ac2721e922436f7 Mon Sep 17 00:00:00 2001
From: Annabel Dunstone Gray <annabel.dunstone@gmail.com>
Date: Mon, 18 Dec 2017 14:16:54 -0700
Subject: [PATCH] Hide toolbar in markdown preview mode

---
 .../vue_shared/components/markdown/header.vue |  3 ++-
 .../stylesheets/framework/markdown_area.scss  | 26 ++++++++++++-------
 .../concerns/with_performance_bar.rb          |  2 +-
 .../40063-markdown-editor-improvements.yml    |  5 ++++
 4 files changed, 25 insertions(+), 11 deletions(-)
 create mode 100644 changelogs/unreleased/40063-markdown-editor-improvements.yml

diff --git a/app/assets/javascripts/vue_shared/components/markdown/header.vue b/app/assets/javascripts/vue_shared/components/markdown/header.vue
index 6c575d8eb49..55aaab77b7a 100644
--- a/app/assets/javascripts/vue_shared/components/markdown/header.vue
+++ b/app/assets/javascripts/vue_shared/components/markdown/header.vue
@@ -72,7 +72,8 @@
           Preview
         </a>
       </li>
-      <li class="md-header-toolbar">
+      <li class="md-header-toolbar"
+        :class="{ active: !previewMarkdown }">
         <toolbar-button
           tag="**"
           button-title="Add bold text"
diff --git a/app/assets/stylesheets/framework/markdown_area.scss b/app/assets/stylesheets/framework/markdown_area.scss
index 5389eb0a5f2..2dfaa0892b3 100644
--- a/app/assets/stylesheets/framework/markdown_area.scss
+++ b/app/assets/stylesheets/framework/markdown_area.scss
@@ -82,19 +82,27 @@
   }
 }
 
-.md-header-toolbar {
-  margin-left: auto;
+.nav-links {
+  li.md-header-toolbar {
+    margin-left: auto;
+    display: none;
 
-  @media(max-width: $screen-xs-max) {
-    flex: none;
-    display: flex;
-    justify-content: center;
-    width: 100%;
-    padding-top: $gl-padding-top;
-    padding-bottom: $gl-padding-top;
+    &.active {
+      display: block;
+    }
+
+    @media(max-width: $screen-xs-max) {
+      flex: none;
+      display: flex;
+      justify-content: center;
+      width: 100%;
+      padding-top: $gl-padding-top;
+      padding-bottom: $gl-padding-top;
+    }
   }
 }
 
+
 .referenced-users {
   color: $gl-text-color;
   padding-top: 10px;
diff --git a/app/controllers/concerns/with_performance_bar.rb b/app/controllers/concerns/with_performance_bar.rb
index 230bbe4b1aa..a1848286b2b 100644
--- a/app/controllers/concerns/with_performance_bar.rb
+++ b/app/controllers/concerns/with_performance_bar.rb
@@ -6,7 +6,7 @@ module WithPerformanceBar
   end
 
   def peek_enabled?
-    return true if Rails.env.development?
+    # return true if Rails.env.development?
     return false unless Gitlab::PerformanceBar.enabled?(current_user)
 
     if RequestStore.active?
diff --git a/changelogs/unreleased/40063-markdown-editor-improvements.yml b/changelogs/unreleased/40063-markdown-editor-improvements.yml
new file mode 100644
index 00000000000..fa2f09408b4
--- /dev/null
+++ b/changelogs/unreleased/40063-markdown-editor-improvements.yml
@@ -0,0 +1,5 @@
+---
+title: Hide markdown toolbar in preview mode
+merge_request:
+author:
+type: changed