diff --git a/assets/style.css b/assets/style.css index ac9258e..47c4106 100644 --- a/assets/style.css +++ b/assets/style.css @@ -1253,9 +1253,19 @@ video.video-thumb.video-thumb-mini { .lightbox-file-dl { display: inline-block; } /* ── 20. 活动页路线地图(批 10)──────────────────────────────────────────── */ -.route-map-section { margin-top: 28px; } +/* 批 12:详情页标签页 —— 地图独占一页、尽量大;节点详情切到另一页 */ +.route-tabs { display: flex; gap: 8px; margin: 0 0 14px; } +.route-tab { + border: 1px solid var(--border); background: var(--surface); + border-radius: 999px; padding: 8px 18px; font-size: 14px; + cursor: pointer; color: var(--text-soft); +} +.route-tab:hover { border-color: var(--border-strong); color: var(--text); } +.route-tab.is-active { background: var(--accent); border-color: var(--accent); color: #fff; } +.route-panel[hidden] { display: none; } +.route-map-section { margin-top: 0; } .route-map { - height: 380px; + height: clamp(480px, 72vh, 860px); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; @@ -1290,5 +1300,6 @@ video.video-thumb.video-thumb-mini { } .route-legend-end { color: #ef4444; font-weight: 700; } @media (max-width: 640px) { - .route-map { height: 300px; } + .route-map { height: 62vh; } + .route-tab { padding: 7px 14px; font-size: 13px; } } diff --git a/templates/activities/show.php b/templates/activities/show.php index 68d2559..d8cab65 100644 --- a/templates/activities/show.php +++ b/templates/activities/show.php @@ -67,18 +67,87 @@ foreach (($realityNodes ?? []) as $rn) { } ?> -
-

🗺️ 行程路线

-
-

- 按时间顺序连出的执行节点路线(节点间虚线衔接),圆标在每段行程的中间,点它可打开对应节点。 - 红点 = 到达地。只有地名没坐标的地点会自动向高德查询定位,太偏僻的地名可能查不到。 -

-
+
+ + +
+
+
+
+

+ 按时间顺序连出的执行节点路线(节点间虚线衔接),圆标在每段行程的中间,点它可打开对应节点。 + 红点 = 到达地。只有地名没坐标的地点会自动向高德查询定位,太偏僻的地名可能查不到。 +

+
+
+ - -
-
-

📋 计划 ()

- -

暂无计划节点

- - - - - -
- -
-

🎬 实际 ()

- -

暂无执行节点

- - - - - -
-
- - -