playground: make file view scrollable

astro.config.mjs

@@ -68,6 +68,7 @@ export default defineConfig({
             components: {
                 PageTitle: "./src/components/override/PageTitle.astro",
                 ContentPanel: "./src/components/override/ContentPanel.astro",
+                Pagination: "./src/components/override/Pagination.astro",
             },
             sidebar: [
                 {

src/components/override/Pagination.astro

@@ -0,0 +1,10 @@
+---
+import type { Props } from "@astrojs/starlight/props";
+import Default from "@astrojs/starlight/components/Pagination.astro";
+import { isPlaygroundPage } from '@utils/playground';
+
+const isPlayground = isPlaygroundPage(Astro.props.slug, Astro.currentLocale);
+---
+
+
+{isPlayground ? <></> : <Default {...Astro.props}><slot /></Default>}

src/styles/playground.scss

@@ -1,6 +1,6 @@
 .playground {
     display: grid;
-    grid-template-columns: clamp(100px, 15%, 400px) auto;
+    grid-template-columns: clamp(200px, 15%, 500px) auto;
     grid-template-areas:
         "header header"
         "files editor";
@@ -14,13 +14,18 @@
         flex-direction: column;
         margin-right: 0.5cm;
         overflow-x: hidden;
-        overflow-y: auto;
+        overflow-y: hidden;
+        max-height: 70vh;
 
         > h3 {
             cursor: pointer;
         }
 
         .entries {
+            overflow-y: auto;
+            overflow-x: hidden;
+            word-wrap: break-word;
+
             button {
                 border: none;
                 width: 100%;
@@ -41,6 +46,10 @@
     }
     > .editor {
         grid-area: editor;
+
+        .monaco-editor {
+            padding-block: 10px;
+        }
     }
 }
 

src/wasm/webcompiler/Cargo.toml

@@ -6,6 +6,9 @@ edition = "2021"
 [lib]
 crate-type = ["cdylib"]
 
+[profile.release]
+opt-level = "s"
+
 # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
 
 [dependencies]