From d2f3146e035dac097e4f6353d8c590e3a4b67d9e Mon Sep 17 00:00:00 2001
From: Dominik Milacher <code@dominikmilacher.com>
Date: Wed, 15 Oct 2025 10:33:35 +0200
Subject: [PATCH] Make more mobile-friendly

---
 .../components/AppHeader.vue                     | 16 +++++++++++++++-
 .../pages/[locale]/[variant]/index.vue           |  2 +-
 2 files changed, 16 insertions(+), 2 deletions(-)

diff --git a/apps/panoramablick-saalbach.at/components/AppHeader.vue b/apps/panoramablick-saalbach.at/components/AppHeader.vue
index 20a9727..811cc52 100644
--- a/apps/panoramablick-saalbach.at/components/AppHeader.vue
+++ b/apps/panoramablick-saalbach.at/components/AppHeader.vue
@@ -15,7 +15,21 @@
         <!-- nav links -->
         <ul class="flex space-x-6">
           <li>
-            <NuxtLink :to="p('apartments')">{{ c.header.apartments }}</NuxtLink>
+            <!-- Mobile: Show only first word -->
+            <NuxtLink
+                :to="p('apartments')"
+                class="block sm:hidden"
+            >
+              {{ c.header.apartments.split(' ')[0] }}
+            </NuxtLink>
+
+            <!-- Desktop: Show full text -->
+            <NuxtLink
+                :to="p('apartments')"
+                class="hidden sm:block"
+            >
+              {{ c.header.apartments }}
+            </NuxtLink>
           </li>
           <li>
             <NuxtLink :to="p('book')">{{ c.header.book }}</NuxtLink>
diff --git a/apps/panoramablick-saalbach.at/pages/[locale]/[variant]/index.vue b/apps/panoramablick-saalbach.at/pages/[locale]/[variant]/index.vue
index 07feb3c..caeb00b 100644
--- a/apps/panoramablick-saalbach.at/pages/[locale]/[variant]/index.vue
+++ b/apps/panoramablick-saalbach.at/pages/[locale]/[variant]/index.vue
@@ -31,7 +31,7 @@
               }}
             </p>
             </div>
-            <div class="mt-8 flex gap-4">
+            <div class="mt-8 flex gap-4 flex-wrap">
               <UButton :to="p('apartments')" color="primary" variant="solid" size="xl"
                        trailing-icon="i-heroicons-arrow-right">{{ c.button.apartments }}
               </UButton>