Part of a snippet emulator

2023-01-26 15:14:37 -06:00
parent b3c533b0c6
commit 87daef0fdc
6 changed files with 201 additions and 2 deletions
@@ -0,0 +1,41 @@
+body {
+    display: grid;
+    grid-template-columns: 1fr auto 1fr;
+    grid-template-rows: 2em auto;
+    background: #777777;
+}
+.react-root {
+    grid-area: 2 / 2 / 3 / 3;
+}
+
+.snippetEmulator {
+    display: grid;
+    grid-template-rows: 10em 1em 1em 2em;
+    grid-template-columns: 20em;
+    background: #333333;
+    font-family: monospace;
+    padding: 0.5em;
+}
+
+.snippetEmulator textarea { grid-area: 1 / 1 / 2 / 2 }
+.snippetEmulator .src { grid-area: 1 / 1 / 2 / 2 }
+.snippetEmulator .message { grid-area: 2 / 1 / 3 / 2 }
+.snippetEmulator .buttons { grid-area: 3 / 1 / 4 / 2 }
+.snippetEmulator .stacks { grid-area: 4 / 1 / 5 / 2 }
+.snippetEmulator textarea {
+    background: #0f0f0f;
+    color: #dddddd;
+    min-height: 10em;
+    border: none;
+    resize: vertical;
+    padding: 0;
+    border: none;
+}
+.snippetEmulator textarea:focus { outline: none; }
+.snippetEmulator .buttons a {
+    margin-right: 0.5em;
+    cursor: pointer;
+}
+.snippetEmulator .step, .snippetEmulator .run { color: lightgreen }
+.snippetEmulator .reset { color: lightcoral }
+.snippetEmulator .build, .snippetEmulator .edit { color: dodgerblue }