167 lines
4.7 KiB
CSS
167 lines
4.7 KiB
CSS
/* Приложение: журнал заявок. Свои стили — только сетка, отступы, логотип.
|
||
Цвета — токены ДС; базовые иконки — из спрайта."""
|
||
|
||
.sidebar-brand {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: var(--kt-ai-space-4);
|
||
padding: var(--kt-ai-space-3) var(--kt-ai-space-4);
|
||
}
|
||
.brand-logo { width: auto; height: 26px; }
|
||
|
||
.sidebar-new {
|
||
margin: var(--kt-ai-space-6) var(--kt-ai-space-3) var(--kt-ai-space-8);
|
||
}
|
||
.sidebar-tools {
|
||
margin-top: auto;
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: var(--kt-ai-space-4);
|
||
padding: 0 var(--kt-ai-space-3) var(--kt-ai-space-3);
|
||
}
|
||
|
||
.topbar-crumb {
|
||
font-size: var(--kt-ai-text-xs);
|
||
color: var(--kt-ai-fg-muted);
|
||
}
|
||
|
||
.page-head {
|
||
display: flex;
|
||
align-items: flex-start;
|
||
justify-content: space-between;
|
||
gap: var(--kt-ai-space-5);
|
||
flex-wrap: wrap;
|
||
}
|
||
.meta-chip { white-space: nowrap; }
|
||
|
||
.toolbar {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: var(--kt-ai-space-4);
|
||
flex-wrap: wrap;
|
||
margin-top: var(--kt-ai-stack-block);
|
||
}
|
||
.toolbar .kt-ai-filterbar { margin: 0; flex-wrap: wrap; }
|
||
.search-input { width: min(380px, 100%); }
|
||
|
||
.table-foot { margin-top: var(--kt-ai-space-3); }
|
||
|
||
.log-section { margin-top: var(--kt-ai-stack-region); }
|
||
.log-section h2 { margin-bottom: var(--kt-ai-stack-tight); }
|
||
|
||
/* Карточка заявки в панели */
|
||
.drawer-head {
|
||
display: flex;
|
||
align-items: flex-start;
|
||
justify-content: space-between;
|
||
gap: var(--kt-ai-space-4);
|
||
margin-bottom: var(--kt-ai-stack-tight);
|
||
}
|
||
.detail-stack {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: var(--kt-ai-stack-tight);
|
||
}
|
||
.detail-note {
|
||
padding-top: var(--kt-ai-space-5);
|
||
border-top: 1px solid var(--kt-ai-border);
|
||
}
|
||
.detail-note .kt-ai-label { display: block; margin-bottom: var(--kt-ai-space-3); }
|
||
.note-text {
|
||
margin: 0;
|
||
font-size: var(--kt-ai-text-sm);
|
||
line-height: 1.6;
|
||
color: var(--kt-ai-fg-muted);
|
||
white-space: pre-line;
|
||
overflow-wrap: anywhere;
|
||
}
|
||
|
||
/* Ящик: при открытии поверх шапки, а скрытие — флагом hidden */
|
||
.kt-ai-drawer { z-index: calc(var(--kt-ai-z-drawer) + 1); }
|
||
.kt-ai-drawer[hidden] { display: none; }
|
||
|
||
/* Пустое состояние: центрируем содержимое */
|
||
.kt-ai-empty { align-items: center; text-align: center; min-height: 220px; }
|
||
.kt-ai-empty .kt-icon { width: 30px; height: 30px; color: var(--kt-ai-fg-faint); margin-bottom: var(--kt-ai-space-3); }
|
||
.kt-ai-empty .kt-ai-sub { margin: 0; font-size: var(--kt-ai-text-sm); color: var(--kt-ai-fg-muted); max-width: 420px; }
|
||
|
||
/* История действий: события */
|
||
.event-list {
|
||
display: flex;
|
||
flex-direction: column;
|
||
}
|
||
.event-row {
|
||
display: flex;
|
||
align-items: flex-start;
|
||
gap: var(--kt-ai-space-4);
|
||
padding: var(--kt-ai-space-3) 0;
|
||
border-bottom: 1px solid var(--kt-ai-border);
|
||
}
|
||
.event-row:last-child { border-bottom: none; }
|
||
.event-time {
|
||
flex: 0 0 96px;
|
||
font-size: var(--kt-ai-text-xs);
|
||
color: var(--kt-ai-fg-muted);
|
||
font-variant-numeric: tabular-nums;
|
||
padding-top: 2px;
|
||
}
|
||
@media (max-width: 639.98px) {
|
||
.event-time { flex-basis: 80px; }
|
||
}
|
||
.event-main { min-width: 0; }
|
||
.event-user { display: block; }
|
||
.event-what {
|
||
display: block;
|
||
margin-top: var(--kt-ai-space-1);
|
||
font-size: var(--kt-ai-text-sm);
|
||
overflow-wrap: anywhere;
|
||
}
|
||
|
||
/* Оверлей под ящиком */
|
||
.drawer-overlay {
|
||
position: fixed;
|
||
inset: 0;
|
||
background: rgb(12 10 9 / 0.45);
|
||
z-index: var(--kt-ai-z-drawer);
|
||
border: none;
|
||
padding: 0;
|
||
cursor: default;
|
||
}
|
||
.drawer-overlay:focus-visible { outline: none; }
|
||
|
||
/* Просроченная строка: приглушённая пометка слева */
|
||
tr.is-overdue td:first-child { box-shadow: inset 2px 0 0 var(--kt-ai-status-risk-fg); }
|
||
|
||
/* Поле-дата в форме */
|
||
#zform .kt-ai-input[type="date"] { padding-right: var(--kt-ai-space-4); }
|
||
|
||
/* Форма заявки */
|
||
.drawer-head h2 { margin: 0; }
|
||
.drawer-head .kt-ai-meta { margin: var(--kt-ai-space-2) 0 0; }
|
||
|
||
#zformRoot .kt-ai-field { display: block; margin-bottom: var(--kt-ai-stack-tight); }
|
||
.req { color: var(--kt-ai-fg-muted); }
|
||
|
||
.form-err {
|
||
margin-top: var(--kt-ai-space-2);
|
||
padding: var(--kt-ai-space-3) var(--kt-ai-space-4);
|
||
background: var(--kt-ai-status-risk-bg);
|
||
border: 1px solid color-mix(in srgb, var(--kt-ai-status-risk-fg) 45%, transparent);
|
||
border-radius: var(--kt-ai-radius-lg);
|
||
color: var(--kt-ai-status-risk-fg);
|
||
font-size: var(--kt-ai-text-sm);
|
||
}
|
||
|
||
.drawer-actions .spacer { flex: 1; }
|
||
.drawer-actions {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: var(--kt-ai-space-2);
|
||
}
|
||
|
||
.log-dash { font-size: var(--kt-ai-text-2xs); color: var(--kt-ai-fg-faint); }
|
||
|
||
@media (max-width: 639.98px) {
|
||
.search-input { width: 100%; }
|
||
}
|