From 3e1ee7394d125afa2112d667cd3196c39de21341 Mon Sep 17 00:00:00 2001
From: lkddi <lkddi@163.com>
Date: Fri, 27 Feb 2026 01:52:12 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=EF=BC=9A=E7=95=99=E8=A8=80?=
 =?UTF-8?q?=E6=9D=BF=E9=A1=B5=E9=9D=A2=E5=B8=83=E5=B1=80=E5=8A=A0=E5=AE=BD?=
 =?UTF-8?q?=EF=BC=8C=E5=85=85=E5=88=86=E5=88=A9=E7=94=A8=E5=B1=8F=E5=B9=95?=
 =?UTF-8?q?=E5=AE=BD=E5=BA=A6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 左侧导航从 w-64 加宽至 w-72，现代圆角和阴影
- 主容器去掉 max-w-7xl 限制，改为 w-full px-6 充满屏幕
- 右侧列表去掉 max-w-4xl 约束，flex-1 自动铺满剩余空间
---
 resources/views/guestbook/index.blade.php | 23 ++++++++++++-----------
 1 file changed, 12 insertions(+), 11 deletions(-)

diff --git a/resources/views/guestbook/index.blade.php b/resources/views/guestbook/index.blade.php
index a7faeea..d36b051 100644
--- a/resources/views/guestbook/index.blade.php
+++ b/resources/views/guestbook/index.blade.php
@@ -81,12 +81,12 @@
         </div>
 
         {{-- 主体内容区 --}}
-        <div class="flex max-w-7xl mx-auto mt-4 px-4 sm:px-6 lg:px-8">
+        <div class="flex w-full mt-4 px-6 gap-6">
 
             {{-- 左侧：分类导航 --}}
             <div
-                class="w-64 bg-white border border-gray-200 rounded-lg shrink-0 hidden md:flex flex-col mb-10 self-start sticky top-20">
-                <div class="p-6 flex-1">
+                class="w-72 bg-white border border-gray-100 rounded-2xl shadow-sm shrink-0 hidden md:flex flex-col mb-10 self-start sticky top-20">
+                <div class="p-5 flex-1">
                     {{-- 新建留言按钮 --}}
                     <button
                         @click="showWriteForm = !showWriteForm; if(showWriteForm) setTimeout(() => $refs.textBody.focus(), 100)"
@@ -117,8 +117,8 @@
             </div>
 
             {{-- 右侧：留言流列表 --}}
-            <main class="flex-1 p-4 sm:p-0 md:pl-6 pb-20">
-                <div class="max-w-4xl mx-auto space-y-4">
+            <main class="flex-1 pb-20 min-w-0">
+                <div class="space-y-4">
 
                     @forelse($messages as $msg)
                         @php
@@ -163,7 +163,7 @@
                             </div>
 
                             <div
-                                class="text-gray-800 leading-relaxed text-sm whitespace-pre-wrap {{ $isSecret ? 'bg-pink-50 p-3 rounded-lg border border-pink-100' : 'bg-gray-50 p-3 rounded-lg border border-gray-100' }}">
+                                class="text-gray-700 leading-loose text-[15px] whitespace-pre-wrap {{ $isSecret ? 'bg-pink-50/50 p-4 rounded-xl border border-pink-100/50' : 'mt-2' }}">
                                 {!! nl2br(e($msg->text_body)) !!}
                             </div>
 
@@ -182,13 +182,14 @@
                             @endif
                         </div>
                     @empty
-                        <div class="bg-white rounded-xl shadow-sm border border-gray-200 p-12 text-center">
-                            <span class="text-4xl">📭</span>
-                            <h3 class="mt-4 text-lg font-medium text-gray-900">暂无信件</h3>
-                            <p class="mt-2 text-sm text-gray-500">这里是空空如也的荒原。</p>
+                        <div
+                            class="bg-white rounded-2xl shadow-[0_8px_30px_rgb(0,0,0,0.04)] border border-gray-100/50 p-16 text-center flex flex-col items-center justify-center min-h-[400px]">
+                            <span class="text-6xl drop-shadow-sm mb-6">📭</span>
+                            <h3 class="text-xl font-bold text-gray-800 tracking-wide">暂无信件</h3>
+                            <p class="mt-3 text-gray-400">这里是空空如也的荒原。</p>
                             <button
                                 @click="showWriteForm = true; towho = ''; setTimeout(() => $refs.textBody.focus(), 100)"
-                                class="mt-4 text-indigo-600 font-bold hover:underline">
+                                class="mt-8 bg-indigo-50 hover:bg-indigo-100 text-indigo-600 font-bold py-2.5 px-6 rounded-xl transition-colors border border-indigo-100/50">
                                 来抢沙发留言吧！
                             </button>
                         </div>