Files
hwacheon-network-viewer/web/viewer-readability.css
T

61 lines
3.8 KiB
CSS

/* Shared typography used by the Hwacheon viewer. */
body { font-family: Pretendard, system-ui, sans-serif; font-size: 15px; line-height: 1.6; }
button, input, select { font-family: inherit; }
.studio-nav a { font-size: 13px; }
.brand small { font-size: 10px; letter-spacing: 1px; }
.title-block h1 { font-size: 17px; }
.title-block > span, .project-label { font-size: 13px; }
:is(.section-kicker, .eyebrow, .micro, .source-label, .small, .range-ends, .scale-note) { font-size: 12px; letter-spacing: .4px; }
:is(.subtle, .intro, .inspector-intro, .empty-detail, .source-note, .source-note p) { font-size: 14px; line-height: 1.8; }
:is(.controls h3, .section-heading h2, .detail-section h3, .notes-content h3) { font-size: 16px; }
:is(.text-button, .panel-toggle, .audit-button, .focus-button, .wide-select, .search-wrap input, .search-results button, .result, .connection-link) { font-size: 14px; }
:is(.layer-list label, .range-heading, .range-heading output, .toggle-label, .toggle-row, .range-label, .select-wrap > span) { font-size: 14px; }
:is(.fine-print, .notice, .profile-caption, .toggle-label small, .connection-link small, .result small, .search-results small, .toggle-row small) { font-size: 12px; line-height: 1.75; }
:is(.properties > div, .overview-list > div, .dimensions dt, .dimensions dd, .notes-content p, .help-list div, .help-grid, .audit-row, .audit-filter-label) { font-size: 14px; line-height: 1.75; }
:is(.dimensions dt span, .notes-content dl div, .audit-summary-grid div, .audit-row button, .audit-filter-label select) { font-size: 12px; }
:is(.summary-cards span, .layer-list small, .type-badge, .view-badge, .viewport-status, .tag, .scale-badges span, .coordinate-note, .legend-title, .legend-panel > div, .legend-panel > div span, .legend-summary, .legend-panel small, .datum-note) { font-size: 12px; }
.legend-panel small { line-height: 1.6; }
:is(.view-toolbar button, .segmented button, .viewer-footer .text-button) { font-size: 14px; }
:is(.viewer-footer, .viewer-footer > span, .statusbar, .bottom-bar, .bottom-bar > span:nth-child(2), .dialog-intro, .dialog-actions > span, #toast) { font-size: 12px; letter-spacing: 0; }
:is(.detail-table, .detail-table th, .detail-table td) { font-size: 12px; }
.controls section { padding-top: 22px; padding-bottom: 18px; }
.layer-list label, .toggle-label, .toggle-row { min-height: 40px; }
.connection-link { flex-wrap: wrap; }
:is(.statusbar, .bottom-bar) { min-height: 38px; height: auto; }
.network-page .viewer-footer { gap: 8px; }
@media (max-width: 1200px) {
.network-page .view-toolbar button { padding: 10px 8px; }
.network-page .viewer-footer > span { max-width: 72%; }
}
@media (max-width: 750px) {
.brand small { font-size: 10px; }
}
@media (max-width: 650px) {
.title-block h1 { font-size: 15px; }
.network-page .layer-list { grid-template-columns: 1fr; gap: 6px; }
.network-page .legend-panel { max-width: calc(100% - 120px); }
.network-page .legend-panel small { font-size: 12px; }
.network-page .viewer-footer > span { font-size: 12px; }
}
/* Nested labels have stronger page-specific rules. */
.network-page .controls > .section-kicker,
.network-page .viewport-heading .section-kicker { font-size: 11px; }
.network-page .viewer .coordinate-note,
.network-page .legend-panel summary,
.network-page .detail-section details summary,
.network-page .inspector table { font-size: 12px; }
.network-page .inspector .properties > div { font-size: 14px; }
.network-page .viewport-heading p { font-size: 13px; }
.network-page .topbar .title-block h1 { font-size: 17px; }
.network-page .legend-panel > div { font-size: 12px; }
.network-page .scale-badges span { font-size: 12px; }
@media (max-width: 650px) {
.network-page .topbar .title-block h1 { font-size: 15px; }
}
@media (max-width: 650px) {
.network-page .legend-panel small { display: none; }
.network-page .legend-panel > div { margin-top: 6px; }
}