console progress

src/routes/console/+page.svelte

@@ -1,3 +1,46 @@
-<div style="height: 90vh;" class="bg-purple-600">
+<script lang="ts">
+    var test: string[] = ["> bruh", "bruh", "> Ping", "Pong"];
+    test = test.concat(test);
+    test = test.concat(test);
+    test = test.concat(test);
+    test = test.concat(test);
+</script>
 
+<div class="consoleContainer" style="height: 92vh;">
+    <div class="overflow-auto" style="">
+        <ul>
+            {#each test as item}
+                <li>{item}</li>
+            {/each}
+        </ul>
+    </div>
+
+    <div>
+        <label class="input input-bordered flex items-center gap-2">
+            <svg
+              xmlns="http://www.w3.org/2000/svg"
+              viewBox="0 0 24 24"
+              fill="currentColor"
+              class="h-8 w-8 opacity-70 block m-auto">
+              <path d="M8.59 16.59L13.17 12 8.59 7.41 10 6l6 6-6 6-1.41-1.41z"/>
+            </svg>
+            <input type="text" class="grow" placeholder="Search" />
+          </label>
+    </div>
 </div>
+
+<style lang="scss">
+    .consoleContainer {
+        display: flex;
+        flex-direction: column;
+        flex-grow: 1;
+
+        &:nth-child(1) {
+            flex: 0 0 90%;
+        }
+
+        &:nth-child(2) {
+            flex: 0 0 10%;
+        }
+    }
+</style>