refactor(B08·B09): 마무리 — 모달 폭 단 960 · 램프 ✓ 같이 · 구조물도 머리 = 패널 머리 · 죽은 CSS 지움 (PLAN 553-3)

- 이정표 모달 폭 = 부품 폭 단 · 성공 램프 = ✓(색만으로 안 가름) · 낡은 시험 문구 맞춤

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>

B08_Quantity/B08_Quantity_UI_Drawing.ts

@@ -17,6 +17,7 @@ import "./B08_Quantity_UI_Drawing.css";
 import { ui_locales, currentLanguageIndex } from "@ui/ui_template_locale";
 import { createText } from "@ui/ui_template_text";
 import { openModal } from "@ui/ui_template_modal";
+import { createPanelHead } from "@ui/ui_template_panel_head";
 import { showToast } from "@ui/ui_template_elements";
 import { PART_OF, projectItems, withCopyValues } from "@ui/ui_template_item_picker_project";
 import type { EditView } from "@ui/ui_template_item_picker_edit";
@@ -106,20 +107,18 @@ function comboSection(
   const section = document.createElement("section");
   section.className = "b08-sheets__combo";
   section.dataset.b08Combo = combo.id;
-  const title = document.createElement("h4");
-  title.className = "b08-sheets__title";
-  title.textContent = name;
-  title.title = summaryTooltip(combo.item);
-  section.append(title);
+  const head = createPanelHead({
+    title: name,
+    sub: copy ? L("B08_Quantity_Sheets_FromCopy") : undefined,
+    level: 4,
+  });
+  head.title.title = summaryTooltip(combo.item);
+  section.append(head.root);
   if (!copy) {
     section.append(note(L("B08_Quantity_Drawing_Missing")));
     return section;
   }
   const source = sourceOf(request.projectId, copy.폴더);
-  const from = document.createElement("span");
-  from.className = "b08-sheets__from";
-  from.textContent = L("B08_Quantity_Sheets_FromCopy");
-  title.append(from);
   if (!copy.부분.includes("도면")) section.append(note(L("B08_Quantity_Drawing_NoDrawing")));
   const load = (): void => void cards.load({ id: copy.폴더, label: name });
   // 카드 안 [저장]은 없음(자료 자리에 write 없음) — [수정]만 사본 편집 화면으로(163-3)

B08_Quantity/B08_Quantity_UI_Milestone.css

@@ -30,17 +30,6 @@
   color: var(--color-text-secondary);
 }
 
-.b08-milestone__head {
-  display: flex;
-  flex-wrap: wrap;
-  align-items: flex-end;
-  gap: var(--spacing-8) var(--spacing-16);
-}
-
-.b08-milestone__head > .ui-field {
-  min-width: 160px;
-}
-
 .b08-milestone__image {
   max-width: 100%;
   max-height: 70vh;
@@ -180,8 +169,8 @@
 }
 
 /* 등록 · 연결선 모달(244-13) — 더 큰 창 · 2열 칸 */
+/* 폭 = 부품 모달 폭 단(960) · 키 큰 창만 여기 */
 .ui-modal.b08-milestone__modal {
-  width: min(960px, 94vw);
   --modal-max: 90vh;
 }
 
@@ -268,5 +257,11 @@
 }
 
 [data-b08-milestone="table"] td.b08-milestone__lamp.is-linked::before {
-  background: var(--color-success);
+  content: "✓"; /* 성공 램프는 ✓ 같이(색만으로 안 가름) */
+  background: none;
+  color: var(--color-success);
+  font-size: 9px;
+  font-weight: var(--font-weight-bold);
+  line-height: 8px;
+  text-align: center;
 }

B08_Quantity/B08_Quantity_UI_Milestone_LegModal.ts

