formatting of repl

braddunbar · Feb 17, 2025 · 3479dbe · 3479dbe
1 parent f1badd4
commit 3479dbe
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 6 deletions.
diff --git a/_js/repl.tsx b/_js/repl.tsx
@@ -119,7 +119,8 @@ const Repl = () => {
           )
         })}
       </div>
-      <form onSubmit={onSubmit}>
+      <form onSubmit={onSubmit} class="repl-form">
+        <div class="repl-prompt">&gt;</div>
         <input spellcheck={false} class="repl-input" ref={input} type="text" onInput={onInput} value={command.value} required />
       </form>
     </div>

diff --git a/css/screen.scss b/css/screen.scss
@@ -154,7 +154,7 @@ hr
 .content
 {
   margin: 0 auto;
-  max-width: 37.5em;
+  max-width: 45em;
   padding-bottom: 2em;
 }
 
@@ -568,23 +568,34 @@ sup a {
 
 .repl {
   background-color: #444;
+  color: #fff;
+  font-family: monospace;
+  font-size: 1.5em;
   padding: 0.25em;
 }
 
 .repl-history {
   border-bottom: solid 1px #fff;
+  height: 15em;
+  overflow: scroll;
+  margin-bottom: 0.25em;
+}
+
+.repl-prompt {
   color: #fff;
   font-family: monospace;
   font-size: 1.5em;
-  height: 10em;
-  overflow: scroll;
-  margin-bottom: 0.25em;
+}
+
+.repl-form {
+  align-items: center;
+  display: flex;
 }
 
 .repl-input {
-  color: #fff;
   background-color: transparent;
   border: none;
+  color: #fff;
   font-family: monospace;
   font-size: 1.5em;
   outline: none;