Tweaks for mobile

.gitignore

@@ -1 +1,2 @@
+dist/
 node_modules/

src/main.ts

@@ -7,10 +7,10 @@ const app = document.querySelector<HTMLDivElement>('#app')!;
 app.innerHTML = `
   <h1>Synced editors</h1>
   <p>Network delay (simulated) of 2.5 to 5 seconds.</p>
-  <textarea id="ta1" rows=10 cols=80></textarea>
+  <textarea id="ta1" rows=10></textarea>
   <br>
   <br>
-  <textarea id="ta2" rows=10 cols=80></textarea>
+  <textarea id="ta2" rows=10></textarea>
 `;
 
 const ta1 = document.getElementById('ta1') as HTMLTextAreaElement;

src/style.css

@@ -33,3 +33,9 @@ h1 {
   font-size: 3.2em;
   line-height: 1.1;
 }
+
+textarea {
+  width: 100%;
+  max-width: 80ch;
+  box-sizing: border-box;
+}

vite.config.ts

@@ -1,6 +1,7 @@
 import { defineConfig } from 'vite';
 
 export default defineConfig({
+  base: './',
   root: '.',
   build: {
     outDir: 'dist',