From 2215c47453c25380af9a2c4fc7bda165811fa272 Mon Sep 17 00:00:00 2001
From: 666ghj <670939375@qq.com>
Date: Sun, 14 Dec 2025 12:56:38 +0800
Subject: [PATCH] Refactor Step4Report component styles for improved
 transitions and layout

- Removed custom scrollbar styles to simplify the design and enhance performance.
- Updated transition effects for slide content to focus on opacity changes, improving visual feedback during content changes.
- Streamlined CSS by eliminating unnecessary properties, contributing to cleaner and more maintainable code.
---
 frontend/src/components/Step4Report.vue | 50 ++++---------------------
 1 file changed, 8 insertions(+), 42 deletions(-)

diff --git a/frontend/src/components/Step4Report.vue b/frontend/src/components/Step4Report.vue
index 31347d5..858276b 100644
--- a/frontend/src/components/Step4Report.vue
+++ b/frontend/src/components/Step4Report.vue
@@ -1380,26 +1380,6 @@ watch(() => props.reportId, (newId) => {
   border-top: 1px solid #E5E7EB;
   padding: 20px;
   background: #FFFFFF;
-  max-height: 500px;
-  overflow-y: auto;
-}
-
-.section-content::-webkit-scrollbar {
-  width: 6px;
-}
-
-.section-content::-webkit-scrollbar-track {
-  background: #F3F4F6;
-  border-radius: 3px;
-}
-
-.section-content::-webkit-scrollbar-thumb {
-  background: #D1D5DB;
-  border-radius: 3px;
-}
-
-.section-content::-webkit-scrollbar-thumb:hover {
-  background: #9CA3AF;
 }
 
 .content-body {
@@ -1500,35 +1480,21 @@ watch(() => props.reportId, (newId) => {
 
 /* Slide Content Transition */
 .slide-content-enter-active {
-  transition: all 0.4s ease-out;
-  overflow: hidden;
+  transition: opacity 0.3s ease-out;
 }
 
 .slide-content-leave-active {
-  transition: all 0.3s ease-in;
-  overflow: hidden;
-}
-
-.slide-content-enter-from {
-  max-height: 0;
-  opacity: 0;
-  padding: 0 20px;
-}
-
-.slide-content-enter-to {
-  max-height: 500px;
-  opacity: 1;
-}
-
-.slide-content-leave-from {
-  max-height: 500px;
-  opacity: 1;
+  transition: opacity 0.2s ease-in;
 }
 
+.slide-content-enter-from,
 .slide-content-leave-to {
-  max-height: 0;
   opacity: 0;
-  padding: 0 20px;
+}
+
+.slide-content-enter-to,
+.slide-content-leave-from {
+  opacity: 1;
 }
 
 /* Waiting Placeholder */