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%;
+}
+

app/views/admin/legislation/draft_versions/_form.html.erb

@@ -61,8 +61,11 @@
     </div>
     <br/>
     <div class="markdown-editor">
+      <div class="small-12 column">
+        <span class="icon-arrows-expand"></span><%= link_to t("admin.legislation.draft_versions.form.fullscreen_toggle"), "#", class: 'fullscreen-toggle' %>
+      </div>
       <div class="small-12 medium-6 column">
-        <%= f.text_area :body, label: false, rows: 25 %>
+        <%= f.text_area :body, label: false %>
       </div>
       <div id="markdown-preview" class="small-12 medium-6 column">
       </div>

config/locales/admin.en.yml

@@ -115,6 +115,8 @@ en:
         errors:
           form:
             error: Error
+        form:
+          fullscreen_toggle: Toggle full screen
         index:
           title: Draft versions
           create: Create version

config/locales/admin.es.yml

@@ -113,6 +113,8 @@ es:
         errors:
           form:
             error: Error
+        form:
+          fullscreen_toggle: Pantalla completa
         index:
           title: Versiones del borrador
           create: Crear versión