improved layout and fixed bugs introduced new ones

codeeditor-app/elements/code-editor-container/code-editor-container.less

@@ -1,12 +1,28 @@
 @import url('../../../shared/theme.less');
 
-div > code-editor-container.active:last-child {
+code-editor-container {
+    min-height: 100%; 
+    max-height: 100%;
+}
+
+code-editor-container.first-visible .code-editor-header {
+    border-top-color: transparent;
+}
+
+
+code-editor-container.last-visible {
     min-height: auto !important;
     max-height: none !important;
     min-width: auto !important;
     max-width: none !important;
 }
 
+code-editor-container.last-visible > resize-handle {
+    display: none !important;
+}
+
+
+
 .code-editor-header {
     padding: 10px 18px;
     background: lighten(@editor-bg-white, 1%);
@@ -17,6 +33,10 @@ div > code-editor-container.active:last-child {
     border-width: 1px;
 }
 
+.code-editor-content {
+
+}
+
 @media (prefers-color-scheme: dark) {
     .code-editor-header {
         background: lighten(@editor-bg-dark, 1%);

codeeditor-app/elements/code-editor-container/code-editor-container.ts

@@ -23,12 +23,15 @@ export class CodeEditorContainer extends BaseElement {
     }
 
     createCodeEditor(language: string, expandDir: 'vertical' | 'horizontal') {
-        var codeEditor = <CodeEditor>document.createElement("code-editor");
-        codeEditor.setAttribute("language", language);
+        var codeEditorContent = document.createElement("div");
+        codeEditorContent.classList.add("code-editor-content");
+        var codeEditor = <CodeEditor>document.createElement(language + "-code-editor");
+        codeEditorContent.appendChild(codeEditor);
+
         var resizeHandle = <ResizeHandle>document.createElement("resize-handle");
         resizeHandle.setAttribute("dir", expandDir);
 
-        this.appendChild(codeEditor);
+        this.appendChild(codeEditorContent);
         this.appendChild(resizeHandle);
     }
 }