From 175aa52eeb6b139301039feac656d41ff33a7163 Mon Sep 17 00:00:00 2001
From: rachel-mp4 <rachel@moth11.net>
Date: Fri, 5 Sep 2025 17:36:53 -0400
Subject: [PATCH] maybe this does it!

---
 src/lib/components/AutoGrowInput.svelte    |  4 +++-
 src/lib/components/AutoGrowTextArea.svelte |  3 +++
 src/lib/components/Receiever.svelte        |  7 +++++--
 src/lib/components/Transmitter.svelte      | 14 +++++++++++++-
 4 files changed, 24 insertions(+), 4 deletions(-)

diff --git a/src/lib/components/AutoGrowInput.svelte b/src/lib/components/AutoGrowInput.svelte
index ffe19f0..a24eaad 100644
--- a/src/lib/components/AutoGrowInput.svelte
+++ b/src/lib/components/AutoGrowInput.svelte
@@ -11,6 +11,7 @@
         maxlength?: number;
         bold?: boolean;
         color?: string;
+        fs?: string;
     }
 
     let {
@@ -22,6 +23,7 @@
         size = 5,
         bold = false,
         color,
+        fs,
     }: Props = $props();
 
     let inputEl: HTMLElement;
@@ -52,12 +54,12 @@
     style:font-weight={bold ? "700" : "inherit"}
     style:--theme={color}
     style:--themep={hexToTransparent(color ?? "#ffffff")}
+    style:font-size={fs ?? "1rem"}
     {placeholder}
 />
 
 <style>
     input {
-        font-size: 1rem;
         color: var(--theme);
         background-color: transparent;
         border: none;
diff --git a/src/lib/components/AutoGrowTextArea.svelte b/src/lib/components/AutoGrowTextArea.svelte
index 8c8447b..3c1ffc0 100644
--- a/src/lib/components/AutoGrowTextArea.svelte
+++ b/src/lib/components/AutoGrowTextArea.svelte
@@ -9,6 +9,7 @@
         maxlength?: number;
         bold?: boolean;
         color?: string;
+        fs?: string;
     }
 
     let {
@@ -19,6 +20,7 @@
         maxlength,
         bold = false,
         color,
+        fs,
     }: Props = $props();
 
     let inputEl: HTMLTextAreaElement;
@@ -85,6 +87,7 @@
         onbeforeinput={bi}
         style:font-weight={bold ? "700" : "inherit"}
         style:--theme={color}
+        style:font-size={fs ?? "1rem"}
         {placeholder}
     ></textarea>
 </div>
diff --git a/src/lib/components/Receiever.svelte b/src/lib/components/Receiever.svelte
index 6fa2364..dff88b7 100644
--- a/src/lib/components/Receiever.svelte
+++ b/src/lib/components/Receiever.svelte
@@ -9,13 +9,16 @@
   }
   let { messages, mylocaltext, onmute, onunmute }: Props = $props();
   let length = $derived(messages.length);
+  let innerWidth = $state(0);
+  let isDesktop = $derived(innerWidth > 1000);
 </script>
 
+<svelte:window bind:innerWidth />
 <div id="receiver">
   {#each messages as message, index}
     {@const last = length - 1}
     {@const diff = last - index}
-    {@const guess = 2 + (Math.atan((diff - 18) * 0.25) / -2.8 - 0.45)}
+    {@const guess = 2 + (Math.atan((diff - 19) * 0.25) / -2.8 - 0.45)}
     {@const res = Math.min(Math.max(guess, 1), 2)}
     <Transmission
       {message}
@@ -23,7 +26,7 @@
       margin={0}
       {onmute}
       {onunmute}
-      fs={`${res}rem`}
+      fs={isDesktop ? `${res}rem` : "1rem"}
     />
   {/each}
 </div>
diff --git a/src/lib/components/Transmitter.svelte b/src/lib/components/Transmitter.svelte
index 3bb8d0e..3693061 100644
--- a/src/lib/components/Transmitter.svelte
+++ b/src/lib/components/Transmitter.svelte
@@ -11,6 +11,8 @@
     }
     let { ctx, defaultNick, defaultHandle }: Props = $props();
     let nick = $state(defaultNick ?? "wanderer");
+    let innerWidth = $state(0);
+    let isDesktop = $derived(innerWidth > 1000);
     $effect(() => {
         if (ctx) {
             ctx.setNick(nick);
@@ -76,8 +78,14 @@
     };
 </script>
 
+<svelte:window bind:innerWidth />
+
 <div id="transmitter">
-    <div class="wrapper" style:--theme={color}>
+    <div
+        class="wrapper"
+        style:--theme={color}
+        style:font-size={isDesktop ? "2rem" : "1rem"}
+    >
         <input
             type="range"
             min="0"
@@ -86,6 +94,7 @@
             onchange={() => {
                 ctx.setColor(ctx.color);
             }}
+            style:font-size={isDesktop ? "2rem" : "1rem"}
         />
         <AutoGrowInput
             bind:value={nick}
@@ -94,6 +103,7 @@
             onInput={setName}
             maxlength={12}
             bold={true}
+            fs={isDesktop ? "2rem" : "1rem"}
         />
         @
         <AutoGrowInput
@@ -103,6 +113,7 @@
             onInput={setHandle}
             maxlength={253}
             bold={false}
+            fs={isDesktop ? "2rem" : "1rem"}
         />
     </div>
     <AutoGrowTextArea
@@ -110,6 +121,7 @@
         onBeforeInput={bi}
         onInput={diffAndSend}
         maxlength={65535}
+        fs={isDesktop ? "2rem" : "1rem"}
     />
 </div>
 
-- 
2.51.2