diff --git a/static/css/main.css b/static/css/main.css
index 061d9329..2b338419 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -12,7 +12,7 @@ header {
height: 3em;
width: 100%;
background-color: #263238;
- padding: 0 2em;
+ padding: 0 1em;
box-sizing: border-box;
z-index: 999;
color: #eee;
@@ -60,50 +60,12 @@ header nav ul li a:hover {
}
main {
+ position: fixed;
top: 3em;
left: 0;
- position: fixed;
width: 100%;
- height: 100%;
- overflow: inherit;
-}
-
-.container {
- box-sizing: border-box;
- top: 3em;
- height: auto;
- max-height: 100%;
- bottom: 0;
-}
-
-.container.left {
- position: fixed;
- left: 0;
- width: 25%;
- background-color: #37474F;
+ height: calc(100% - 3em);
overflow: auto;
- color: #eee;
- padding: 1.5em 1.5em;
-}
-
-.container.main {
- position: fixed;
- right: 0;
- width: 75%;
- overflow: auto;
- padding: 0;
- margin-bottom: 3em;
-}
-
-.container *:first-child {
- margin-top: 0;
-}
-
-.container.main textarea {
- height: 100%;
- width: 100%;
- padding: 2em 5em;
- box-sizing: border-box;
}
.content {
@@ -112,17 +74,87 @@ main {
max-width: 800px;
}
-textarea {
+
+/* EDITOR STYLE */
+
+.editor .sidebar {
+ position: fixed;
+ left: 0;
+ top: 3em;
+ overflow-y: auto;
+ overflow-x: hidden;
+ height: calc(100% - 3em);
+ width: 25%;
+ background-color: #37474F;
+ color: #fff;
+ box-sizing: border-box;
+ padding: 1.5em 1em;
+}
+
+.editor .container {
+ position: fixed;
+ top: 3em;
+ right: 0;
+ overflow: hidden;
+ height: calc(100% - 6em);
+ width: 75%;
+ box-sizing: border-box;
+}
+
+.editor .sidebar *:first-child {
+ margin-top: 0;
+}
+
+.editor textarea {
+ box-sizing: border-box;
+ height: 100%;
width: 100%;
- min-height: 50em;
+ resize: none;
border: 0;
- resize: vertical;
- box-sizing: content-box;
- font-family: inherit;
+ padding: 1.5em 11em;
+ font-family: monospace;
+ font-size: 1.05em;
+}
+
+.editor input {
+ width: 100%;
+ background-color: #fff;
+ border-radius: 5px;
+ padding: .5em 1em;
+ box-sizing: border-box;
+}
+
+.editor input:focus {
+ border: 1px solid #ddd;
+}
+
+.editor legend {
+ font-size: 1em;
+ font-weight: bold;
+}
+
+.action-bar {
+ position: fixed;
+ bottom: 0;
+ right: 0;
+ width: 75%;
+ background-color: #455A64;
+ height: 3em;
+ display: flex;
+ padding: 0.5em 1em;
+ box-sizing: border-box;
+}
+
+.action-bar .left {
+ margin-right: auto;
+}
+
+.action-bar *:last-child {
+ margin-left: 1em;
}
-/* FORMS */
+/* FORMS ELEMENTS */
form input {
color: rgba(0, 0, 0, 0.41);
@@ -155,45 +187,6 @@ form legend {
font-size: 1.5em;
}
-form .container.left input {
- width: 100%;
- background-color: #fff;
- border-radius: 5px;
- padding: .5em 1em;
- box-sizing: border-box;
-}
-
-form .container.left input:focus {
- border: 1px solid #ddd;
-}
-
-form .container.left label {}
-
-form .container.left legend {
- font-size: 1em;
- font-weight: bold;
-}
-
-.action-bar {
- position: fixed;
- bottom: 0;
- right: 0;
- width: 75%;
- background-color: #455A64;
- height: 3em;
- display: flex;
- padding: 0.5em 1em;
- box-sizing: border-box;
-}
-
-.action-bar .left {
- margin-right: auto;
-}
-
-.action-bar *:last-child {
- margin-left: 1em;
-}
-
button, input[type="submit"] {
border: 0;
color: #fff;
diff --git a/static/js/app.js b/static/js/app.js
index cb4ab6f7..f0e46e7a 100644
--- a/static/js/app.js
+++ b/static/js/app.js
@@ -1,7 +1,6 @@
$(document).ready(function() {
$('.scroll').perfectScrollbar();
-
$('form').submit(function(event) {
var data = JSON.stringify($(this).serializeField())
var url = $(this).attr('action')
diff --git a/templates/base_full.tmpl b/templates/base_full.tmpl
index 2b021090..1dae69f5 100644
--- a/templates/base_full.tmpl
+++ b/templates/base_full.tmpl
@@ -32,11 +32,8 @@
-
- {{ template "content" . }}
-
+ {{ template "content" . }}