런타임 계약과 학습자 흐름 보강

This commit is contained in:
Yun Chan 2026-06-29 08:12:14 +09:00
parent f456b8997a
commit 206018b088
56 changed files with 4306 additions and 1008 deletions

View file

@ -140,24 +140,21 @@
"session session session";
}
.sr-cols--learner {
grid-template-columns: minmax(0, 1.08fr) minmax(320px, 0.92fr);
grid-template-columns: minmax(232px, 300px) minmax(380px, 1fr) minmax(264px, 328px);
grid-template-areas:
"transcript overview"
"transcript chart"
"transcript flow"
"transcript rubric"
"transcript good"
"transcript growth"
"transcript prepost"
"transcript worksheet"
"transcript feedback"
"session session";
"overview transcript rubric"
"chart transcript good"
"flow transcript growth"
"worksheet worksheet prepost"
"worksheet worksheet feedback"
"session session session";
}
.sr-cols--learner .sr-overview {
position: static;
max-height: none;
overflow: visible;
scrollbar-gutter: auto;
position: sticky;
top: calc(var(--topbar-h) + var(--sp-4));
max-height: calc(100vh - var(--topbar-h) - var(--sp-5) - var(--sp-5));
overflow: auto;
scrollbar-gutter: stable;
}
.sr-root--empty .sr-cols {
grid-template-columns: minmax(236px, 300px) minmax(0, 1fr);
@ -293,10 +290,11 @@
font-size: var(--fs-sm);
line-height: 1.5;
}
.sr-teacher-review__note textarea:focus {
outline: 2px solid var(--accent);
outline-offset: 1px;
border-color: var(--accent);
.sr-teacher-review__note textarea:focus-visible {
outline: 2px solid var(--border-focus);
outline-offset: 2px;
border-color: var(--border-focus);
box-shadow: 0 0 0 3px var(--focus-ring);
}
.sr-teacher-review__meta,
.sr-teacher-review__error {
@ -525,9 +523,11 @@
font-weight: 650;
text-align: center;
}
.sr-prepost__field input:focus {
outline: 2px solid var(--accent-tint);
border-color: var(--accent);
.sr-prepost__field input:focus-visible {
outline: 2px solid var(--border-focus);
outline-offset: 2px;
border-color: var(--border-focus);
box-shadow: 0 0 0 3px var(--focus-ring);
}
.sr-prepost__field input[aria-invalid="true"] {
border-color: color-mix(in srgb, var(--crit-text) 44%, var(--border-subtle));
@ -718,6 +718,13 @@
color: var(--text-strong);
border-color: var(--border-strong);
}
.sr-chip-toggle:focus-visible,
.sr-ws-evidence:focus-visible,
.sr-point__at:focus-visible {
outline: 2px solid var(--border-focus);
outline-offset: 2px;
box-shadow: 0 0 0 3px var(--focus-ring);
}
.sr-chip-toggle[aria-pressed="true"] {
color: var(--accent-deep);
background: var(--accent-tint);
@ -1180,9 +1187,11 @@
line-height: 1.55;
overflow-wrap: anywhere;
}
.sr-ws-input:focus {
outline: 2px solid var(--accent-tint);
border-color: var(--accent);
.sr-ws-input:focus-visible {
outline: 2px solid var(--border-focus);
outline-offset: 2px;
border-color: var(--border-focus);
box-shadow: 0 0 0 3px var(--focus-ring);
}
.sr-ws-input.is-readonly {
resize: none;
@ -1190,9 +1199,10 @@
color: var(--text-body);
background: color-mix(in srgb, var(--bg-surface) 82%, var(--bg-surface-2));
}
.sr-ws-input.is-readonly:focus {
.sr-ws-input.is-readonly:focus-visible {
outline: none;
border-color: var(--border-subtle);
box-shadow: none;
}
.sr-ws-input::placeholder {
color: var(--text-muted);
@ -1395,6 +1405,17 @@
[data-theme="dark"] .sr-card--transcript {
background: linear-gradient(180deg, rgba(13, 24, 22, 0.98), rgba(11, 19, 17, 0.98));
}
[data-theme="dark"] .sr-overview {
border-color: rgba(111, 179, 164, 0.2);
background: linear-gradient(180deg, rgba(32, 50, 45, 0.94), rgba(18, 31, 28, 0.98));
}
[data-theme="dark"] .sr-card--worksheet {
background: linear-gradient(180deg, rgba(25, 39, 44, 0.94), rgba(16, 27, 31, 0.98));
}
[data-theme="dark"] .sr-card--prepost,
[data-theme="dark"] .sr-card--rubric {
background: linear-gradient(180deg, rgba(29, 43, 38, 0.92), rgba(18, 30, 27, 0.96));
}
[data-theme="dark"] .sr-stat,
[data-theme="dark"] .sr-readiness span,
[data-theme="dark"] .sr-empty,