From eade2d3b1a6f390fecbb30e98fd33dbb669bab32 Mon Sep 17 00:00:00 2001
From: Kushagra Gour <chinchang457@gmail.com>
Date: Sat, 29 Sep 2018 11:50:55 +0530
Subject: [PATCH] Fix console codemirror overflow issue. fixes #324

---
 src/components/ContentWrap.jsx |  2 +-
 src/style.css                  | 10 +++++++++-
 2 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/src/components/ContentWrap.jsx b/src/components/ContentWrap.jsx
index b9b87e0..363a456 100644
--- a/src/components/ContentWrap.jsx
+++ b/src/components/ContentWrap.jsx
@@ -928,7 +928,7 @@ export default class ContentWrap extends Component {
 						</div>
 						<div
 							id="consolePromptEl"
-							class="console__prompt flex flex-v-center"
+							class="console__prompt flex flex-v-center flex-shrink-0"
 						>
 							<svg width="18" height="18" fill="#346fd2">
 								<use xlinkHref="#chevron-icon" />
diff --git a/src/style.css b/src/style.css
index aa1591a..f86a817 100644
--- a/src/style.css
+++ b/src/style.css
@@ -87,6 +87,10 @@ button {
 	justify-content: flex-end;
 }
 
+.flex-shrink-0 {
+	flex-shrink: 0
+}
+
 .fr {
 	float: right;
 }
@@ -1375,11 +1379,15 @@ body > #demo-frame {
 }
 
 .console .CodeMirror {
-	height: calc(100% - 30px);
+	flex-grow: 1;
+	/* flex-basis of 0 to trigger overflow https://stackoverflow.com/a/52489012/891962 */
+	flex-basis: 0;
 }
 
 .console__log {
 	flex: 1;
+	display: flex;
+	flex-direction: column;
 }
 
 .console-exec-input {