From 19035fbeab1d8ab9f07e55fc9bfcab6e68258e19 Mon Sep 17 00:00:00 2001
From: Marcel <marcel@familienarchiv>
Date: Tue, 31 Mar 2026 20:42:37 +0200
Subject: [PATCH] fix(dashboard): move right column first in DOM for
 mobile-first upload zone

On small screens the upload zone now appears above recent docs.
lg:order-last keeps it visually on the right at desktop width.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 frontend/src/routes/+page.svelte | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/frontend/src/routes/+page.svelte b/frontend/src/routes/+page.svelte
index 15612d4f..cff0779d 100644
--- a/frontend/src/routes/+page.svelte
+++ b/frontend/src/routes/+page.svelte
@@ -98,13 +98,12 @@ const showRightColumn = $derived(data.canWrite || (data.incompleteDocs?.length ?
 	{#if data.isDashboard}
 		<DashboardResumeStrip />
 
-		<!-- Classic Split: left column (recent docs) + right column (upload + metadata queue) -->
+		<!-- Classic Split: right column first in DOM so it appears above recent docs on mobile.
+		     lg:order-last moves it back to the visual right on desktop. -->
 		<!-- No items-start — CSS Grid stretch default makes both columns equal height -->
 		<div class="mt-4 grid grid-cols-1 gap-4 {showRightColumn ? 'lg:grid-cols-[1fr_300px]' : ''}">
-			<DashboardRecentDocuments recentDocs={data.recentDocs ?? []} stats={data.stats} />
-
 			{#if showRightColumn}
-				<div data-testid="dashboard-right-column" class="flex h-full flex-col gap-4">
+				<div data-testid="dashboard-right-column" class="flex h-full flex-col gap-4 lg:order-last">
 					{#if data.canWrite}
 						<DropZone />
 					{/if}
@@ -116,6 +115,8 @@ const showRightColumn = $derived(data.canWrite || (data.incompleteDocs?.length ?
 					</div>
 				</div>
 			{/if}
+
+			<DashboardRecentDocuments recentDocs={data.recentDocs ?? []} stats={data.stats} />
 		</div>
 	{:else}
 		<DocumentList documents={data.documents ?? []} canWrite={data.canWrite} error={data.error} />