eomsangdonandClaude Sonnet 5.5
3a59f715f6
- 복사본 창구를 sub6 길 모양({항목} · {종류, 판, 내용} · PUT {판, 내용} · 409 message · refresh · calc)으로 — 가짜 응답 지움
- 입력 목록 · 항목 연결은 sub4 길(fetchItemInputs · readInputLinks) · 알약은 pillsOf
- 값 받기 카드를 M02_MasterTemplete_Inputs.ts 에 모드 view · value 로 더함(InputsCard 지움 · 두 벌 금지) · 셈은 _Inputs_Model
- 상태 줄에 복사본 계산 한 줄(계 · 빠진 입력) · 목록은 모달에서 한 번만 받아 들고 있음
- Structure.ts: sub2 의 선택 입력 카드를 ItemCards 의 extraCards 로 다시 얹음
Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01EauA2ATmqNRbeV48s9CcBr
204 lines
4.1 KiB
CSS
204 lines
4.1 KiB
CSS
/* 「선택 입력」 카드 — 로직마다 묶은 입력 줄 + 줄마다 자리 고르기. 색은 테마 토큰. */
|
|
|
|
.m02-inputs__summary {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: var(--spacing-4) var(--spacing-12);
|
|
align-items: baseline;
|
|
color: var(--color-text-muted);
|
|
font-size: var(--text-body-sm);
|
|
}
|
|
|
|
.m02-inputs__count {
|
|
color: var(--color-text);
|
|
font-weight: 600;
|
|
}
|
|
|
|
/* 카드 본문이 남는 높이를 채우고 넘치면 안에서 스크롤 */
|
|
.m02-inputs__body {
|
|
display: flex;
|
|
flex: 1 1 0;
|
|
flex-direction: column;
|
|
gap: var(--spacing-12);
|
|
min-height: var(--m02-struct-body-min);
|
|
min-width: 0;
|
|
overflow: auto;
|
|
padding: var(--spacing-8) 0;
|
|
}
|
|
|
|
.m02-inputs__logic {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: var(--spacing-4);
|
|
}
|
|
|
|
.m02-inputs__logic-title {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: var(--spacing-4) var(--spacing-8);
|
|
align-items: baseline;
|
|
margin: 0;
|
|
padding-bottom: var(--spacing-4);
|
|
border-bottom: 1px solid var(--color-border);
|
|
color: var(--color-text);
|
|
font-size: var(--text-body-sm);
|
|
overflow-wrap: anywhere;
|
|
}
|
|
|
|
.m02-inputs__logic-title small,
|
|
.m02-inputs__row small {
|
|
color: var(--color-text-muted);
|
|
font-size: var(--text-caption);
|
|
font-weight: 400;
|
|
}
|
|
|
|
.m02-inputs__row {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: var(--spacing-4) var(--spacing-8);
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
padding: var(--spacing-4) 0;
|
|
}
|
|
|
|
.m02-inputs__info {
|
|
display: flex;
|
|
flex: 1 1 12rem;
|
|
flex-wrap: wrap;
|
|
gap: 2px var(--spacing-8);
|
|
align-items: baseline;
|
|
min-width: 0;
|
|
overflow-wrap: anywhere;
|
|
}
|
|
|
|
.m02-inputs__name {
|
|
color: var(--color-text);
|
|
font-size: var(--text-body-sm);
|
|
}
|
|
|
|
.m02-inputs__desc,
|
|
.m02-inputs__hint {
|
|
flex-basis: 100%;
|
|
}
|
|
|
|
/* 자동값 — 흐리게(입력 값이 아니라 보기용 첫 선택지) */
|
|
.m02-inputs__auto {
|
|
flex-basis: 100%;
|
|
opacity: 0.6;
|
|
font-style: italic;
|
|
}
|
|
|
|
.m02-inputs__seat {
|
|
flex: none;
|
|
max-width: 100%;
|
|
padding: 4px var(--spacing-8);
|
|
border: 1px solid var(--color-border);
|
|
border-radius: var(--radius-sm, 4px);
|
|
background: var(--color-surface);
|
|
color: var(--color-text);
|
|
font: inherit;
|
|
font-size: var(--text-body-sm);
|
|
}
|
|
|
|
.m02-inputs__seat:disabled {
|
|
opacity: 0.7;
|
|
}
|
|
|
|
/* ── 프로젝트에서 값 받기(PLAN 25-2d) — 값 · 확인 표시 카드 ── */
|
|
.m02-inputval__wrap {
|
|
display: flex;
|
|
flex-direction: column;
|
|
flex: 1 1 0;
|
|
min-height: var(--m02-struct-body-min, 16rem);
|
|
min-width: 0;
|
|
gap: var(--spacing-8);
|
|
}
|
|
|
|
.m02-inputval {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: var(--spacing-12);
|
|
overflow: auto;
|
|
min-height: 0;
|
|
min-width: 0;
|
|
}
|
|
|
|
.m02-inputval__places,
|
|
.m02-inputval__missing {
|
|
margin: 0;
|
|
color: var(--color-text-secondary);
|
|
font-size: var(--text-caption);
|
|
}
|
|
|
|
.m02-inputval__logic {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: var(--spacing-4);
|
|
min-width: 0;
|
|
}
|
|
|
|
.m02-inputval__logic-name {
|
|
margin: 0;
|
|
color: var(--color-text);
|
|
font-size: var(--text-caption);
|
|
overflow-wrap: anywhere;
|
|
}
|
|
|
|
.m02-inputval__row {
|
|
display: grid;
|
|
grid-template-columns: minmax(6rem, 2fr) minmax(8rem, 3fr);
|
|
gap: var(--spacing-8);
|
|
align-items: center;
|
|
min-width: 0;
|
|
}
|
|
|
|
.m02-inputval__name {
|
|
color: var(--color-text);
|
|
font-size: var(--text-caption);
|
|
overflow-wrap: anywhere;
|
|
}
|
|
|
|
.m02-inputval__cell {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: var(--spacing-4) var(--spacing-8);
|
|
align-items: center;
|
|
min-width: 0;
|
|
}
|
|
|
|
.m02-inputval__control {
|
|
flex: 1 1 6rem;
|
|
min-width: 0;
|
|
max-width: 24rem;
|
|
}
|
|
|
|
/* 자동값 = 저장값이 아님 — 기울임 + 보조 글자색(글자 대비 4.5 이상 유지) */
|
|
.m02-inputval__value.is-auto,
|
|
.m02-inputval__control.is-auto,
|
|
.m02-inputval__control::placeholder {
|
|
color: var(--color-text-secondary);
|
|
font-style: italic;
|
|
opacity: 1;
|
|
}
|
|
|
|
.m02-inputval__state {
|
|
color: var(--color-text-secondary);
|
|
font-size: var(--text-caption);
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.m02-inputval__state.is-confirmed {
|
|
color: var(--color-text);
|
|
font-weight: 600;
|
|
}
|
|
|
|
.m02-inputval__error {
|
|
flex: 1 0 100%;
|
|
color: var(--color-danger);
|
|
font-size: var(--text-caption);
|
|
}
|
|
|
|
.m02-inputval__control[aria-invalid="true"] {
|
|
border-color: var(--color-danger);
|
|
}
|