From 4b87af80a8a96e87415780d3de59776286d94e26 Mon Sep 17 00:00:00 2001
From: Peter Foster <peter@foster.net>
Date: Thu, 22 Jan 2026 19:33:42 +0000
Subject: [PATCH] fix: Improve UI spacing and remove duplicate logo on auth
 pages
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Create dedicated AuthLayout for login/register pages without navbar
- Tighten file list spacing on Check page for better density
- Reduce padding, margins, and icon sizes in file list items
- Make file names smaller and truncate long names

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
---
 .../Components/Layout/AuthLayout.razor        | 13 +++++++++++
 .../Components/Pages/Account/Login.razor      |  6 ++---
 .../Components/Pages/Account/Register.razor   |  6 ++---
 src/RealCV.Web/Components/Pages/Check.razor   | 22 +++++++++----------
 src/RealCV.Web/wwwroot/app.css                |  8 +++++--
 5 files changed, 36 insertions(+), 19 deletions(-)
 create mode 100644 src/RealCV.Web/Components/Layout/AuthLayout.razor

diff --git a/src/RealCV.Web/Components/Layout/AuthLayout.razor b/src/RealCV.Web/Components/Layout/AuthLayout.razor
new file mode 100644
index 0000000..56b0e3d
--- /dev/null
+++ b/src/RealCV.Web/Components/Layout/AuthLayout.razor
@@ -0,0 +1,13 @@
+@inherits LayoutComponentBase
+
+<div class="d-flex flex-column min-vh-100">
+    <main class="flex-grow-1">
+        @Body
+    </main>
+</div>
+
+<div id="blazor-error-ui" class="alert alert-danger fixed-bottom m-3" style="display: none;">
+    An unhandled error has occurred.
+    <a href="" class="alert-link reload">Reload</a>
+    <button type="button" class="btn-close float-end dismiss" aria-label="Close"></button>
+</div>
diff --git a/src/RealCV.Web/Components/Pages/Account/Login.razor b/src/RealCV.Web/Components/Pages/Account/Login.razor
index ed297f8..c065c29 100644
--- a/src/RealCV.Web/Components/Pages/Account/Login.razor
+++ b/src/RealCV.Web/Components/Pages/Account/Login.razor
@@ -1,6 +1,6 @@
 @page "/account/login"
 @using RealCV.Web.Components.Layout
-@layout MainLayout
+@layout AuthLayout
 
 @using Microsoft.AspNetCore.Identity
 @using RealCV.Infrastructure.Identity
@@ -14,9 +14,9 @@
     <!-- Left side - Form -->
     <div class="auth-form-side">
         <div class="auth-form-wrapper">
-            <div class="text-center mb-4">
+            <div class="text-center mb-5">
                 <a href="/">
-                    <img src="images/RealCV_Logo_Transparent.png" alt="RealCV" class="auth-logo" />
+                    <img src="images/RealCV_Logo_Transparent.png" alt="RealCV" class="auth-logo" style="height: 60px;" />
                 </a>
             </div>
 
diff --git a/src/RealCV.Web/Components/Pages/Account/Register.razor b/src/RealCV.Web/Components/Pages/Account/Register.razor
index 72ea299..814ab0f 100644
--- a/src/RealCV.Web/Components/Pages/Account/Register.razor
+++ b/src/RealCV.Web/Components/Pages/Account/Register.razor
@@ -1,6 +1,6 @@
 @page "/account/register"
 @using RealCV.Web.Components.Layout
-@layout MainLayout
+@layout AuthLayout
 @rendermode InteractiveServer
 
 @using Microsoft.AspNetCore.Identity
@@ -16,9 +16,9 @@
     <!-- Left side - Form -->
     <div class="auth-form-side">
         <div class="auth-form-wrapper">
-            <div class="text-center mb-4">
+            <div class="text-center mb-5">
                 <a href="/">
-                    <img src="images/RealCV_Logo_Transparent.png" alt="RealCV" class="auth-logo" />
+                    <img src="images/RealCV_Logo_Transparent.png" alt="RealCV" class="auth-logo" style="height: 60px;" />
                 </a>
             </div>
 
diff --git a/src/RealCV.Web/Components/Pages/Check.razor b/src/RealCV.Web/Components/Pages/Check.razor
index c0ac604..06da85f 100644
--- a/src/RealCV.Web/Components/Pages/Check.razor
+++ b/src/RealCV.Web/Components/Pages/Check.razor
@@ -151,7 +151,7 @@
                                     {
                                         <div class="file-list-item">
                                             <div class="d-flex align-items-center">
-                                                <div class="file-type-icon me-3 @(file.Name.EndsWith(".pdf", StringComparison.OrdinalIgnoreCase) ? "pdf" : "docx")">
+                                                <div class="file-type-icon me-2 @(file.Name.EndsWith(".pdf", StringComparison.OrdinalIgnoreCase) ? "pdf" : "docx")">
                                                     @if (file.Name.EndsWith(".pdf", StringComparison.OrdinalIgnoreCase))
                                                     {
                                                         <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" fill="currentColor" viewBox="0 0 16 16">
@@ -165,9 +165,9 @@
                                                         </svg>
                                                     }
                                                 </div>
-                                                <div class="flex-grow-1">
-                                                    <p class="mb-0 fw-medium">@file.Name</p>
-                                                    <small class="text-muted">@FormatFileSize(file.Size)</small>
+                                                <div class="flex-grow-1 min-width-0">
+                                                    <p class="mb-0 fw-medium small text-truncate">@file.Name</p>
+                                                    <small class="text-muted" style="font-size: 0.75rem;">@FormatFileSize(file.Size)</small>
                                                 </div>
                                             </div>
                                             <button class="btn btn-sm btn-outline-danger" @onclick="() => RemoveFile(file)">
@@ -272,22 +272,22 @@
         align-items: center;
         justify-content: space-between;
         border: 1px solid var(--realcv-gray-200);
-        border-radius: 12px;
-        padding: 1rem;
-        margin-bottom: 0.75rem;
+        border-radius: 8px;
+        padding: 0.5rem 0.75rem;
+        margin-bottom: 0.375rem;
         background: var(--realcv-bg-surface);
         transition: all 0.2s ease;
     }
 
     .file-list-item:hover {
         border-color: var(--realcv-primary);
-        box-shadow: 0 4px 12px rgba(59, 111, 212, 0.08);
+        box-shadow: 0 2px 8px rgba(59, 111, 212, 0.08);
     }
 
     .file-type-icon {
-        width: 40px;
-        height: 40px;
-        border-radius: 10px;
+        width: 32px;
+        height: 32px;
+        border-radius: 6px;
         display: flex;
         align-items: center;
         justify-content: center;
diff --git a/src/RealCV.Web/wwwroot/app.css b/src/RealCV.Web/wwwroot/app.css
index abece24..763cc2b 100644
--- a/src/RealCV.Web/wwwroot/app.css
+++ b/src/RealCV.Web/wwwroot/app.css
@@ -1051,8 +1051,12 @@ h1:focus {
 }
 
 .auth-logo {
-    height: 48px;
-    margin-bottom: 1rem;
+    height: 60px;
+    transition: opacity var(--realcv-transition);
+}
+
+.auth-logo:hover {
+    opacity: 0.85;
 }
 
 .auth-title {