/* * Индикатор связи панели /fadmin (№75 п.2). * * ПОЧЕМУ ОТДЕЛЬНЫЙ ФАЙЛ. Раньше эти правила жили ТОЛЬКО в * moonshine-custom.css — ассете донора. Filament его не подключает, * поэтому точка индикатора в /fadmin была невидимой: разметка есть, * скрипт работает, состояние меняется, а показать нечего. * * Донорский файл не трогаем (UI MoonShine заморожен), поэтому правила * продублированы здесь. Дубль осознанный и временный: он исчезнет * вместе с moonshine-custom.css в конце заката. Если правите цвета — * правьте в обоих местах, пока донор жив. */ .neho-conn-indicator { position: relative; display: inline-flex; align-items: center; cursor: pointer; padding: 0 0.15rem; } .neho-conn-dot { width: 0.6rem; height: 0.6rem; border-radius: 50%; background: #9ca3af; /* серый — до первого пинга */ box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.05); transition: background-color 0.3s ease; } .neho-conn-indicator[data-state="ok"] .neho-conn-dot { background: #16a34a; } .neho-conn-indicator[data-state="slow"] .neho-conn-dot { background: #d97706; } .neho-conn-indicator[data-state="down"] .neho-conn-dot { background: #dc2626; animation: neho-conn-pulse 1.2s ease-in-out infinite; } @keyframes neho-conn-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.35; } } /* * ⚠️ ЦВЕТА ЗДЕСЬ ЯВНЫЕ, А НЕ ПЕРЕМЕННЫЕ ДОНОРА. Правила переносились из * moonshine-custom.css вместе с --color-base и --color-base-text — этих * переменных в Filament НЕТ, поэтому работали фоллбеки: белый фон и * inherit-цвет текста. На тёмной теме текст наследовался светлым, и окно * получалось белым по белому — читать нечего. * * Тему Filament переключает классом на , поэтому тёмный вариант * задан через html.dark, а не prefers-color-scheme: ручной переключатель * в панели важнее системной настройки, иначе выбор человека * игнорировался бы. */ .neho-conn-popup { position: absolute; top: calc(100% + 6px); right: 0; z-index: 100; min-width: 190px; padding: 0.5rem 0.65rem; border-radius: var(--radius-lg, 6px); background: #fff; color: #111827; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18); font-size: var(--text-sm, 0.8rem); line-height: 1.4; white-space: normal; text-align: left; } html.dark .neho-conn-popup { background: #18181b; color: #fafafa; border-color: rgba(255, 255, 255, 0.16); box-shadow: 0 4px 14px rgba(0, 0, 0, 0.55); } /* Точка на тёмном фоне: светлая обводка вместо чёрной — иначе ободок сливается с шапкой и индикатор выглядит меньше, чем на светлой. */ html.dark .neho-conn-dot { box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.08); } .neho-conn-popup[hidden] { display: none; } .neho-conn-popup-status { font-weight: 600; } .neho-conn-form-warning { position: fixed; left: 50%; bottom: 1rem; transform: translateX(-50%); z-index: 90; max-width: 92vw; padding: 0.5rem 0.9rem; border-radius: var(--radius-lg, 6px); background: #dc2626; color: #fff; font-size: 0.85rem; box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25); } .neho-conn-form-warning[hidden] { display: none; }