From c44cb13d23b4fb452e37237d63955852ce39274f Mon Sep 17 00:00:00 2001
From: 666ghj <670939375@qq.com>
Date: Thu, 11 Dec 2025 19:16:10 +0800
Subject: [PATCH] Refactor Step2EnvSetup.vue for improved hot topics display
 and timeline styling

- Updated hot topics section to display all topics without truncation, enhancing visibility.
- Adjusted timeline marker styling for better alignment and visual consistency, improving overall layout.
---
 frontend/src/components/Step2EnvSetup.vue | 19 +++++++------------
 1 file changed, 7 insertions(+), 12 deletions(-)

diff --git a/frontend/src/components/Step2EnvSetup.vue b/frontend/src/components/Step2EnvSetup.vue
index 8e7457d..c804f0a 100644
--- a/frontend/src/components/Step2EnvSetup.vue
+++ b/frontend/src/components/Step2EnvSetup.vue
@@ -191,12 +191,9 @@
             <div class="topics-section">
               <span class="box-label">初始热点话题</span>
               <div class="hot-topics-grid">
-                <span v-for="topic in simulationConfig.event_config.hot_topics.slice(0, 8)" :key="topic" class="hot-topic-tag">
+                <span v-for="topic in simulationConfig.event_config.hot_topics" :key="topic" class="hot-topic-tag">
                   # {{ topic }}
                 </span>
-                <span v-if="simulationConfig.event_config.hot_topics.length > 8" class="hot-topic-more">
-                  +{{ simulationConfig.event_config.hot_topics.length - 8 }}
-                </span>
               </div>
             </div>
 
@@ -1449,18 +1446,16 @@ onUnmounted(() => {
 
 .timeline-item {
   position: relative;
-  padding-left: 16px;
+  padding-left: 20px;
 }
 
 .timeline-marker {
   position: absolute;
-  left: -5px;
-  top: 6px;
-  width: 8px;
-  height: 8px;
-  background: #CCC;
-  border-radius: 50%;
-  border: 2px solid #FFF;
+  left: 0;
+  top: 14px;
+  width: 12px;
+  height: 2px;
+  background: #DDD;
 }
 
 .timeline-content {