From 30289369a10aa6de93097f4bf705e6da4e806627 Mon Sep 17 00:00:00 2001
From: zhangrui <zr15972328402@163.com>
Date: Sat, 29 Aug 2026 17:01:36 +0800
Subject: [PATCH] =?UTF-8?q?=E7=B3=BB=E7=BB=9F=E9=80=80=E5=87=BA=E6=98=BE?=
 =?UTF-8?q?=E7=A4=BA=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../views/layouts/v4/baseLayout.html          | 68 +++++++++++++++++--
 1 file changed, 61 insertions(+), 7 deletions(-)

diff --git a/src/main/resources/views/layouts/v4/baseLayout.html b/src/main/resources/views/layouts/v4/baseLayout.html
index 2350c7f..32e5ca0 100644
--- a/src/main/resources/views/layouts/v4/baseLayout.html
+++ b/src/main/resources/views/layouts/v4/baseLayout.html
@@ -412,6 +412,8 @@
             .v4-header {
                 background-color: rgb(0, 109, 185);
                 box-shadow: 0 2px 10px rgba(0, 109, 185, 0.3);
+                box-sizing: border-box;
+                padding: 0 16px;
                 height: 64px;
                 display: flex;
                 align-items: center;
@@ -431,6 +433,8 @@
                 padding: 10px;
                 width: 250px;
                 justify-content: center;
+                box-sizing: border-box;
+                flex-shrink: 0;
             }
 
             .v4-logo {
@@ -440,9 +444,10 @@
 
             .v4-nav {
                 display: flex;
-                gap: 40px;
+                gap: clamp(12px, 2vw, 40px);
                 align-items: center;
                 height: 100%;
+                min-width: 0;
             }
 
             .v4-nav-item {
@@ -479,9 +484,9 @@
             .v4-user-section {
                 display: flex;
                 align-items: center;
-                gap: 24px;
+                gap: 12px;
                 height: 100%;
-                max-width: 310px;
+                margin-left: 16px;
                 flex-shrink: 0;
             }
 
@@ -534,6 +539,7 @@
                 gap: 12px;
                 padding: 0 12px;
                 height: 100%;
+                min-width: 0;
                 border-radius: 0;
                 cursor: pointer;
                 transition: background-color 0.2s;
@@ -587,6 +593,9 @@
                 font-weight: 500;
                 color: #ffffff;
                 white-space: nowrap;
+                max-width: 180px;
+                overflow: hidden;
+                text-overflow: ellipsis;
             }
 
             .v4-logout {
@@ -594,12 +603,14 @@
                 cursor: pointer;
                 padding: 0 14px;
                 height: 100%;
+                flex-shrink: 0;
                 border-radius: 0;
                 transition: all 0.2s ease;
                 display: flex;
                 align-items: center;
                 gap: 6px;
                 white-space: nowrap;
+                text-decoration: none;
             }
 
             .v4-logout:hover {
@@ -615,19 +626,62 @@
                 display: flex;
                 align-items: center;
                 height: 100%;
+                min-width: 0;
+                flex: 1;
+            }
+
+            @media (max-width: 1440px) {
+                .v4-logo-container {
+                    width: 210px;
+                }
+
+                .v4-nav {
+                    gap: 16px;
+                }
+
+                .v4-nav-item {
+                    padding: 0 10px;
+                }
+
+                .v4-user-section {
+                    gap: 8px;
+                    margin-left: 8px;
+                }
+
+                .v4-user-name {
+                    max-width: 140px;
+                }
+
+                .v4-voice-menu,
+                .v4-logout {
+                    padding-left: 10px;
+                    padding-right: 10px;
+                }
+            }
+
+            @media (max-width: 1280px) {
+                .v4-user-info {
+                    display: none;
+                }
             }
 
             @media (max-width: 1024px) {
                 .v4-nav {
-                    gap: 24px;
+                    gap: 12px;
                 }
 
-                .v4-user-info {
-                    display: none;
+                .v4-logo-container {
+                    width: 180px;
+                }
+
+                .v4-nav-item {
+                    padding: 0 6px;
+                    column-gap: 6px;
+                    font-size: 14px;
                 }
 
                 .v4-user-section {
-                    gap: 16px;
+                    gap: 6px;
                 }
             }