File name
Commit message
Commit date
File name
Commit message
Commit date
09-04
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
@use "@fox/styles/abstracts" as fox;
.form {
display: flex;
inline-size: 100%;
flex-direction: column;
border-block-start: fox.border(1) solid fox.color(border-neutral-subtle);
}
.row {
display: flex;
inline-size: 100%;
align-items: flex-start;
gap: fox.gap(6);
padding-block: fox.padding(5);
padding-inline: fox.padding(4);
border-block-end: fox.border(1) solid fox.color(border-neutral-subtler);
}
.label {
flex: 0 0 140px;
padding-block-start: fox.padding(2);
}
.field {
display: flex;
flex: 1 1 0;
min-inline-size: 0;
flex-direction: column;
gap: fox.gap(3);
}
.inline {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: fox.gap(3);
}
.grades {
display: flex;
flex-direction: column;
gap: fox.gap(3);
}
.keywordRow {
display: flex;
align-items: center;
gap: fox.gap(2);
}
.keywordName {
flex: 0 0 200px;
min-inline-size: 0;
}
.keywordDescription {
flex: 1 1 0;
min-inline-size: 0;
}
// 시안 tbl-form(5449:10857)의 슬롯 — 테두리 컨테이너 안에 회색 판(컷 카드들)과 흰 푸터(컷 추가).
.cutBox {
inline-size: 100%;
overflow: hidden;
border: fox.border(1) solid fox.color(border-neutral-default);
border-radius: fox.radius(4);
background: fox.color(surface-neutral-default);
}
.cutBody {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: fox.gap(4);
padding-block: fox.padding(5);
padding-inline: fox.padding(6);
background: fox.color(surface-neutral-gray-strong);
}
.cutCard {
display: flex;
flex-direction: column;
gap: fox.gap(3);
padding: fox.padding(3);
border-radius: fox.radius(4);
background: fox.color(surface-neutral-default);
box-shadow:
fox.shadow(location1) fox.shadow(location1) fox.shadow(blur1) 0
fox.primitive(alpha-black10);
}
.cutFooter {
display: flex;
align-items: center;
justify-content: space-between;
gap: fox.gap(3);
}
.cutLabel {
font-size: fox.font-size(label-sm);
color: fox.color(font-neutral-default);
}
.cutActions {
display: flex;
align-items: center;
gap: fox.gap(3);
}
.cutBoxFooter {
display: flex;
padding-block: fox.padding(4);
padding-inline: fox.padding(6);
}
.thumbnail {
display: flex;
align-items: flex-start;
gap: fox.gap(4);
}
.answerLines {
display: flex;
flex-direction: column;
gap: fox.gap(3);
}
.answerMessage {
flex: 1 1 0;
min-inline-size: 0;
max-inline-size: 360px;
}