@@ -124,6 +124,7 @@ function openMidLeg(projectId: string): void {
     title: "구간 — 시점 → 중점",
     closeLabel: "닫기",
     dialogClass: "b08-milestone__modal",
+    width: "960px",
     mount: (body, close, actions) => {
       const road = createSelectField({
         label: "도로 구분",
@@ -172,6 +173,7 @@ export function openLegInfo(projectId: string, from: string): void {
     title: `구간 — ${seg.text}`,
     closeLabel: "닫기",
     dialogClass: "b08-milestone__modal",
+    width: "960px",
     mount: (body, close, actions) => {
       const legsOf = (): Leg[] => ownerOf(liveMilestone(projectId), from)?.legs ?? [];
       const isBase = liveMilestone(projectId).bases.some((b) => b.id === from);

B08_Quantity/B08_Quantity_UI_Milestone_Modal.ts

@@ -113,6 +113,7 @@ export function openPlaceModal(
     title,
     closeLabel: "닫기",
     dialogClass: "b08-milestone__modal",
+    width: "960px",
     mount: (body, close, actions) => {
       let kind: "route" | "base" = editBase ? "base" : "route";
       const sort = createSelectField({
@@ -263,6 +264,7 @@ export function openSiteInfo(projectId: string): void {
     title: "시점 · 중점",
     closeLabel: "닫기",
     dialogClass: "b08-milestone__modal",
+    width: "960px",
     mount: (body, close, actions) => {
       // 중점 측점 · 시점 → 중점 도로(좌측 패널 카드에서 옮김 · 244-6) · 보이고 받는 것만 km(255-1)
       const data = liveMilestone(projectId);

B08_Quantity/B08_Quantity_UI_Page.css

@@ -72,7 +72,13 @@ html.is-bm-route .b08-quantity > .b08-quantity__tabs:first-child {
 
 /* 247-1 — 모두 연결 = 같은 램프 초록 */
 [data-b08-summary="table"] td.b08-summary__lamp.is-linked::before {
-  background: var(--color-success);
+  content: "✓"; /* 성공 램프는 ✓ 같이(색만으로 안 가름) */
+  background: none;
+  color: var(--color-success);
+  font-size: 9px;
+  font-weight: var(--font-weight-bold);
+  line-height: 8px;
+  text-align: center;
 }
 
 /* 좌측 패널 옵션(122) — 연암 · 경암 두 칸 나란히 · 설명 한 줄 */

B09_Estimation/B09_Estimation_UI_Page.css

@@ -155,7 +155,13 @@ html.is-bm-route .b09-estimation > .b09-estimation__tabs:first-child {
 }
 
 .b09-estimation .ui-data-table__table tbody td.b09-bill__lamp.is-linked::before {
-  background: var(--color-success);
+  content: "✓"; /* 성공 램프는 ✓ 같이(색만으로 안 가름) */
+  background: none;
+  color: var(--color-success);
+  font-size: 9px;
+  font-weight: var(--font-weight-bold);
+  line-height: 8px;
+  text-align: center;
 }
 
 /* 184-3 설계내역서 고친 칸 — 자동 값과 다른 칸(풍선 = 자동 값) */

resources/tester/test_244_13_b08_milestone_place_leg.py

@@ -282,7 +282,7 @@ def test_화면_등록_모달_연결선_모달():
     css = _read(B08 + "UI_Milestone.css")
     # ① 큰 창 · 2열 · 분류 · 항목 목록 · 소재지 · 직접 입력 없음 · 다음 지도
     assert 'dialogClass: "b08-milestone__modal"' in modal
-    assert ".ui-modal.b08-milestone__modal {\n  width: min(960px, 94vw);" in css
+    assert 'width: "960px"' in modal  # 폭 = 부품 모달 폭 단
     assert "grid-template-columns: 1fr 1fr;" in css
     assert "children: [sort.root, first.item.root, name.root, first.dest.root]" in modal
     assert (

resources/tester/test_247_1_b08_summary_green_lamp.py

@@ -102,6 +102,10 @@ console.log(JSON.stringify([text(cell(0)), text(cell(1))]));
 def test_초록_성공_토큰():
     css = (ROOT / "B08_Quantity" / "B08_Quantity_UI_Page.css").read_text(encoding="utf-8")
     m = re.search(r"td\.b08-summary__lamp\.is-linked::before\s*\{([^}]*)\}", css)
-    assert m and re.search(r"background:\s*var\(--color-success\)", m.group(1))
+    assert (
+        m
+        and re.search(r"color:\s*var\(--color-success\)", m.group(1))
+        and 'content: "✓"' in m.group(1)
+    )
     theme = (ROOT / "ui_template" / "ui_template_theme.css").read_text(encoding="utf-8")
     assert len(re.findall(r"--color-success:\s*#", theme)) >= 2  # 밝음 · 어두움