Fullscreen toggle for the markdown editor

app/assets/javascripts/markdown_editor.js.coffee

@@ -12,9 +12,18 @@ App.MarkdownEditor =
         breaks: true,
         typographer: true,
       })
+
       App.MarkdownEditor.refresh_preview($(this), md)
+
       $(this).on 'change input paste keyup', ->
         App.MarkdownEditor.refresh_preview($(this), md)
         return
 
+      $(this).find('.fullscreen-toggle').on 'click', ->
+        $('.markdown-editor').toggleClass('fullscreen')
+
+        if $('.markdown-editor').hasClass('fullscreen')
+          $('.markdown-editor textarea').height($(window).height() - 100)
+        else
+          $('.markdown-editor textarea').height("10em")
 

app/assets/stylesheets/admin.scss

@@ -394,3 +394,34 @@ table.investment-projects-summary {
     white-space: nowrap;
   }
 }
+
+
+// Markdown Editor
+// ---------------
+
+.markdown-editor {
+  background-color: white;
+}
+
+.markdown-editor #markdown-preview {
+  overflow-y: auto;
+  height: 15em;
+}
+
+.markdown-editor textarea {
+  height: 15em;
+}
+
+.markdown-editor.fullscreen {
+  z-index: 9999;
+  width: 100%;
+  height: 100%;
+  position: fixed;
+  top: 0;
+  left: 0;
+}
+
+.markdown-editor.fullscreen #markdown-preview {
+  height: 99%;
+}
+