/* ============================================================= High Voltage · липкие навигация и пользовательские ссылки Оформление панели, которую строит hv-sticknav.js. Цвета — на переменных темы, тёмная схема (.dark) подхватывается сама. ============================================================= */ #hv-sticknav { display: none; position: fixed; top: 0; /* left и width проставляет скрипт — панель ложится ровно на колонку форума (край в край), а не на окно. Значения здесь — только стартовые, до первого срабатывания. */ left: 0; right: auto; width: auto; max-width: 100%; z-index: 900; background: var(--beg100, #E8E4DB); border-bottom: 1px solid var(--borders, #ADADAD); box-shadow: 0 4px 14px rgba(0, 0, 0, .12); } #hv-sticknav.is-on { display: block; } #hv-sticknav .hv-sticknav__inner { /* Блоками друг под другом, как в самой шапке форума: сверху ряд навигации, под ним пользовательские ссылки. Без space-between — иначе на широком экране ряды расползаются по краям панели. padding 30px по бокам — как у .punbb, чтобы пункты встали ровно над колонкой контента. */ display: block; padding: 0 20px; } #hv-sticknav #pun-ulinks { margin-top: 2px; } /* Внутри панели блоки должны встать в обычный поток: у темы они position:absolute поверх шапки. Два id в селекторе — специфичность выше темы, !important не нужен. */ /* !important здесь по делу: тема задаёт этим блокам абсолютную раскладку поверх шапки (left/top/width:1100px/margin-left:-30px) и часть значений тоже с !important — без него ряды съезжают на 10px левее панели и не достают до её правого края (те самые «зазоры»). */ #hv-sticknav #pun-navlinks, #hv-sticknav #pun-ulinks { position: static !important; top: auto !important; left: auto !important; right: auto !important; bottom: auto !important; width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; box-sizing: border-box !important; flex: 0 1 auto; } /* заголовки-подписи разделов («Меню навигации» и т.п.) прячет сама тема; на случай, если у неё это завязано на позицию — прячем и здесь */ #hv-sticknav #pun-navlinks h2, #hv-sticknav #pun-ulinks h2 { display: none; } /* Логотип-«2026» с иконкой. В шапке тема красит его цветом, который в обеих схемах одинаково тёмный (там за ним светлая картинка шапки), — в панели на тёмном фоне он пропадал. Привязываем к --text1, который тема переключает вместе со схемой (класс .dark вешается на ). Иконка рисуется mask-image + background-color, поэтому ей задаём фон. */ #hv-sticknav .nav-decor, #hv-sticknav .nav-decor span, #hv-sticknav .nav-decor a { color: var(--text1, #252525); } #hv-sticknav .nav-decor i, #hv-sticknav .nav-decor .forum-main-icon { background-color: var(--text1, #252525); } /* Цвет ссылок меню. Тема красит их правилами, завязанными на шапку (за ней всегда светлая картинка), поэтому в панели на тёмной схеме они оставались тёмными — то есть невидимыми. Привязываем к --text1 / --links, которые тема переключает вместе со схемой. Триггер уведомлений исключён: у него свой цвет и подсветка непрочитанных, её перебивать нельзя. */ /* !important и span в списке — потому что тема красит пункты меню правилом с !important и через вложенный , а не сам . */ #hv-sticknav #pun-navlinks a:not(#mn-noti-trigger), #hv-sticknav #pun-navlinks a:not(#mn-noti-trigger) span, #hv-sticknav #pun-ulinks a:not(#mn-noti-trigger), #hv-sticknav #pun-ulinks a:not(#mn-noti-trigger) span { color: var(--text1, #252525) !important; } #hv-sticknav #pun-navlinks a:not(#mn-noti-trigger):hover, #hv-sticknav #pun-navlinks a:not(#mn-noti-trigger):hover span, #hv-sticknav #pun-ulinks a:not(#mn-noti-trigger):hover, #hv-sticknav #pun-ulinks a:not(#mn-noti-trigger):hover span { color: var(--links, #A85E39) !important; } /* Никаких подчёркиваний в панели: и бегущей полосы темы (.underline — её координаты посчитаны по исходному ряду меню, в панели они мимо), и обычного text-decoration у ссылок. */ #hv-sticknav .underline { display: none; } #hv-sticknav a, #hv-sticknav a:hover, #hv-sticknav a:focus { text-decoration: none; } /* выпадашка быстрой смены аккаунтов должна ложиться поверх страницы, а не обрезаться панелью */ #hv-sticknav { overflow: visible; } #hv-sticknav .nota-ql-pane { z-index: 950; } /* узкие экраны — компактнее */ @media (max-width: 640px) { #hv-sticknav .hv-sticknav__inner { padding: 0 12px; } }