85 lines
1.8 KiB
CSS
85 lines
1.8 KiB
CSS
@tailwind base;
|
|
@tailwind components;
|
|
@tailwind utilities;
|
|
|
|
@layer base {
|
|
/* Светлая тема (по умолчанию переменные :root) */
|
|
:root {
|
|
--bg: 241 245 249;
|
|
--surface: 255 255 255;
|
|
--surface-2: 248 250 252;
|
|
--muted: 226 232 240;
|
|
--border: 226 232 240;
|
|
--fg: 15 23 42;
|
|
--fg-muted: 100 116 139;
|
|
color-scheme: light;
|
|
}
|
|
/* Тёмная тема (OLED) */
|
|
.dark {
|
|
--bg: 15 23 42;
|
|
--surface: 17 28 50;
|
|
--surface-2: 22 34 60;
|
|
--muted: 39 47 66;
|
|
--border: 39 52 75;
|
|
--fg: 248 250 252;
|
|
--fg-muted: 148 163 184;
|
|
color-scheme: dark;
|
|
}
|
|
|
|
html,
|
|
body,
|
|
#root {
|
|
height: 100%;
|
|
}
|
|
body {
|
|
@apply bg-bg text-fg font-sans antialiased;
|
|
font-feature-settings: 'tnum' 1, 'cv01' 1;
|
|
}
|
|
.tnum {
|
|
font-variant-numeric: tabular-nums;
|
|
}
|
|
*:focus-visible {
|
|
@apply outline-none ring-2 ring-accent/70 ring-offset-2 ring-offset-bg;
|
|
}
|
|
::-webkit-scrollbar {
|
|
width: 10px;
|
|
height: 10px;
|
|
}
|
|
::-webkit-scrollbar-thumb {
|
|
@apply bg-border rounded-full;
|
|
}
|
|
}
|
|
|
|
/* Анимированный пунктир связей на карте (поток данных по линку) */
|
|
.link-flow {
|
|
stroke-dasharray: 8 10;
|
|
animation: linkflow 1s linear infinite;
|
|
}
|
|
@keyframes linkflow {
|
|
to {
|
|
stroke-dashoffset: -18;
|
|
}
|
|
}
|
|
|
|
/* Мигающее уведомление на доске объявлений */
|
|
.sm-blink {
|
|
animation: smblink 1.05s steps(1, end) infinite;
|
|
}
|
|
@keyframes smblink {
|
|
0%, 55% {
|
|
box-shadow: inset 3px 0 0 0 rgb(var(--crit, 239 68 68));
|
|
background-color: rgba(239, 68, 68, 0.14);
|
|
}
|
|
56%, 100% {
|
|
box-shadow: inset 3px 0 0 0 transparent;
|
|
background-color: rgba(239, 68, 68, 0.04);
|
|
}
|
|
}
|
|
|
|
@media (prefers-reduced-motion: reduce) {
|
|
* {
|
|
animation-duration: 0.001ms !important;
|
|
transition-duration: 0.001ms !important;
|
|
}
|
|
}
|