ahnyongjooandClaude Sonnet 5.5
964a841de1
- Code\rebar_pipeline, review_pipeline, pier-program을 정션에서 실제 폴더로 전환 - Code\rhino_mcp 및 CLAUDE_rhino배경.md 추가, .mcp.json은 PYTHONPATH로 새 위치 사용 - pier-program 내부 .git 제거(이력은 backup\pier-program_20261028.bundle에 보관) - worktree 가이드 반영(CLAUDE.local.md, HANDOFF.md) - D:\Rhino-MCP 경로 참조를 새 위치로 치환 Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
70 lines
7.4 KiB
CSS
70 lines
7.4 KiB
CSS
/* Prism for the whole web app (stage D, 2026-10-19): app shell + the plain HTML elements of the older screens, written with the tokens of
|
|
prism.css (generated from the design mockup). The stage-B/C screens use the scoped .prism components on top of this. Decisions UX1-UX6:
|
|
Prism replaces R8, status colours are Prism's with marks and words (never colour alone), Pretendard is bundled, no dark theme test. */
|
|
html { background: var(--prism-bg-canvas); }
|
|
body { margin: 0; background: var(--prism-bg-canvas); color: var(--prism-text-body); font-family: var(--prism-font); font-size: var(--prism-type-body-sm);
|
|
line-height: var(--prism-lh-body); font-variant-numeric: tabular-nums; }
|
|
* { box-sizing: border-box; }
|
|
a { color: var(--prism-text-heading); }
|
|
:focus-visible { outline: var(--prism-focus-ring) solid var(--prism-comp-line-strong); outline-offset: var(--prism-focus-offset); }
|
|
|
|
/* shell */
|
|
header.top { height: var(--prism-comp-header-height); background: var(--prism-bg-card); border-bottom: var(--prism-stroke-hairline) solid var(--prism-comp-line);
|
|
display: flex; align-items: center; gap: var(--prism-space-300); padding: 0 var(--prism-space-300); position: sticky; top: 0; z-index: var(--prism-z-sticky); }
|
|
header.top .brand { display: flex; align-items: center; gap: var(--prism-space-100); font-weight: 700; font-size: var(--prism-type-body-lg); color: var(--prism-text-heading);
|
|
text-decoration: none; letter-spacing: -0.01em; }
|
|
header.top .brand i { width: 0.7rem; height: 0.7rem; background: var(--prism-text-accent); transform: rotate(45deg); display: block; }
|
|
header.top nav { display: flex; align-items: center; gap: var(--prism-space-050); flex-wrap: wrap; }
|
|
header.top nav a { display: inline-flex; align-items: center; min-height: var(--prism-comp-hit-min); padding: 0 var(--prism-space-150); border-radius: var(--prism-radius-sm);
|
|
text-decoration: none; font-weight: 500; color: var(--prism-text-body); }
|
|
header.top nav a.pier { font-weight: 700; color: var(--prism-text-heading); }
|
|
header.top nav a:hover { background: var(--prism-bg-canvas); }
|
|
header.top .sep { color: var(--prism-text-subtle); }
|
|
main.page { max-width: 80rem; margin: 0 auto; padding: var(--prism-space-300) var(--prism-space-300) var(--prism-space-600); }
|
|
main.page > h1, main.page h1 { font-size: var(--prism-type-title); line-height: var(--prism-lh-title); color: var(--prism-text-heading); font-weight: 700; margin: var(--prism-space-100) 0 var(--prism-space-200); }
|
|
main.page h2 { font-size: var(--prism-type-title-sm); line-height: var(--prism-lh-title); font-weight: 500; color: var(--prism-text-heading); margin: var(--prism-space-400) 0 var(--prism-space-150); }
|
|
main.page h3 { font-size: var(--prism-type-body-lg); font-weight: 700; color: var(--prism-text-heading); margin: var(--prism-space-300) 0 var(--prism-space-100); }
|
|
main.page p { max-width: 62rem; margin: var(--prism-space-100) 0; }
|
|
.muted { color: var(--prism-text-subtle); }
|
|
|
|
/* status words of the older screens (always words, never colour alone) */
|
|
main.page .ok, main.page .warn, main.page .fail { font-weight: 700; }
|
|
main.page .ok { color: var(--prism-comp-state-good-fg); }
|
|
main.page .warn { color: var(--prism-comp-state-warn-fg); }
|
|
main.page .fail { color: var(--prism-comp-state-bad-fg); }
|
|
.flash { border: var(--prism-stroke-regular) solid var(--prism-comp-line); border-radius: var(--prism-radius-sm); padding: var(--prism-space-150) var(--prism-space-200);
|
|
margin: var(--prism-space-150) 0; background: var(--prism-bg-card); font-weight: 500; }
|
|
.flash.ok { border-color: var(--prism-comp-state-good-fg); background: var(--prism-comp-state-good-bg); color: var(--prism-comp-state-good-fg); }
|
|
.flash.fail { border-color: var(--prism-comp-state-bad-fg); background: var(--prism-comp-state-bad-bg); color: var(--prism-comp-state-bad-fg); border-width: var(--prism-stroke-bold); }
|
|
.flash.warn { border-color: var(--prism-comp-state-warn-fg); background: var(--prism-comp-state-warn-bg); color: var(--prism-comp-state-warn-fg); }
|
|
|
|
/* tables of the older screens */
|
|
main.page table { border-collapse: collapse; margin: var(--prism-space-100) 0; background: var(--prism-bg-card); border: var(--prism-stroke-hairline) solid var(--prism-comp-line);
|
|
border-radius: var(--prism-radius-sm); font-size: var(--prism-type-body-sm); }
|
|
main.page th, main.page td { padding: var(--prism-space-100) var(--prism-space-150); border-bottom: var(--prism-stroke-hairline) solid var(--prism-comp-line);
|
|
text-align: left; vertical-align: top; }
|
|
main.page th { background: var(--prism-comp-table-head-bg); font-weight: 700; white-space: nowrap; border-bottom: var(--prism-stroke-regular) solid var(--prism-comp-line); }
|
|
main.page .wrap { overflow-x: auto; max-width: 100%; }
|
|
main.page details { margin: var(--prism-space-100) 0; }
|
|
main.page summary { cursor: pointer; min-height: var(--prism-comp-hit-min); display: flex; align-items: center; font-weight: 500; }
|
|
main.page code { font-family: var(--prism-font); font-size: var(--prism-type-caption); background: var(--prism-bg-card); border: var(--prism-stroke-hairline) solid var(--prism-comp-line);
|
|
border-radius: var(--prism-radius-sm); padding: 0 var(--prism-space-050); }
|
|
main.page pre { background: var(--prism-bg-card); border: var(--prism-stroke-hairline) solid var(--prism-comp-line); border-radius: var(--prism-radius-sm); padding: var(--prism-space-150);
|
|
white-space: pre-wrap; font-size: var(--prism-type-caption); }
|
|
|
|
/* buttons and fields of the older screens (the .prism blocks keep their own .btn / .field) */
|
|
main.page button:not(.btn) { min-height: var(--prism-comp-hit-min); padding: 0 var(--prism-space-200); border-radius: var(--prism-radius-sm); font: inherit; font-weight: 500;
|
|
cursor: pointer; border: var(--prism-stroke-regular) solid var(--prism-text-heading); background: var(--prism-bg-card); color: var(--prism-text-heading); }
|
|
main.page button:not(.btn):disabled { border-style: dashed; color: var(--prism-text-subtle); border-color: var(--prism-comp-line); cursor: not-allowed; }
|
|
main.page input[type=text], main.page input[type=file], main.page select { min-height: var(--prism-comp-hit-min); padding: var(--prism-space-100) var(--prism-space-150); font: inherit;
|
|
color: var(--prism-text-body); background: var(--prism-bg-card); border: var(--prism-stroke-regular) solid var(--prism-comp-line); border-radius: var(--prism-radius-sm); }
|
|
main.page input[type=checkbox] { width: 1.25rem; height: 1.25rem; accent-color: var(--prism-text-heading); }
|
|
main.page textarea { width: 100%; height: 30rem; font-family: ui-monospace, Consolas, monospace; font-size: var(--prism-type-caption); line-height: 1.6; padding: var(--prism-space-150);
|
|
background: var(--prism-bg-card); color: var(--prism-text-body); border: var(--prism-stroke-regular) solid var(--prism-comp-line); border-radius: var(--prism-radius-sm); }
|
|
main.page form { margin: var(--prism-space-100) 0; }
|
|
main.page ul { padding-left: var(--prism-space-300); }
|
|
@media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; } }
|
|
@media (max-width: 48rem) { header.top { height: auto; flex-wrap: wrap; padding: var(--prism-space-100) var(--prism-space-200); } main.page { padding: var(--prism-space-200); } }
|
|
.skip:focus { left: var(--prism-space-200) !important; top: var(--prism-space-100); z-index: var(--prism-z-modal); background: var(--prism-bg-card); padding: var(--prism-space-100) var(--prism-space-200);
|
|
border: var(--prism-stroke-regular) solid var(--prism-comp-line-strong); border-radius: var(--prism-radius-sm); }
|