Files
Aislo/ui_template/ui_template_loading.css
T
eomsangdonandClaude Opus 5.5 54410dd26a fix(ui-kit): 부품 흠 둘 — 숨김이 부품 display 를 이김 · 모달 머리 [닫기] 한 줄 (PLAN 552-6)
- 부품 CSS 37 파일: display 를 주는 ui-* 클래스마다 같은 파일에 [hidden] { display: none !important } (공용 기본 꼴 없는 곳 · 페이지 꾸밈 위에서도) · 옛 숨김 규칙 일곱 파일 !important 로 · 접이 카드 머리는 collapsible.css
- 모달 머리: 제목 한 줄 말줄임(전체 글 = title) · [닫기] · 머리 단추 flex: none · nowrap
- 부품 모음 모달 견본에 긴 제목 24rem 한 칸
- 지킴 시험 test_552_6_part_fixes

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-27 00:07:37 +09:00

42 lines
1009 B
CSS

/* 컨테이너 안 불러오는 중 · 실패 자리(ui_template_loading.ts) — 회전 표시는 공용 .ui-spinner 와 같은 색 · 작게 */
.ui-loading {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: var(--spacing-8);
padding: var(--spacing-12) var(--spacing-8);
color: var(--color-text-secondary);
font-size: var(--text-body-sm);
}
.ui-loading__spin {
flex: none;
width: 16px;
height: 16px;
border: 2px solid var(--color-mist-violet);
border-top-color: var(--color-royal-amethyst);
border-radius: 50%;
animation: ui-loading-spin 0.8s linear infinite;
}
.ui-loading--error {
color: var(--color-danger);
}
@keyframes ui-loading-spin {
to {
transform: rotate(360deg);
}
}
@media (prefers-reduced-motion: reduce) {
.ui-loading__spin {
animation-duration: 2.4s;
}
}
/* 숨김 — display 가 [hidden] 을 덮지 않게(공용 기본 꼴이 안 실린 곳 · 페이지 꾸밈 위에서도) */
.ui-loading[hidden] {
display: none !important;
}