added html and css editors

codeeditor-app/app.less

@@ -8,10 +8,12 @@ html, body {
     background: @median-bg-white;
 }
 
+
 .flex-horiz {
     display: flex;
     flex-direction: row;
     height: 100%;
+    overflow: hidden;
 }
 
 .flex-vert {
@@ -28,6 +30,10 @@ html, body {
     position: relative;
 }
 
+.animate .flex-horiz > *, .animate .flex-vert > * {
+    transition: all 280ms ease-in-out;
+}
+
 .flex-horiz .flex-shrink, .flex-vert .flex-shrink {
     flex-grow: 0;
     flex-shrink: 1;
@@ -60,6 +66,16 @@ body {
 
 .section.top {
     border-bottom: 1px solid @primary-border-color-white;
+    padding: 0;
+}
+
+.section.top h1 {
+    margin: 0;
+    padding: 10px;
+    font-family: @primary-font-family;
+    font-weight: 400;
+    font-size: 18px;
+    display: inline-block;
 }
 
 .section.bottom {
@@ -69,6 +85,15 @@ body {
     text-align: right;
 }
 
+.code-editor-containers {
+    background: @editor-bg-white;
+}
+
+.code-editor-containers.force-close {
+    min-width: 0 !important;
+    max-width: 0 !important;
+}
+
 @media (prefers-color-scheme: dark) {
     body {
         background: @median-bg-dark;
@@ -86,4 +111,8 @@ body {
     .section.bottom {
         border-color: @primary-bg-color-dark;
     }
-}
+
+    .code-editor-containers {
+        background: @editor-bg-dark;
+    }
+}