- M02_DF_Entry.ts · .css 지움(아무도 안 부름) · Paper · 상세 내용 틀이 쓰던 꾸밈 18 규칙은 M02_DF_Paper.css 로 옮김 - Paper 의 시험 로직(DF-) 받기 지움 — 다른 로직은 부르는 쪽 logics 로만 - 패널: 머리 「접기」 · 띠 「흐름도 ▸」 → 「흐름도」 단추 하나(펼치면 머리 · 접으면 띠 · aria-expanded) · 접기 전 너비 기억(펴면 그 너비) - 끌기 손잡이: 세로 막대 + 가운데 잡이 늘 보임 · 올리면 강조 - typecheck · DataFlow 전부 검사 초록 · 시험 10 통과 · ORCA: 단추 머리 ↔ 띠 · onResize 560 → 40 → 560 Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Ly2oHAaTDYRjcniAmHR81z
114 lines
2.2 KiB
CSS
114 lines
2.2 KiB
CSS
/* 흐름도 고치는 핵심(M02_DF_Paper) · 상세 내용 틀(M02_DF_Entry_Detail) 꾸밈 — 옛 시험판 Entry.css 에서 옮김 */
|
|
.m02-df__muted {
|
|
margin: 0;
|
|
color: var(--color-text-muted);
|
|
font-size: var(--text-body-sm);
|
|
}
|
|
|
|
.m02-df__part {
|
|
display: flex;
|
|
flex-direction: column;
|
|
border: 1px solid var(--color-border);
|
|
border-radius: var(--radius-lg);
|
|
background: var(--color-surface);
|
|
}
|
|
|
|
.m02-df__part h3 {
|
|
margin: 0;
|
|
padding: var(--spacing-8) var(--spacing-12);
|
|
border-bottom: 1px solid var(--color-border);
|
|
}
|
|
|
|
.m02-df__part-body {
|
|
padding: var(--spacing-12);
|
|
}
|
|
|
|
.m02-df__note {
|
|
margin: 0 0 var(--spacing-12);
|
|
color: var(--color-text-secondary);
|
|
font-size: var(--text-body-sm);
|
|
white-space: pre-line;
|
|
}
|
|
|
|
.m02-df__note:empty {
|
|
display: none;
|
|
}
|
|
|
|
.m02-df__color {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: var(--spacing-8);
|
|
margin-bottom: var(--spacing-8);
|
|
font-size: var(--text-body-sm);
|
|
}
|
|
|
|
.m02-df__color[hidden] {
|
|
display: none;
|
|
}
|
|
|
|
.m02-df__color-input {
|
|
width: 44px;
|
|
height: 32px;
|
|
padding: 0;
|
|
border: 1px solid var(--color-border);
|
|
border-radius: var(--radius-sm);
|
|
background: none;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.m02-df__detail-head {
|
|
display: flex;
|
|
align-items: baseline;
|
|
justify-content: space-between;
|
|
gap: var(--spacing-12);
|
|
padding: var(--spacing-8) var(--spacing-12);
|
|
border-bottom: 1px solid var(--color-border);
|
|
}
|
|
|
|
.m02-df__detail-head h3 {
|
|
margin: 0;
|
|
padding: 0;
|
|
border: 0;
|
|
}
|
|
|
|
.m02-df__detail-name {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
align-items: baseline;
|
|
justify-content: flex-end;
|
|
gap: var(--spacing-8);
|
|
}
|
|
|
|
.m02-df__detail-pill {
|
|
color: var(--color-text-secondary);
|
|
font-size: var(--text-body-sm);
|
|
}
|
|
|
|
.m02-df__detail-row {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: var(--spacing-4);
|
|
padding: var(--spacing-8) 0;
|
|
border-bottom: 1px dashed var(--color-border);
|
|
}
|
|
|
|
.m02-df__detail-row:last-child {
|
|
border-bottom: 0;
|
|
}
|
|
|
|
.m02-df__detail-row[hidden] {
|
|
display: none;
|
|
}
|
|
|
|
.m02-df__detail-row h4 {
|
|
margin: 0;
|
|
color: var(--color-text-secondary);
|
|
font-size: var(--text-body-sm);
|
|
}
|
|
|
|
.m02-df__detail-warn {
|
|
margin: 0;
|
|
padding-left: var(--spacing-16);
|
|
font-size: var(--text-body-sm);
|
|
}
|