Merge branch 'main' of https://git.devillusion.asia/mcallzbl/LingTropy

lingtropy-client/src/renderer/screens/TextRewritingTool.vue

@@ -104,6 +104,14 @@
               </div>
               <span class="model-badge">{{ currentModel }}</span>
               <span class="count-badge">{{ rewrittenText.length }} 个结果</span>
+              <button 
+                @click="toggleLayout" 
+                class="layout-toggle-button"
+                :title="settings.layoutMode === 'list' ? '切换到网格视图' : '切换到列表视图'"
+              >
+                <span v-if="settings.layoutMode === 'list'" >▦</span>
+                <span v-else>☰</span>
+              </button>
             </div>
           </div>
 
@@ -362,12 +370,80 @@ const showToast = (message) => {
   overflow: hidden;
 }
 
+/* 背景装饰 */
+.background-decoration {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  pointer-events: none;
+  z-index: -1;
+  overflow: hidden;
+}
+
+.bg-circle {
+  position: absolute;
+  border-radius: 50%;
+  opacity: 0.5;
+  filter: blur(60px);
+}
+
+.bg-circle-1 {
+  width: 400px;
+  height: 400px;
+  background: linear-gradient(45deg, rgba(46, 204, 113, 0.3), rgba(52, 152, 219, 0.3));
+  top: -100px;
+  left: -100px;
+  animation: float 15s ease-in-out infinite alternate;
+}
+
+.bg-circle-2 {
+  width: 600px;
+  height: 600px;
+  background: linear-gradient(45deg, rgba(155, 89, 182, 0.2), rgba(41, 128, 185, 0.2));
+  bottom: -200px;
+  right: -200px;
+  animation: float 20s ease-in-out infinite alternate-reverse;
+}
+
+.bg-circle-3 {
+  width: 300px;
+  height: 300px;
+  background: linear-gradient(45deg, rgba(241, 196, 15, 0.2), rgba(231, 76, 60, 0.2));
+  top: 40%;
+  left: 60%;
+  animation: float 18s ease-in-out infinite alternate;
+}
+
+.bg-dots {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-image: radial-gradient(rgba(0, 0, 0, 0.1) 1px, transparent 1px);
+  background-size: 30px 30px;
+  opacity: 0.3;
+}
+
+@keyframes float {
+  0% {
+    transform: translate(0, 0);
+  }
+  100% {
+    transform: translate(50px, 50px);
+  }
+}
+
 .text-rewriter-layout {
   display: flex;
   gap: 24px;
   width: 100%;
   max-width: 1800px;
   height: calc(100vh - 40px);
+  position: relative;
+  z-index: 1;
 }
 
 /* 左侧输入区域 */
@@ -383,6 +459,8 @@ const showToast = (message) => {
   flex-direction: column;
   overflow-y: auto;
   transition: all 0.3s ease;
+  backdrop-filter: blur(10px);
+  background-color: rgba(255, 255, 255, 0.95);
 }
 
 /* 右侧结果区域 */
@@ -397,6 +475,8 @@ const showToast = (message) => {
   flex-direction: column;
   overflow: hidden;
   transition: all 0.3s ease;
+  backdrop-filter: blur(10px);
+  background-color: rgba(255, 255, 255, 0.95);
 }
 
 .result-header-bar {
@@ -932,6 +1012,25 @@ const showToast = (message) => {
   transform: translateX(-50%) translateY(0);
 }
 
+/* 布局切换按钮 */
+.layout-toggle-button {
+  background-color: #f0f0f0;
+  border: none;
+  border-radius: 50%;
+  width: 32px;
+  height: 32px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  transition: all 0.2s ease;
+}
+
+.layout-toggle-button:hover {
+  background-color: #e0e0e0;
+  transform: scale(1.1);
+}
+
 /* 响应式设计 */
 @media (max-width: 1200px) {
   .text-rewriter-layout {