SHA256
Связи - интересно но надо дорабатывать
This commit is contained in:
@@ -200,6 +200,24 @@
|
||||
background: #454b55; color: #ffffff; font-weight: 600; font-size: 20px;
|
||||
}
|
||||
|
||||
|
||||
/* Маленький знак официального пользователя. Он находится внутри .node-dot, поэтому автоматически
|
||||
масштабируется вместе с аватаркой при focus/zoom/анимациях графа. */
|
||||
.fg-official-badge {
|
||||
position: absolute;
|
||||
left: -2%;
|
||||
bottom: 0;
|
||||
width: 15%;
|
||||
height: 15%;
|
||||
min-width: 8px;
|
||||
min-height: 8px;
|
||||
object-fit: contain;
|
||||
display: block;
|
||||
z-index: 5;
|
||||
pointer-events: none;
|
||||
filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.42));
|
||||
}
|
||||
|
||||
.fg-node.is-family .node-dot {
|
||||
background: linear-gradient(165deg, #785038, #5f3e2c);
|
||||
border-color: rgba(255, 194, 143, 0.6);
|
||||
@@ -241,15 +259,17 @@
|
||||
.fg-node.is-pressed .node-dot { transform: none; }
|
||||
}
|
||||
|
||||
/* «Сияние» — постоянное живое свечение НА УЗЛЕ (аватарке), а не на линии связи.
|
||||
Пульсация остаётся мягкой, но нижняя точка теперь не проваливается почти в ноль:
|
||||
визуально сияющий пользователь всегда остаётся явно сияющим. */
|
||||
/* «Сияние» на аватарке теперь стационарное. Интенсивность зафиксирована примерно на 2/3 пути
|
||||
от прежнего минимального состояния к максимальному: заметно, но без постоянного «дыхания». */
|
||||
.fg-node.is-shine .node-dot {
|
||||
border-color: rgba(150, 240, 255, 0.62);
|
||||
animation: fg-shine-glow 3.6s ease-in-out infinite;
|
||||
box-shadow:
|
||||
0 0 8.3px rgba(146, 243, 255, 0.57),
|
||||
0 0 18.3px rgba(121, 235, 255, 0.39),
|
||||
0 0 33px rgba(100, 220, 255, 0.24);
|
||||
}
|
||||
|
||||
/* размытый радиальный ореол позади аватарки; внешний SVG-фильтр даёт мягкое гауссово размытие */
|
||||
/* Статичный размытый ореол позади аватарки — та же промежуточная интенсивность ~2/3. */
|
||||
.fg-node.is-shine .node-dot::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
@@ -259,34 +279,8 @@
|
||||
filter: url(#fg-shine-glow);
|
||||
z-index: -1;
|
||||
pointer-events: none;
|
||||
animation: fg-shine-halo 3.6s ease-in-out infinite;
|
||||
}
|
||||
|
||||
/* пульсация многослойной тени: компактное приглушённое → широкое мягкое свечение */
|
||||
@keyframes fg-shine-glow {
|
||||
0%, 100% {
|
||||
box-shadow:
|
||||
0 0 7px rgba(138, 239, 255, 0.48),
|
||||
0 0 15px rgba(118, 232, 255, 0.32),
|
||||
0 0 27px rgba(100, 220, 255, 0.19);
|
||||
}
|
||||
50% {
|
||||
box-shadow:
|
||||
0 0 9px rgba(150, 245, 255, 0.62),
|
||||
0 0 20px rgba(122, 236, 255, 0.42),
|
||||
0 0 36px rgba(100, 220, 255, 0.26);
|
||||
}
|
||||
}
|
||||
|
||||
/* ореол дышит размером и прозрачностью синхронно с тенью (мягко, без рывков) */
|
||||
@keyframes fg-shine-halo {
|
||||
0%, 100% { transform: scale(0.98); opacity: 0.72; }
|
||||
50% { transform: scale(1.12); opacity: 1; }
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.fg-node.is-shine .node-dot { animation: none; }
|
||||
.fg-node.is-shine .node-dot::before { animation: none; }
|
||||
transform: scale(1.07);
|
||||
opacity: 0.91;
|
||||
}
|
||||
|
||||
/* мягкое свечение вокруг фокуса (статичное; «дышит» вместе с размером узла ниже) */
|
||||
@@ -524,37 +518,11 @@
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
/* === Партия 2: бейдж-счётчик связей, поиск, хлебные крошки, цветовые кластеры ============ */
|
||||
|
||||
/* Бейдж числа связей — маленькая пилюля в правом-верхнем углу аватарки */
|
||||
.fg-node-badge {
|
||||
position: absolute;
|
||||
top: -2px;
|
||||
right: -2px;
|
||||
min-width: 16px;
|
||||
height: 16px;
|
||||
padding: 0 4px;
|
||||
border-radius: 999px;
|
||||
background: rgba(16, 24, 40, 0.92);
|
||||
border: 1px solid rgba(150, 200, 255, 0.5);
|
||||
color: #d9ecff;
|
||||
font-size: 9px;
|
||||
font-weight: 700;
|
||||
line-height: 14px;
|
||||
text-align: center;
|
||||
pointer-events: none;
|
||||
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
.fg-node.is-focus .fg-node-badge {
|
||||
background: rgba(61, 196, 223, 0.95);
|
||||
border-color: rgba(220, 245, 255, 0.8);
|
||||
color: #06131c;
|
||||
}
|
||||
.fg-node.is-tier2 .fg-node-badge { transform: scale(0.85); }
|
||||
/* === Партия 2: поиск, хлебные крошки, цветовые кластеры ============================== */
|
||||
|
||||
/* Кластерная аура по категории удалена (цветной фон/обводка узла убраны). Сияющим/фокусу
|
||||
box-shadow не навязываем — у них свой эффект свечения (is-shine/is-focus выше). */
|
||||
.fg-node.is-shine .node-dot, .fg-node.is-focus .node-dot { box-shadow: none; }
|
||||
.fg-node.is-focus:not(.is-shine) .node-dot { box-shadow: none; }
|
||||
|
||||
/* Строка поиска (оверлей вверху, под панелью фильтров) */
|
||||
.fg-search {
|
||||
|
||||
Reference in New Issue
Block a user