Make code2 the default code app

2017-09-05 11:35:15 +02:00
parent c0f14dea5e
commit d2787e3eff
25 changed files with 1482 additions and 1441 deletions
--- a/www/code/app-code.less
+++ b/www/code/app-code.less
@@ -0,0 +1,95 @@
+@import (once) "../../customize/src/less2/include/browser.less";
+@import (once) "../../customize/src/less2/include/toolbar.less";
+@import (once) "../../customize/src/less2/include/markdown.less";
+@import (once) '../../customize/src/less2/include/fileupload.less';
+@import (once) '../../customize/src/less2/include/alertify.less';
+
+.toolbar_main();
+.fileupload_main();
+.alertify_main();
+
+// body
+&.cp-app-code {
+    display: flex;
+    flex-flow: column;
+    max-height: 100%;
+    min-height: auto;
+
+    .CodeMirror {
+        display: inline-block;
+        height: 100%;
+        width: 50%;
+        min-width: 20%;
+        max-width: 80%;
+        resize: horizontal;
+        font-size: initial;
+    }
+    .CodeMirror.fullPage {
+        //min-width: 100%;
+        max-width: 100%;
+        resize: none;
+        flex: 1;
+    }
+    .CodeMirror-focused .cm-matchhighlight {
+        background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAFklEQVQI12NgYGBgkKzc8x9CMDAwAAAmhwSbidEoSQAAAABJRU5ErkJggg==);
+        background-position: bottom;
+        background-repeat: repeat-x;
+    }
+    #cp-app-code-editor {
+        flex: 1;
+        display: flex;
+        flex-flow: row;
+        height: 100%;
+        overflow: hidden;
+    }
+    #cp-app-code-preview {
+        flex: 1;
+        padding: 5px 20px;
+        overflow: auto;
+        display: inline-block;
+        height: 100%;
+        border-left: 1px solid black;
+        box-sizing: border-box;
+        font-family: Calibri,Ubuntu,sans-serif;
+        word-wrap: break-word;
+        position: relative;
+        media-tag {
+            * {
+                max-width:100%;
+            }
+            iframe[type="application/pdf"] {
+                max-height:50vh;
+            }
+        }
+    }
+
+    #cp-app-code-preview-content {
+        max-width: 40vw;
+        margin: 1em auto;
+
+        .markdown_preformatted-code;
+        .markdown_gfm-table(black);
+    }
+
+    .cp-splitter {
+        position: absolute;
+        height: 100%;
+        width: 8px;
+        top: 0;
+        left: 0;
+
+        cursor: col-resize;
+    }
+
+    @media (max-width: @browser_media-medium-screen) {
+        .CodeMirror {
+            flex: 1;
+            max-width: 100%;
+            resize: none;
+        }
+        #cp-app-code-preview {
+            display: none !important;
+        }
+}
+}
+