102 lines
9.1 KiB
CSS
102 lines
9.1 KiB
CSS
/* Своя обвязка поверх KT AI ДС: сетка, отступы, рабочие детали экранов.
|
||
Компоненты ДС (.kt-ai-btn, .kt-ai-table, .kt-ai-kpi и т.д.) НЕ перекрашиваются. */
|
||
|
||
/* ── Каркас экрана ──────────────────────────────────────── */
|
||
.kt-ai-page { max-width: 1280px; width: 100%; margin: 0 auto; }
|
||
.kt-ai-screen-head { padding: var(--kt-ai-stack-group) 0 var(--kt-ai-stack-block); }
|
||
.kt-ai-title-row { display: flex; align-items: baseline; gap: var(--kt-ai-stack-block); flex-wrap: wrap; }
|
||
.kt-ai-screen-body.kt-ai-stack-page { display: flex; flex-direction: column; gap: var(--kt-ai-stack-block); padding: 0 0 var(--kt-ai-stack-region); }
|
||
.kt-ai-actions-row { display: flex; gap: var(--kt-ai-space-3); flex-wrap: wrap; align-items: center; }
|
||
|
||
/* ── Две колонки (лог + предупреждения) ─────────────────── */
|
||
.kt-ai-grid-2 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--kt-ai-stack-block); align-items: start; }
|
||
@media (max-width: 900px) { .kt-ai-grid-2 { grid-template-columns: 1fr; } }
|
||
|
||
/* ── Типографика, иконки, служебные классы экранов ──────── */
|
||
.kt-ai-subtitle { margin: var(--kt-ai-space-3) 0 0; font-size: var(--kt-ai-text-sm); color: var(--kt-ai-fg-muted); max-width: 64ch; }
|
||
.kt-ai-mono { font-family: var(--kt-ai-font-mono); }
|
||
.kt-ai-mute { color: var(--kt-ai-fg-muted); }
|
||
.kd-nowrap { white-space: nowrap; }
|
||
.kt-ai-card-head { display: flex; align-items: center; gap: var(--kt-ai-space-3); margin-bottom: var(--kt-ai-stack-tight); }
|
||
.kt-ai-card-head-row { justify-content: space-between; }
|
||
.kt-ai-section-card { padding: var(--kt-ai-stack-block); }
|
||
.kt-ai-tile-row { display: flex; gap: var(--kt-ai-space-3); flex-wrap: wrap; }
|
||
.kt-ai-tile-btn { flex: 1 1 220px; max-width: 360px; }
|
||
.kt-ai-status-pill-mono { font-family: var(--kt-ai-font-mono); }
|
||
.kt-ai-filter-row { display: flex; gap: var(--kt-ai-space-3); flex-wrap: wrap; align-items: center; }
|
||
.kt-ai-empty { padding: var(--kt-ai-stack-block); text-align: center; color: var(--kt-ai-fg-muted); font-size: var(--kt-ai-text-sm); }.kt-ai-page .kt-ai-icon { width: 16px; height: 16px; }
|
||
|
||
/* ── Журнал действий ────────────────────────────────────── */
|
||
.log { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
|
||
.log li { display: flex; gap: var(--kt-ai-space-4); align-items: flex-start; padding: var(--kt-ai-space-3) 0; border-bottom: 1px solid var(--kt-ai-divider); }
|
||
.log li:last-child { border-bottom: none; }
|
||
.log .time { font-family: var(--kt-ai-font-mono); font-size: var(--kt-ai-text-2xs); color: var(--kt-ai-fg-faint); padding-top: 2px; white-space: nowrap; }
|
||
.log .msg { font-size: var(--kt-ai-text-sm); color: var(--kt-ai-fg); min-width: 0; overflow-wrap: anywhere; }
|
||
.log .msg .em { color: var(--kt-ai-fg-muted); }
|
||
.log .tag { flex-shrink: 0; font-size: var(--kt-ai-text-2xs); font-weight: var(--kt-ai-weight-medium); font-family: var(--kt-ai-font-mono); color: var(--kt-ai-fg-faint); align-self: center; }
|
||
|
||
/* ── Список предупреждений ──────────────────────────────── */
|
||
.warn-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
|
||
.warn-list li { display: flex; align-items: flex-start; gap: var(--kt-ai-space-3); font-size: var(--kt-ai-text-sm); color: var(--kt-ai-fg); padding: var(--kt-ai-space-3) 0; border-bottom: 1px solid var(--kt-ai-divider); }
|
||
.warn-list li:last-child { border-bottom: none; }
|
||
.warn-list .kt-icon { color: var(--kt-ai-status-warn-fg); flex-shrink: 0; margin-top: 1px; }
|
||
.warn-list .fix { margin-left: auto; flex-shrink: 0; }
|
||
.warn-list li.resolved { color: var(--kt-ai-fg-muted); }
|
||
.warn-list li.resolved .kt-icon { color: var(--kt-ai-status-ok-fg); }
|
||
.warn-list li.resolved::after { content: "исправлено"; margin-left: var(--kt-ai-space-3); font-size: var(--kt-ai-text-2xs); color: var(--kt-ai-status-ok-fg); font-weight: var(--kt-ai-weight-medium); }
|
||
|
||
/* ── Сетка фильтров экрана проверки ─────────────────────── */
|
||
.filter-row { display: flex; gap: var(--kt-ai-space-3); flex-wrap: wrap; align-items: center; }
|
||
.filter-row .hint { font-size: var(--kt-ai-text-xs); color: var(--kt-ai-fg-muted); }
|
||
|
||
/* ── Таблица: ячейки-значения и подсветка ───────────────── */
|
||
.kt-ai-table td.edit { padding: 0; }
|
||
.cell-num { display: block; width: 100%; min-width: 76px; padding: 0 var(--kt-ai-space-4); height: 100%; text-align: right; font-family: var(--kt-ai-font-sans); font-variant-numeric: tabular-nums; font-size: var(--kt-ai-text-sm); border: 0; background: transparent; color: inherit; }
|
||
.cell-num:hover { background: var(--kt-ai-bg-hover); cursor: text; }
|
||
.cell-num:focus { outline: none; background: var(--kt-ai-bg-elevated); box-shadow: inset 0 0 0 2px var(--kt-ai-primary); }
|
||
td.cell-dev-bad { background: color-mix(in srgb, var(--kt-ai-chart-salmon) 16%, transparent); }
|
||
td.cell-dev-bad .dev { color: var(--kt-ai-status-risk-fg); font-weight: var(--kt-ai-weight-semibold); }
|
||
td .dev { display: inline-block; min-width: 64px; text-align: right; font-variant-numeric: tabular-nums; font-size: var(--kt-ai-text-sm); }
|
||
td .dev.neg { color: var(--kt-ai-chart-blue); }
|
||
td .dev.pos { color: var(--kt-ai-fg-muted); }
|
||
td .dev.pos.big { color: var(--kt-ai-status-warn-fg); font-weight: var(--kt-ai-weight-semibold); font-size: var(--kt-ai-text-xs); }
|
||
.unit-badge { display: inline-block; font-size: var(--kt-ai-text-2xs); font-weight: var(--kt-ai-weight-medium); font-family: var(--kt-ai-font-mono); color: var(--kt-ai-status-warn-fg); background: var(--kt-ai-status-warn-bg); border-radius: var(--kt-ai-radius-tag); padding: 1px 6px; margin-left: var(--kt-ai-space-2); white-space: nowrap; }
|
||
.cell-note { font-size: var(--kt-ai-text-2xs); color: var(--kt-ai-fg-faint); max-width: 12ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block; vertical-align: 1px; }
|
||
|
||
/* ── Сводная таблица предпросмотра отчёта ───────────────── */
|
||
.report-table { font-size: var(--kt-ai-text-sm); }
|
||
.report-table .num { font-variant-numeric: tabular-nums; }
|
||
|
||
/* ── Записка ────────────────────────────────────────────── */
|
||
.note-box { display: flex; flex-direction: column; gap: var(--kt-ai-space-4); }
|
||
.note-box .kt-ai-textarea { min-height: 220px; font-size: var(--kt-ai-text-md); line-height: var(--kt-ai-leading-normal); }
|
||
|
||
/* ── Сводка отклонений (экран результата) ───────────────── */
|
||
.dev-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
|
||
.dev-list li { display: flex; align-items: center; gap: var(--kt-ai-space-3); font-size: var(--kt-ai-text-sm); padding: var(--kt-ai-space-3) 0; border-bottom: 1px solid var(--kt-ai-divider); }
|
||
.dev-list li:last-child { border-bottom: none; }
|
||
.dev-list .val { margin-left: auto; font-family: var(--kt-ai-font-mono); font-size: var(--kt-ai-text-2xs); font-weight: var(--kt-ai-weight-medium); }
|
||
.dev-list .val.up { color: var(--kt-ai-status-risk-fg); }
|
||
.dev-list .val.down { color: var(--kt-ai-chart-blue); }
|
||
|
||
/* ── Паспорт решения ────────────────────────────────────── */
|
||
.passport { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: var(--kt-ai-stack-block); }
|
||
.passport .kt-ai-card { padding: var(--kt-ai-stack-block); }
|
||
.passport h3 { margin: 0 0 var(--kt-ai-space-3); font-size: var(--kt-ai-text-sm); font-weight: var(--kt-ai-weight-semibold); color: var(--kt-ai-fg-muted); display: flex; align-items: center; gap: var(--kt-ai-space-2); }
|
||
.passport h3 .kt-icon { color: var(--kt-ai-fg-faint); }
|
||
.passport ul { margin: 0; padding-left: var(--kt-ai-space-6); display: flex; flex-direction: column; gap: var(--kt-ai-space-2); font-size: var(--kt-ai-text-sm); color: var(--kt-ai-fg); }
|
||
|
||
.kv-row { display: flex; justify-content: space-between; gap: var(--kt-ai-stack-block); font-size: var(--kt-ai-text-sm); padding: var(--kt-ai-space-3) 0; border-bottom: 1px solid var(--kt-ai-divider); }
|
||
.kv-row:last-child { border-bottom: none; }
|
||
.kv-row .k { color: var(--kt-ai-fg-muted); }
|
||
.kv-row .v { font-weight: var(--kt-ai-weight-medium); text-align: right; }
|
||
|
||
/* ── Мобильная ширина ───────────────────────────────────── */
|
||
@media (max-width: 831.98px) {
|
||
.kt-ai-screen-head { padding: var(--kt-ai-stack-block) 0 var(--kt-ai-stack-tight); }
|
||
.kt-ai-actions-row { width: 100%; }
|
||
}
|
||
@media (max-width: 640px) {
|
||
#f-search.only-wide, .only-wide { display: none; }
|
||
}
|