From 119edef5b9cda2f30d3ea62bc072a53f9a049e18 Mon Sep 17 00:00:00 2001
From: Paulo Castellano <paulo@castellanos.llc>
Date: Sat, 18 Jul 2026 09:28:07 -0300
Subject: [PATCH] =?UTF-8?q?fix(posts):=20mobile=20editor=20=E2=80=94=20tal?=
 =?UTF-8?q?ler=20switcher=20tabs=20and=20a=20wider=20Post=20now=20button?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Match the switcher tab height to the sidebar trigger (h-10), and let the primary
publish button fill the footer (flex-1) on mobile while staying auto-width on desktop.
---
 resources/js/components/posts/editor/PostEditorActions.vue | 7 ++++---
 .../js/components/posts/editor/PostEditorMobileNav.vue     | 2 +-
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/resources/js/components/posts/editor/PostEditorActions.vue b/resources/js/components/posts/editor/PostEditorActions.vue
index c422833e..9c3abafc 100644
--- a/resources/js/components/posts/editor/PostEditorActions.vue
+++ b/resources/js/components/posts/editor/PostEditorActions.vue
@@ -50,8 +50,8 @@ const scheduledAtError = computed(() => errors.value.scheduled_at);
         {{ $t('posts.edit.unschedule_cta') }}
     </Button>
 
-    <div v-else-if="!isReadOnly && canEdit" class="flex flex-col items-end gap-1">
-        <div class="flex items-center gap-2">
+    <div v-else-if="!isReadOnly && canEdit" class="flex w-full flex-col gap-1 lg:w-auto lg:items-end">
+        <div class="flex w-full items-center gap-2 lg:w-auto">
             <TooltipProvider>
                 <Tooltip>
                     <TooltipTrigger as-child>
@@ -95,9 +95,10 @@ const scheduledAtError = computed(() => errors.value.scheduled_at);
 
                 <Tooltip>
                     <TooltipTrigger as-child>
-                        <span tabindex="0">
+                        <span tabindex="0" class="flex-1 lg:flex-none">
                             <Button
                                 type="button"
+                                class="w-full lg:w-auto"
                                 :disabled="isPostActionDisabled"
                                 @click="emit('submit', hasPickedTime ? PostStatus.Scheduled : PostStatus.Publishing)"
                             >
diff --git a/resources/js/components/posts/editor/PostEditorMobileNav.vue b/resources/js/components/posts/editor/PostEditorMobileNav.vue
index e4469647..2ac6c8fb 100644
--- a/resources/js/components/posts/editor/PostEditorMobileNav.vue
+++ b/resources/js/components/posts/editor/PostEditorMobileNav.vue
@@ -42,7 +42,7 @@ const headerHidden = computed(() => props.status !== PostStatus.Scheduled);
                 :key="item.key"
                 type="button"
                 :data-testid="`editor-nav-${item.key}`"
-                class="shrink-0 rounded-lg border-2 px-3 py-1.5 text-sm font-semibold transition-colors"
+                class="inline-flex h-10 shrink-0 items-center rounded-lg border-2 px-3 text-sm font-semibold transition-colors"
                 :class="activeView === item.key
                     ? 'border-foreground bg-violet-100 text-foreground'
                     : 'border-transparent text-foreground/60 hover:text-foreground'"