mobileview: Resolve topbar inconsistency.

Fixes #14. Fixes #13.

Author: aero31aero

index.css

@@ -108,12 +108,23 @@
      vertical-align: baseline;
  }
 
- @media screen and (max-width: 1024px) {
-     .left {
-         display: none !important;
+@media screen and (max-width: 1024px) {
+     #in, #out {
+        margin: 0;
+        left: 0;
+        width: 95%;
+     }
+
+     #in {
+        z-index: 1000;
+     }
+
+     a#logo {
+        display: none;
      }
-     #viewbutton {
-         display: inline-block !important;
+
+     .navbutton {
+        margin-left: 5px !important;
      }
  }
 

index.html

@@ -36,7 +36,7 @@
     </div>
     <div id="navbar">
       <div id="navcontent">
-        <a href = "https://github.com/aero31aero/markdown-editor" tooltip = "Check out the code on Github!">
+        <a id="logo" href = "https://github.com/aero31aero/markdown-editor" tooltip = "Check out the code on Github!">
           <p id="title" class="left"># Markdown Editor</p>
         </a>
         <p id="openbutton" title="Open from Disk" class="navbutton left" onclick="document.getElementById('fileInput').click();"><i class="material-icons">open_in_browser</i></p>
@@ -48,7 +48,6 @@
         <p id="readbutton" title="Reading Mode" class="navbutton left" onclick="toggleReadMode(this)"><i class="material-icons">chrome_reader_mode</i></p>
         <p id="newbutton" class="navbutton left hidden" onclick="clearEditor()">Clear</p>
         <p id="sharebutton" class="navbutton left selected hidden">Share</p>
-        <p id="viewbutton" class="navbutton right" onclick="toggleEditorView(this)">Show Editor</p>
       </div>
     </div>
     <script src="lib/markdown-it.js"></script>

index.js

@@ -229,40 +229,6 @@ function clearEditor() {
     editor.setValue("");
 }
 
-function initEditor() {
-    var mq = window.matchMedia("screen and (max-width: 1024px)");
-    mq.addListener(manageSpiltView);
-}
-
-function manageSpiltView(mq) {
-    //console.log(mq);
-    var inview = document.getElementById('in');
-    var outview = document.getElementById('out');
-    var isMDViewOn = document.getElementById('viewbutton').classList.contains('selected');
-    if (mq.matches) {
-        //HALF VIEW
-        if (isMDViewOn) {
-            //SHOW EDITOR
-            inview.style.display = 'block';
-            inview.style.width = '100%';
-            outview.style.display = 'none';
-        } else {
-            //SHOW HTML
-            inview.style.display = 'none';
-            outview.style.display = 'block';
-            outview.style.left = '0';
-            outview.paddingLeft = '10px'
-        }
-    } else {
-        //FULL VIEW
-        inview.style.width = '50%';
-        inview.style.display = 'block';
-        outview.style.paddingLeft = '20px';
-        outview.style.left = '50%';
-        outview.style.display = 'block';
-    }
-}
-
 function saveInBrowser() {
     var text = editor.getValue();
     if (localStorage.getItem('content')) {
@@ -286,13 +252,6 @@ function saveInBrowser() {
     console.log("Saved");
 }
 
-function toggleEditorView(button) {
-    button.classList.toggle('selected');
-    manageSpiltView({
-        matches: true
-    });
-}
-
 function toggleNightMode(button) {
     button.classList.toggle('selected');
     document.getElementById('toplevel').classList.toggle('nightmode');
@@ -338,7 +297,6 @@ function start() {
     }
     update(editor);
     editor.focus();
-    initEditor();
     document.getElementById('fileInput').addEventListener('change', openFile, false);
 }