From 0716ea0bd5feeba830a0fe7208d2b2438563bbfe Mon Sep 17 00:00:00 2001
From: Paulo Castellano <paulo@castellanos.llc>
Date: Sat, 18 Jul 2026 08:38:09 -0300
Subject: [PATCH] =?UTF-8?q?fix(posts):=20mobile=20calendar=20header=20?=
 =?UTF-8?q?=E2=80=94=20nav=20+=20compact=20date=20on=20row=201,=20full-wid?=
 =?UTF-8?q?th=20New=20post=20below?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Move Today up with prev/next, keep the date picker compact on the right instead
of full-width, and give New post its own full-width row.
---
 resources/js/pages/posts/Calendar.vue | 34 +++++++++++++--------------
 1 file changed, 17 insertions(+), 17 deletions(-)

diff --git a/resources/js/pages/posts/Calendar.vue b/resources/js/pages/posts/Calendar.vue
index e58fcfa3..218b201e 100644
--- a/resources/js/pages/posts/Calendar.vue
+++ b/resources/js/pages/posts/Calendar.vue
@@ -253,27 +253,27 @@ const formatTime = (scheduledAt: string): string => {
 
     <AppLayout :fullWidth="true">
         <div class="flex flex-col h-full">
-            <!-- Mobile header: date navigation on top, actions below -->
+            <!-- Mobile header: nav + date jump on top, full-width New post below -->
             <header class="flex shrink-0 flex-col gap-2 border-b-2 border-foreground bg-card px-4 py-3 lg:hidden">
-                <div class="flex items-center gap-2 pl-12">
-                    <Button variant="outline" size="icon" class="shrink-0" @click="navigate(-1)">
-                        <IconChevronLeft class="size-4" />
-                    </Button>
-                    <div class="flex-1">
+                <div class="flex items-center justify-between gap-2 pl-12">
+                    <div class="flex items-center gap-2">
+                        <Button variant="outline" size="icon" class="shrink-0" @click="navigate(-1)">
+                            <IconChevronLeft class="size-4" />
+                        </Button>
+                        <Button variant="outline" @click="goToToday">
+                            {{ $t('calendar.today') }}
+                        </Button>
+                        <Button variant="outline" size="icon" class="shrink-0" @click="navigate(1)">
+                            <IconChevronRight class="size-4" />
+                        </Button>
+                    </div>
+                    <div class="w-36 shrink-0">
                         <DatePicker v-model="selectedDate" :show-time="false" @update:model-value="(v: any) => goToDate(v)" />
                     </div>
-                    <Button variant="outline" size="icon" class="shrink-0" @click="navigate(1)">
-                        <IconChevronRight class="size-4" />
-                    </Button>
-                </div>
-                <div class="flex items-center gap-2">
-                    <Button variant="outline" class="shrink-0" @click="goToToday">
-                        {{ $t('calendar.today') }}
-                    </Button>
-                    <Link v-if="canCreatePost" :href="createPost.url()" class="flex-1">
-                        <Button class="w-full">{{ $t('calendar.new_post') }}</Button>
-                    </Link>
                 </div>
+                <Link v-if="canCreatePost" :href="createPost.url()" class="block">
+                    <Button class="w-full">{{ $t('calendar.new_post') }}</Button>
+                </Link>
             </header>
 
             <!-- Desktop header: nav · title · view switcher + new post -->