feat(view): drop the 3D title band; pier name in 교각 목록; view menu under 부재 표시, origin under 색 기준

On wide screens the pier name moves to the 교각 목록 (name · type), the band is gone and the 3D view takes the full height.
A left stack holds 부재 표시 and then 시점; a right stack holds 색 기준 and then the ⓘ origin note. The active pier is scrolled
into view when it changes. Below 600 px the title is kept above the model and the stacks sit below it.

Co-Authored-By: Claude Haiku 5.5 <noreply@anthropic.com>
This commit is contained in:
ypshimandClaude Haiku 5.5 committed 2026-10-23 11:31:46 +09:00
1 parent e66c259d1e
commit 86a4b2fd80
3 files changed
+50 -39

No files matched your search

+21 -15
View File
@@ -74,27 +74,33 @@
<section class="panel viewer" id="viewer-block" aria-labelledby="viewer-title">
<div class="viewer-head">
<h2 id="viewer-title">교각 3D 뷰</h2>
</div>
<div id="canvas" class="canvas" aria-label="교각 3D 뷰"></div>
<div class="viewer-stack viewer-stack-left">
<details class="info-panel parts-info" id="parts-info">
<summary>부재 표시 <span id="parts-count" class="panel-state"></span></summary>
<div id="parts"></div>
</details>
<div class="views-menu" id="views-menu">
<button id="views-toggle" class="btn views-toggle" type="button" aria-haspopup="true" aria-expanded="false" aria-controls="views">시점</button>
<div id="views" class="views views-list" role="group" aria-label="시점" hidden></div>
</div>
<button id="origin-toggle" class="info-btn" type="button" aria-label="원점 표기" aria-expanded="false" aria-controls="origin">ⓘ</button>
<span id="origin" class="origin-pop muted" hidden></span>
</div>
<div id="canvas" class="canvas" aria-label="교각 3D 뷰"></div>
<details class="info-panel parts-info" id="parts-info">
<summary>부재 표시 <span id="parts-count" class="panel-state"></span></summary>
<div id="parts"></div>
</details>
<details class="info-panel color-info" id="color-info" hidden>
<summary>색 기준 <span id="color-state" class="panel-state"></span></summary>
<div class="rebar-color" id="rebar-color" role="group" aria-label="철근 색 기준">
<button type="button" data-color="role" aria-pressed="true">역할</button>
<button type="button" data-color="diameter" aria-pressed="false">직경</button>
<button type="button" data-color="member" aria-pressed="false">부재</button>
<ul id="rebar-legend" class="rebar-legend"></ul>
<div class="viewer-stack viewer-stack-right">
<details class="info-panel color-info" id="color-info" hidden>
<summary>색 기준 <span id="color-state" class="panel-state"></span></summary>
<div class="rebar-color" id="rebar-color" role="group" aria-label="철근 색 기준">
<button type="button" data-color="role" aria-pressed="true">역할</button>
<button type="button" data-color="diameter" aria-pressed="false">직경</button>
<button type="button" data-color="member" aria-pressed="false">부재</button>
<ul id="rebar-legend" class="rebar-legend"></ul>
</div>
</details>
<div class="origin-wrap">
<button id="origin-toggle" class="info-btn" type="button" aria-label="원점 표기" aria-expanded="false" aria-controls="origin">ⓘ</button>
<span id="origin" class="origin-pop muted" hidden></span>
</div>
</details>
</div>
</section>
<aside class="panel results" aria-labelledby="result-title">