From 81c067fa0cd3917ff9e22ca2a809b9dfad774d3c Mon Sep 17 00:00:00 2001
From: Peter Meier <peter.meier.1986@gmail.com>
Date: Thu, 25 Jun 2026 13:38:57 +0200
Subject: [PATCH] fix(newsletter): stack inline footer form on mobile

Email field + submit button stacked on mobile (button full width below the
input) and side by side from sm up. The long "Newsletter abonnieren" button
was squeezing the email field on narrow screens.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 .../components/internal/NewsletterInlineFormComponent.svelte  | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/lib/components/internal/NewsletterInlineFormComponent.svelte b/src/lib/components/internal/NewsletterInlineFormComponent.svelte
index e26a67b..dd3600c 100644
--- a/src/lib/components/internal/NewsletterInlineFormComponent.svelte
+++ b/src/lib/components/internal/NewsletterInlineFormComponent.svelte
@@ -137,7 +137,7 @@
         <input name="company" type="text" tabindex="-1" autocomplete="off" bind:value={company} />
       </div>
 
-      <div class="flex gap-2">
+      <div class="flex flex-col gap-2 sm:flex-row">
         <input
           type="email"
           name="email"
@@ -151,7 +151,7 @@
         <button
           type="submit"
           disabled={formState === "pending"}
-          class="shrink-0 rounded-sm bg-wald-600 px-4 py-2 text-sm font-semibold text-stein-0 transition-colors hover:bg-wald-500 disabled:opacity-60"
+          class="rounded-sm bg-wald-600 px-4 py-2 text-sm font-semibold text-stein-0 transition-colors hover:bg-wald-500 disabled:opacity-60 sm:shrink-0"
         >
           {formState === "pending" ? t(T.newsletter_submitting) : t(T.newsletter_submit)}
         </button>