From 0fc90126a7879f23a92722fb5c72170a9cb13c18 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Krist=C3=B3f=20T=C3=B3th?= <kristof.toth@avatao.com>
Date: Tue, 12 Jun 2018 19:09:11 +0200
Subject: [PATCH] Fix monaco editor overflowing from container (partial)

---
 src/app/dashboard/dashboard.component.ts |  4 ++--
 src/app/ide/ide.component.html           | 15 ++++-----------
 src/app/ide/ide.component.scss           |  3 ++-
 3 files changed, 8 insertions(+), 14 deletions(-)

diff --git a/src/app/dashboard/dashboard.component.ts b/src/app/dashboard/dashboard.component.ts
index 86307db..4c5e498 100644
--- a/src/app/dashboard/dashboard.component.ts
+++ b/src/app/dashboard/dashboard.component.ts
@@ -93,8 +93,8 @@ export class DashboardComponent implements OnInit, OnDestroy {
 
   setLayout(layout: string) {
     this.layout = layout;
-    // We need to trigger a 'resize' event manually, otherwise ace editor stays collapsed
-    // Ace editors 'resize' event listener requires a parameter of force=true
+    // We need to trigger a 'resize' event manually, otherwise editor stays collapsed
+    // editor 'resize' event listener requires a parameter of force=true
     setTimeout(() => window.dispatchEvent(new Event('resize', {force: true} as any)), 0);
   }
 
diff --git a/src/app/ide/ide.component.html b/src/app/ide/ide.component.html
index 7a6a06c..e1579f5 100644
--- a/src/app/ide/ide.component.html
+++ b/src/app/ide/ide.component.html
@@ -37,17 +37,10 @@
   </div>
 </div>
 
-<!--div (keyup)="setCodeState(CodeState.DIRTY); setDeployButtonState(DeployButtonState.TODEPLOY); resetAutoSaveCountdown()"
-  ace-editor
-  [(text)]="code"
-  [mode]="language"
-  [theme]="theme"
-  [options]="options"
-  class="tfw-ace-editor">
-</div-->
-
 <ngx-monaco-editor [(ngModel)]="code"
-                   class="tfw-ace-editor"
-                   (keyup)="setCodeState(CodeState.DIRTY); setDeployButtonState(DeployButtonState.TODEPLOY); resetAutoSaveCountdown()"
+                   class="tfw-ide-editor"
+                   (keyup)="setCodeState(CodeState.DIRTY);
+                            setDeployButtonState(DeployButtonState.TODEPLOY);
+                            resetAutoSaveCountdown()"
                    [options]="editorOptions"
 ></ngx-monaco-editor>
diff --git a/src/app/ide/ide.component.scss b/src/app/ide/ide.component.scss
index f267ca7..2d002d3 100644
--- a/src/app/ide/ide.component.scss
+++ b/src/app/ide/ide.component.scss
@@ -9,9 +9,10 @@
   grid-template-columns: 8fr 1fr;
 }
 
-.tfw-ace-editor {
+.tfw-ide-editor {
   height: calc(100% - 67px);
   width: 100%;
+  overflow: hidden;
 }
 
 .btn-group {