Make error box shrink editor rather than overlay

ioNihal · Mar 10, 2023 · 213b3fa · 213b3fa
1 parent c04a849
commit 213b3fa
Showing 1 changed file with 9 additions and 6 deletions.
diff --git a/src/components/big-interactive-pages/editor.module.css b/src/components/big-interactive-pages/editor.module.css
@@ -14,16 +14,20 @@
 }
 
 .codeContainer {
- height: 100%;
  flex: 1;
  background: #ffffff;
  position: relative;
  overflow: hidden;
+ display: flex;
+ flex-direction: column;
+ border-bottom: 2px solid var(--accent);
 }
 
 .codeContainer .code {
- border: 2px solid var(--accent);
+ flex: 1;
  overflow: hidden;
+ border: 2px solid var(--accent);
+ border-bottom: none;
 }
 
 .codeContainer .playButton {
@@ -36,11 +40,9 @@
 .codeContainer .errors {
  font-family: var(--font-code);
  font-size: 0.9em;
- /* position: absolute;
- left: 0;
- bottom: 0; */
+ position: relative;
  width: 100%;
- height: 80px;
+ max-height: 160px;
  overflow-y: auto;
  white-space: pre-wrap;
  word-wrap: break-word;
@@ -49,6 +51,7 @@
  background: #ffffff;
  border: 2px solid var(--accent);
  border-top: 3px solid var(--error);
+ border-bottom: none;
  color: var(--error);
  display: flex;
  flex-direction: column;