128 lines
6.3 KiB
CSS
128 lines
6.3 KiB
CSS
:root {
|
|
/* ============================================================
|
|
ОСНОВНЫЕ ГРАДИЕНТЫ (синие) — для инфоблоков, диаграмм, блок-схем
|
|
============================================================ */
|
|
--gradient-navy-start: rgb(0, 75, 158);
|
|
--gradient-navy-end: rgb(0, 164, 230);
|
|
--gradient-navy: linear-gradient(60deg, var(--gradient-navy-start), var(--gradient-navy-end));
|
|
|
|
--gradient-azure-start: rgb(36, 139, 224);
|
|
--gradient-azure-end: rgb(65, 205, 255);
|
|
--gradient-azure: linear-gradient(60deg, var(--gradient-azure-start), var(--gradient-azure-end));
|
|
|
|
--gradient-sky-start: rgb(94, 179, 236);
|
|
--gradient-sky-end: rgb(173, 214, 247);
|
|
--gradient-sky: linear-gradient(60deg, var(--gradient-sky-start), var(--gradient-sky-end));
|
|
|
|
--gradient-teal-dark-start: rgb(60, 129, 160);
|
|
--gradient-teal-dark-end: rgb(151, 195, 219);
|
|
--gradient-teal-dark: linear-gradient(60deg, var(--gradient-teal-dark-start), var(--gradient-teal-dark-end));
|
|
|
|
--gradient-teal-light-start: rgb(102, 190, 218);
|
|
--gradient-teal-light-end: rgb(161, 226, 233);
|
|
--gradient-teal-light: linear-gradient(60deg, var(--gradient-teal-light-start), var(--gradient-teal-light-end));
|
|
|
|
--gradient-navy-dark-start: rgb(0, 33, 92);
|
|
--gradient-navy-dark-end: rgb(0, 101, 170);
|
|
--gradient-navy-dark: linear-gradient(60deg, var(--gradient-navy-dark-start), var(--gradient-navy-dark-end));
|
|
|
|
--gradient-ice-start: rgb(206, 234, 255);
|
|
--gradient-ice-end: rgb(241, 249, 255);
|
|
--gradient-ice: linear-gradient(60deg, var(--gradient-ice-start), var(--gradient-ice-end));
|
|
|
|
--gradient-frost-start: rgb(215, 229, 237);
|
|
--gradient-frost-end: rgb(243, 245, 247);
|
|
--gradient-frost: linear-gradient(60deg, var(--gradient-frost-start), var(--gradient-frost-end));
|
|
|
|
/* ============================================================
|
|
ОСНОВНАЯ ПАЛИТРА — для диаграмм, блок-схем, смысловых выделений
|
|
============================================================ */
|
|
--gradient-purple-start: rgb(161, 44, 126);
|
|
--gradient-purple-end: rgb(191, 51, 168);
|
|
--gradient-purple: linear-gradient(60deg, var(--gradient-purple-start), var(--gradient-purple-end));
|
|
|
|
--gradient-red-start: rgb(225, 48, 66);
|
|
--gradient-red-end: rgb(241, 103, 117);
|
|
--gradient-red: linear-gradient(60deg, var(--gradient-red-start), var(--gradient-red-end));
|
|
|
|
--gradient-orange-start: rgb(255, 142, 88);
|
|
--gradient-orange-end: rgb(254, 180, 106);
|
|
--gradient-orange: linear-gradient(60deg, var(--gradient-orange-start), var(--gradient-orange-end));
|
|
|
|
--gradient-olive-start: rgb(187, 189, 57);
|
|
--gradient-olive-end: rgb(197, 231, 103);
|
|
--gradient-olive: linear-gradient(60deg, var(--gradient-olive-start), var(--gradient-olive-end));
|
|
|
|
--gradient-green-start: rgb(44, 181, 135);
|
|
--gradient-green-end: rgb(57, 224, 137);
|
|
--gradient-green: linear-gradient(60deg, var(--gradient-green-start), var(--gradient-green-end));
|
|
|
|
--gradient-green-dark-start: rgb(25, 111, 82);
|
|
--gradient-green-dark-end: rgb(38, 160, 119);
|
|
--gradient-green-dark: linear-gradient(60deg, var(--gradient-green-dark-start), var(--gradient-green-dark-end));
|
|
|
|
--gradient-blue-start: rgb(7, 144, 203);
|
|
--gradient-blue-end: rgb(17, 203, 217);
|
|
--gradient-blue: linear-gradient(60deg, var(--gradient-blue-start), var(--gradient-blue-end));
|
|
|
|
--gradient-cyan-start: rgb(27, 211, 247);
|
|
--gradient-cyan-end: rgb(101, 240, 238);
|
|
--gradient-cyan: linear-gradient(60deg, var(--gradient-cyan-start), var(--gradient-cyan-end));
|
|
|
|
/* ============================================================
|
|
ДОПОЛНИТЕЛЬНЫЕ ГРАДИЕНТЫ — для диаграмм, блок-схем, смысловых выделений
|
|
============================================================ */
|
|
--gradient-violet-start: rgb(138, 92, 231);
|
|
--gradient-violet-end: rgb(148, 57, 227);
|
|
--gradient-violet: linear-gradient(60deg, var(--gradient-violet-start), var(--gradient-violet-end));
|
|
|
|
--gradient-lavender-start: rgb(168, 143, 248);
|
|
--gradient-lavender-end: rgb(132, 159, 246);
|
|
--gradient-lavender: linear-gradient(60deg, var(--gradient-lavender-start), var(--gradient-lavender-end));
|
|
|
|
--gradient-pink-start: rgb(241, 141, 206);
|
|
--gradient-pink-end: rgb(222, 146, 232);
|
|
--gradient-pink: linear-gradient(60deg, var(--gradient-pink-start), var(--gradient-pink-end));
|
|
|
|
/* ============================================================
|
|
ДОПОЛНИТЕЛЬНЫЕ ЦВЕТА — для мелкой графики, линий (одиночные акценты)
|
|
Соответствуют по цветовому тону основной палитре и доп. градиентам
|
|
============================================================ */
|
|
--accent-purple: rgb(181, 48, 154);
|
|
--accent-red: rgb(236, 86, 101);
|
|
--accent-orange: rgb(255, 171, 102);
|
|
--accent-olive: rgb(194, 220, 91);
|
|
--accent-green: rgb(50, 202, 136);
|
|
--accent-green-dark: rgb(34, 146, 109);
|
|
--accent-blue: rgb(14, 186, 213);
|
|
--accent-cyan: rgb(78, 231, 244);
|
|
--accent-violet: rgb(145, 82, 230);
|
|
--accent-lavender: rgb(157, 154, 247);
|
|
--accent-pink: rgb(232, 143, 219);
|
|
|
|
/* ============================================================
|
|
ЦВЕТА ТЕКСТА
|
|
============================================================ */
|
|
--text-color-blue: rgb(0, 121, 194);
|
|
--text-color-dark: rgb(82, 90, 100);
|
|
--text-color-gray: rgb(146, 154, 164);
|
|
--text-color-white: rgb(255, 255, 255);
|
|
|
|
/* ============================================================
|
|
ОСНОВНЫЕ ЦВЕТА ДЛЯ МЕЛКОЙ ГРАФИКИ, ЛИНИЙ
|
|
Два тональных ряда: синий (от --text-color-blue) и серый
|
|
(от --text-color-gray до белого)
|
|
============================================================ */
|
|
--graphic-blue-1: rgb(0, 121, 194); /* = --text-color-blue */
|
|
--graphic-blue-2: rgb(67, 183, 247);
|
|
--graphic-blue-3: rgb(137, 207, 255);
|
|
--graphic-blue-4: rgb(117, 170, 197);
|
|
--graphic-blue-5: rgb(143, 215, 228);
|
|
--graphic-blue-6: rgb(0, 65, 129);
|
|
|
|
--graphic-gray-1: rgb(146, 154, 164); /* = --text-color-gray */
|
|
--graphic-gray-2: rgb(206, 210, 214);
|
|
--graphic-gray-3: rgb(233, 235, 237);
|
|
--graphic-gray-4: rgb(255, 255, 255); /* = --text-color-white */
|
|
}
|