1 files changed, 82 insertions, 30 deletions

diff --git a/css/codeq.css b/css/codeq.css
index fa1107b..53d61dc 100644
--- a/css/codeq.css
+++ b/css/codeq.css
@@ -1,51 +1,86 @@
-html {
-    width: 100%;
-    height: 100%;
-    background-color: whitesmoke;
-    padding: 0;
-    margin: 0;
-    border: none;
+body {
+    padding-top: 50px;
 }
 
-body {
-    width: 100%;
-    height: 100%;
-    margin: 0 auto;
+.block {
+    border-right: 1px solid #e5e5e5;
+    border-bottom: 1px solid #e5e5e5;
     padding: 0;
-    border: none;
-    color: black;
-    font-family: Trebuchet MS, Verdana, Tahoma, sans-serif;
-    background-color: red;
 }
 
-#gui {
+.block-label {
+    color: grey;
+    position: absolute;
+    z-index: 60;
+    opacity: .7;
+    right: 1em;
+    bottom: 0.25em;
+    margin: 0;
     width: 100%;
-    height: 100%;
+    text-transform: uppercase;
+    font-size: large;
+    text-align: right;
 }
 
-.block {
-    width: 100%;
-    min-height: 10%;
-    background-color: #ddffdd;
+/* lg */
+@media (min-width: 1200px) {
+    html, body, #gui, #block-row {
+        height: 100%;
+    }
+
+    .block {
+        overflow: auto;
+        min-height: 100%; height: 100%;
+    }
 }
 
-nav {
-    background-color: #e6db74;
+/* md */
+@media (min-width: 992px) and (max-width: 1199px) {
+    html, body, #gui, #block-row {
+        height: 100%;
+    }
+
+    .block {
+        overflow: auto;
+        min-height: 50%; height: 50%;
+    }
+}
+
+/* sm */
+@media (min-width: 768px) and (max-width: 991px) {
 }
 
-nav > ul li {
-    list-style: none;
-    display: inline;
-    padding: 0 10px;
+/* xs */
+@media (max-width: 767px) {
+}
+
+/* description */
+#description {
+    padding: 0.5em;
+}
+
+/* info */
+#info {
+    padding: 0.5em;
+}
+
+/* code_editor */
+#code_editor {
+    min-height: 100%;
+    height: 100%;
+    padding: 0;
 }
 
 /* console */
 #console {
-    font-size: 14px
+    min-height: 100%;
+    height: 100%;
+    font-size: 14px;
+    padding: 0;
 }
 #console div.jquery-console-inner {
-    width:900px;
-    height:200px;
+    width:100%;
+    height:100%;
     background:#333;
     padding:0.5em;
     overflow:auto
@@ -81,4 +116,21 @@ nav > ul li {
 #console div.jquery-console-message {
     color: #ddffdd;
     font-family: monospace;
+}
+
+
+/* webkit-scrollbar */
+
+::-webkit-scrollbar {
+    width: 12px;
+}
+
+::-webkit-scrollbar-track {
+    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
+    border-radius: 10px;
+}
+
+::-webkit-scrollbar-thumb {
+    border-radius: 10px;
+    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
 }
\ No newline at end of file