From eb0a11b0ef19c3caac918e0ffc17e1974d822ab0 Mon Sep 17 00:00:00 2001
From: jingrow <support@jingrow.com>
Date: Wed, 21 Jan 2026 16:26:06 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E8=83=8C=E6=99=AF=E9=A1=B5?=
 =?UTF-8?q?=E9=9D=A2=E5=8F=AA=E6=9C=89=E4=B8=8A=E4=BC=A0=E5=9B=BE=E7=89=87?=
 =?UTF-8?q?=E5=90=8E=E6=89=8D=E6=98=BE=E7=A4=BA=E5=8F=B3=E8=BE=B9=E6=A0=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/tools/add_background/add_background.vue | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/src/views/tools/add_background/add_background.vue b/src/views/tools/add_background/add_background.vue
index 5699a2a..7f3f9a8 100644
--- a/src/views/tools/add_background/add_background.vue
+++ b/src/views/tools/add_background/add_background.vue
@@ -19,7 +19,7 @@
       @change="handleFileSelect"
     />
     
-    <div class="page-header">
+    <div class="page-header" :class="{ 'has-sidebar': uploadedImage }">
       <h2>{{ t('Add Background') }}</h2>
       <!-- Color Shades in Header Center -->
       <div v-if="uploadedImage" class="header-color-shades">
@@ -53,7 +53,7 @@
       </div>
     </div>
 
-    <div class="page-content">
+    <div class="page-content" :class="{ 'has-sidebar': uploadedImage }">
       <div class="tool-container">
         <div class="main-area">
           <div class="upload-section">
@@ -1352,6 +1352,10 @@ const removeHistoryItem = (index: number) => {
   width: 100%;
   padding: 12px 36px;
   gap: 16px;
+  transition: padding-right 0.3s ease;
+}
+
+.page-header.has-sidebar {
   padding-right: 316px;
 }
 
@@ -1418,6 +1422,10 @@ const removeHistoryItem = (index: number) => {
   flex-direction: column;
   overflow: hidden;
   min-height: 0;
+  transition: padding-right 0.3s ease;
+}
+
+.page-content.has-sidebar {
   padding-right: 296px; /* Make space for right sidebar + padding */
 }