SHA256
Обновить UI профиля и навигации
This commit is contained in:
+137
-336
@@ -1,26 +1,26 @@
|
||||
/*
|
||||
* Единый визуальный язык кнопок основного приложения:
|
||||
* белое содержимое, без рамок и самостоятельной подложки.
|
||||
* Shared semantic button roles.
|
||||
*
|
||||
* Исключения:
|
||||
* - фильтры групп на экране «Связи» (.fg-filter-chip) сохраняют прежний вид;
|
||||
* - нижний toolbar (.toolbar-btn) полностью сохраняет исходное оформление.
|
||||
* Stage 4: styling is opt-in by an existing UI role class. Component-owned
|
||||
* controls (TopBar, Dropdown, Toolbar, tabs, ScrollToBottom, etc.) are styled
|
||||
* by their own owner stylesheet and are intentionally absent from this file.
|
||||
*/
|
||||
:root button:not(.fg-filter-chip):not(.toolbar-btn),
|
||||
:root a.primary-btn,
|
||||
:root a.secondary-btn,
|
||||
:root a.destructive-btn,
|
||||
:root a.ghost-btn,
|
||||
:root a.icon-btn,
|
||||
:root a.text-btn {
|
||||
color: #ffffff !important;
|
||||
background: transparent !important;
|
||||
background-image: none !important;
|
||||
border: 0 !important;
|
||||
box-shadow: none !important;
|
||||
text-shadow: none !important;
|
||||
backdrop-filter: none !important;
|
||||
-webkit-backdrop-filter: none !important;
|
||||
.ui-button,
|
||||
.primary-btn,
|
||||
.secondary-btn,
|
||||
.destructive-btn,
|
||||
.ghost-btn,
|
||||
.icon-btn,
|
||||
.text-btn,
|
||||
.shine-btn {
|
||||
color: #ffffff;
|
||||
background: transparent;
|
||||
background-image: none;
|
||||
border: 0;
|
||||
box-shadow: none;
|
||||
text-shadow: none;
|
||||
backdrop-filter: none;
|
||||
-webkit-backdrop-filter: none;
|
||||
transition:
|
||||
transform 90ms ease,
|
||||
box-shadow 90ms ease,
|
||||
@@ -28,350 +28,151 @@
|
||||
filter 120ms ease;
|
||||
}
|
||||
|
||||
:root button:not(.fg-filter-chip):not(.toolbar-btn):hover,
|
||||
:root a.primary-btn:hover,
|
||||
:root a.secondary-btn:hover,
|
||||
:root a.destructive-btn:hover,
|
||||
:root a.ghost-btn:hover,
|
||||
:root a.icon-btn:hover,
|
||||
:root a.text-btn:hover {
|
||||
color: #ffffff !important;
|
||||
background: transparent !important;
|
||||
border: 0 !important;
|
||||
box-shadow: none !important;
|
||||
.ui-button:hover,
|
||||
.primary-btn:hover,
|
||||
.secondary-btn:hover,
|
||||
.destructive-btn:hover,
|
||||
.ghost-btn:hover,
|
||||
.icon-btn:hover,
|
||||
.text-btn:hover,
|
||||
.shine-btn:hover {
|
||||
color: #ffffff;
|
||||
background: transparent;
|
||||
border: 0;
|
||||
box-shadow: none;
|
||||
filter: brightness(1.12);
|
||||
}
|
||||
|
||||
/* Короткий press-feedback: кнопка визуально уходит внутрь поверхности.
|
||||
* Эффект существует только пока кнопка физически нажата.
|
||||
*/
|
||||
:root button:not(.fg-filter-chip):not(.toolbar-btn):active,
|
||||
:root a.primary-btn:active,
|
||||
:root a.secondary-btn:active,
|
||||
:root a.destructive-btn:active,
|
||||
:root a.ghost-btn:active,
|
||||
:root a.icon-btn:active,
|
||||
:root a.text-btn:active {
|
||||
color: #ffffff !important;
|
||||
background: rgba(0, 0, 0, 0.12) !important;
|
||||
border: 0 !important;
|
||||
.primary-btn:hover,
|
||||
.secondary-btn:hover,
|
||||
.destructive-btn:hover,
|
||||
.ghost-btn:hover,
|
||||
.icon-btn:hover,
|
||||
.text-btn:hover,
|
||||
.shine-btn:hover {
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.ui-button:active,
|
||||
.primary-btn:active,
|
||||
.secondary-btn:active,
|
||||
.destructive-btn:active,
|
||||
.ghost-btn:active,
|
||||
.icon-btn:active,
|
||||
.text-btn:active,
|
||||
.shine-btn:active {
|
||||
color: #ffffff;
|
||||
background: rgba(0, 0, 0, 0.12);
|
||||
border: 0;
|
||||
box-shadow:
|
||||
inset 0 3px 8px rgba(0, 0, 0, 0.58),
|
||||
inset 0 -1px 2px rgba(255, 255, 255, 0.08) !important;
|
||||
inset 0 -1px 2px rgba(255, 255, 255, 0.08);
|
||||
transform: translateY(1px) scale(0.97);
|
||||
filter: brightness(0.9);
|
||||
}
|
||||
|
||||
|
||||
:root button:not(.fg-filter-chip):not(.toolbar-btn):disabled,
|
||||
:root button:not(.fg-filter-chip):not(.toolbar-btn)[aria-disabled='true'],
|
||||
:root a.primary-btn[aria-disabled='true'],
|
||||
:root a.secondary-btn[aria-disabled='true'],
|
||||
:root a.destructive-btn[aria-disabled='true'],
|
||||
:root a.ghost-btn[aria-disabled='true'],
|
||||
:root a.icon-btn[aria-disabled='true'],
|
||||
:root a.text-btn[aria-disabled='true'] {
|
||||
color: rgba(255, 255, 255, 0.42) !important;
|
||||
background: transparent !important;
|
||||
border: 0 !important;
|
||||
box-shadow: none !important;
|
||||
transform: none !important;
|
||||
filter: none !important;
|
||||
.ui-button:disabled,
|
||||
.primary-btn:disabled,
|
||||
.secondary-btn:disabled,
|
||||
.destructive-btn:disabled,
|
||||
.ghost-btn:disabled,
|
||||
.icon-btn:disabled,
|
||||
.text-btn:disabled,
|
||||
.shine-btn:disabled,
|
||||
.ui-button[aria-disabled='true'],
|
||||
.primary-btn[aria-disabled='true'],
|
||||
.secondary-btn[aria-disabled='true'],
|
||||
.destructive-btn[aria-disabled='true'],
|
||||
.ghost-btn[aria-disabled='true'],
|
||||
.icon-btn[aria-disabled='true'],
|
||||
.text-btn[aria-disabled='true'],
|
||||
.shine-btn[aria-disabled='true'] {
|
||||
color: rgba(255, 255, 255, 0.42);
|
||||
background: transparent;
|
||||
border: 0;
|
||||
box-shadow: none;
|
||||
transform: none;
|
||||
filter: none;
|
||||
}
|
||||
|
||||
/* Убираем декоративные стеклянные/неоновые подложки самих кнопок.
|
||||
* Переключатель канала исключён: его ::after является функциональным бегунком.
|
||||
* Toolbar исключён целиком: у него остаётся исходная графика приложения.
|
||||
*/
|
||||
:root button:not(.fg-filter-chip):not(.toolbar-btn):not(.channel-toggle-btn)::before,
|
||||
:root button:not(.fg-filter-chip):not(.toolbar-btn):not(.channel-toggle-btn)::after {
|
||||
background: transparent !important;
|
||||
background-image: none !important;
|
||||
border-color: transparent !important;
|
||||
box-shadow: none !important;
|
||||
/* Decorative button pseudo-elements were not part of the Stage 3.1 surface. */
|
||||
.ui-button::before,
|
||||
.primary-btn::before,
|
||||
.secondary-btn::before,
|
||||
.destructive-btn::before,
|
||||
.ghost-btn::before,
|
||||
.icon-btn::before,
|
||||
.text-btn::before,
|
||||
.shine-btn::before,
|
||||
.ui-button::after,
|
||||
.primary-btn::after,
|
||||
.secondary-btn::after,
|
||||
.destructive-btn::after,
|
||||
.ghost-btn::after,
|
||||
.icon-btn::after,
|
||||
.text-btn::after,
|
||||
.shine-btn::after {
|
||||
background: transparent;
|
||||
background-image: none;
|
||||
border-color: transparent;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
/* Toolbar возвращён к исходному оформлению. Добавляем только краткое вдавливание
|
||||
* на физическое нажатие; active-вкладка после отпускания остаётся такой, как была.
|
||||
*/
|
||||
:root .toolbar-btn {
|
||||
transition:
|
||||
transform 90ms ease,
|
||||
box-shadow 90ms ease,
|
||||
background-color 90ms ease,
|
||||
color 120ms ease;
|
||||
}
|
||||
|
||||
:root .toolbar-btn:active {
|
||||
transform: translateY(1px) scale(0.96);
|
||||
background: rgba(0, 0, 0, 0.14) !important;
|
||||
box-shadow:
|
||||
inset 0 4px 10px rgba(0, 0, 0, 0.62),
|
||||
inset 0 -1px 2px rgba(255, 255, 255, 0.08) !important;
|
||||
}
|
||||
|
||||
/* Клавиатурный фокус остаётся различимым без постоянной рамки кнопки. */
|
||||
:root button:not(.fg-filter-chip):not(.toolbar-btn):focus-visible,
|
||||
:root a.primary-btn:focus-visible,
|
||||
:root a.secondary-btn:focus-visible,
|
||||
:root a.destructive-btn:focus-visible,
|
||||
:root a.ghost-btn:focus-visible,
|
||||
:root a.icon-btn:focus-visible,
|
||||
:root a.text-btn:focus-visible {
|
||||
.ui-button:focus-visible,
|
||||
.primary-btn:focus-visible,
|
||||
.secondary-btn:focus-visible,
|
||||
.destructive-btn:focus-visible,
|
||||
.ghost-btn:focus-visible,
|
||||
.icon-btn:focus-visible,
|
||||
.text-btn:focus-visible,
|
||||
.shine-btn:focus-visible {
|
||||
outline: 2px solid rgba(255, 255, 255, 0.62);
|
||||
outline-offset: 2px;
|
||||
}
|
||||
|
||||
/* Уведомления: «Ответы / События».
|
||||
* ВАЖНО: общий button:hover выше имеет большую специфичность, поэтому для выбранной
|
||||
* вкладки фиксируем отдельный data-selected и перечисляем hover/focus/active.
|
||||
* Так выбранная кнопка остаётся визуально вдавленной и после отпускания мыши.
|
||||
*/
|
||||
:root body .notifications-screen .tabs button.notification-tab-btn[data-selected='true'],
|
||||
:root body .notifications-screen .tabs button.notification-tab-btn[data-selected='true']:hover,
|
||||
:root body .notifications-screen .tabs button.notification-tab-btn[data-selected='true']:focus,
|
||||
:root body .notifications-screen .tabs button.notification-tab-btn[data-selected='true']:focus-visible,
|
||||
:root body .notifications-screen .tabs button.notification-tab-btn[data-selected='true']:active {
|
||||
color: #ffffff !important;
|
||||
background: rgba(0, 0, 0, 0.18) !important;
|
||||
border: 0 !important;
|
||||
box-shadow:
|
||||
inset 0 4px 11px rgba(0, 0, 0, 0.72),
|
||||
inset 0 -1px 2px rgba(255, 255, 255, 0.10) !important;
|
||||
transform: translateY(1px) scale(0.965) !important;
|
||||
filter: brightness(0.88) !important;
|
||||
}
|
||||
|
||||
:root body .notifications-screen .tabs button.notification-tab-btn[data-selected='false'],
|
||||
:root body .notifications-screen .tabs button.notification-tab-btn[data-selected='false']:hover {
|
||||
color: #ffffff !important;
|
||||
background: transparent !important;
|
||||
border: 0 !important;
|
||||
box-shadow: none !important;
|
||||
transform: none !important;
|
||||
filter: none !important;
|
||||
}
|
||||
|
||||
/* Неактивная вкладка кратко вдавливается во время физического нажатия.
|
||||
* После click data-selected меняется и постоянный стиль остаётся уже на ней.
|
||||
*/
|
||||
:root body .notifications-screen .tabs button.notification-tab-btn[data-selected='false']:active {
|
||||
background: rgba(0, 0, 0, 0.12) !important;
|
||||
box-shadow:
|
||||
inset 0 3px 8px rgba(0, 0, 0, 0.58),
|
||||
inset 0 -1px 2px rgba(255, 255, 255, 0.08) !important;
|
||||
transform: translateY(1px) scale(0.97) !important;
|
||||
filter: brightness(0.9) !important;
|
||||
}
|
||||
|
||||
/* Верхний toolbar — отдельная цветовая роль: золотой текст и иконки.
|
||||
* Это правило намеренно расположено после глобального белого button-rule. */
|
||||
:root .topbar-slot button:not(.fg-filter-chip):not(.toolbar-btn),
|
||||
:root .topbar-slot button:not(.fg-filter-chip):not(.toolbar-btn):hover,
|
||||
:root .topbar-slot button:not(.fg-filter-chip):not(.toolbar-btn):focus,
|
||||
:root .topbar-slot button:not(.fg-filter-chip):not(.toolbar-btn):focus-visible,
|
||||
:root .topbar-slot button:not(.fg-filter-chip):not(.toolbar-btn):active,
|
||||
:root .network-header-overlay button:not(.fg-filter-chip):not(.toolbar-btn),
|
||||
:root .network-header-overlay button:not(.fg-filter-chip):not(.toolbar-btn):hover,
|
||||
:root .network-header-overlay button:not(.fg-filter-chip):not(.toolbar-btn):focus,
|
||||
:root .network-header-overlay button:not(.fg-filter-chip):not(.toolbar-btn):focus-visible,
|
||||
:root .network-header-overlay button:not(.fg-filter-chip):not(.toolbar-btn):active {
|
||||
color: var(--app-topbar-gold) !important;
|
||||
}
|
||||
|
||||
/* Верхний toolbar: вместо золотого акцента — белые глифы с голубым ореолом.
|
||||
* Правило стоит последним, чтобы перекрыть общий белый button-reset и старую золотую роль. */
|
||||
:root .topbar-slot button:not(.fg-filter-chip):not(.toolbar-btn),
|
||||
:root .topbar-slot button:not(.fg-filter-chip):not(.toolbar-btn):hover,
|
||||
:root .topbar-slot button:not(.fg-filter-chip):not(.toolbar-btn):focus,
|
||||
:root .topbar-slot button:not(.fg-filter-chip):not(.toolbar-btn):active,
|
||||
:root .network-header-overlay button:not(.fg-filter-chip):not(.toolbar-btn),
|
||||
:root .network-header-overlay button:not(.fg-filter-chip):not(.toolbar-btn):hover,
|
||||
:root .network-header-overlay button:not(.fg-filter-chip):not(.toolbar-btn):focus,
|
||||
:root .network-header-overlay button:not(.fg-filter-chip):not(.toolbar-btn):active {
|
||||
color: #F7FBFF !important;
|
||||
text-shadow:
|
||||
0 0 5px rgba(92, 190, 255, 0.72),
|
||||
0 0 12px rgba(72, 145, 255, 0.34) !important;
|
||||
filter: drop-shadow(0 0 4px rgba(92, 190, 255, 0.56)) !important;
|
||||
}
|
||||
|
||||
:root .topbar-slot button:not(.fg-filter-chip):not(.toolbar-btn):focus-visible,
|
||||
:root .network-header-overlay button:not(.fg-filter-chip):not(.toolbar-btn):focus-visible {
|
||||
color: #FFFFFF !important;
|
||||
outline: none !important;
|
||||
filter:
|
||||
drop-shadow(0 0 5px rgba(110, 205, 255, 0.82))
|
||||
drop-shadow(0 0 10px rgba(72, 145, 255, 0.42)) !important;
|
||||
}
|
||||
|
||||
/* Личный чат: нижние иконки используют ту же бело-голубую роль, что и верхний toolbar. */
|
||||
:root .dm-chat-input button.dm-emoji-btn,
|
||||
:root .dm-chat-input button.dm-send-btn,
|
||||
:root .dm-chat-input button.dm-edit-banner__close,
|
||||
:root .dm-chat-input button.dm-emoji-btn:hover,
|
||||
:root .dm-chat-input button.dm-send-btn:hover,
|
||||
:root .dm-chat-input button.dm-edit-banner__close:hover,
|
||||
:root .dm-chat-input button.dm-emoji-btn:focus,
|
||||
:root .dm-chat-input button.dm-send-btn:focus,
|
||||
:root .dm-chat-input button.dm-edit-banner__close:focus {
|
||||
color: #F7FBFF !important;
|
||||
text-shadow:
|
||||
0 0 5px rgba(92, 190, 255, 0.72),
|
||||
0 0 12px rgba(72, 145, 255, 0.34) !important;
|
||||
filter: drop-shadow(0 0 4px rgba(92, 190, 255, 0.46)) !important;
|
||||
}
|
||||
|
||||
/* Второй общий тип кнопок. Цвет меняется одной переменной --shine-action-blue
|
||||
* в main.css. Экран настройки сервера намеренно не получает этот класс. */
|
||||
:root .screen-content.filled-action-buttons button:not(.icon-btn):not(.shine-local-demo-btn),
|
||||
:root .screen-content.filled-action-buttons a.primary-btn,
|
||||
:root .screen-content.filled-action-buttons a.secondary-btn,
|
||||
:root .screen-content.filled-action-buttons a.ghost-btn,
|
||||
:root .screen-content.filled-action-buttons a.text-btn {
|
||||
color: #ffffff !important;
|
||||
background: var(--shine-action-blue) !important;
|
||||
background-image: linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,0)) !important;
|
||||
border: 0 !important;
|
||||
box-shadow:
|
||||
inset 0 1px 0 rgba(255,255,255,.24),
|
||||
0 8px 22px rgba(var(--shine-action-blue-rgb), .24) !important;
|
||||
text-shadow: 0 1px 2px rgba(0,0,0,.18) !important;
|
||||
/* Explicit filled-action variant used by pre-auth/settings/profile screens. */
|
||||
.filled-action-buttons :is(.primary-btn, .secondary-btn, .destructive-btn, .ghost-btn, .text-btn, .shine-btn, .square-btn, .login-panel-inline-back, .registration-faq-link, .profiles-select, .profiles-close) {
|
||||
color: #ffffff;
|
||||
background: var(--shine-action-blue);
|
||||
background-image: linear-gradient(180deg, rgba(255, 255, 255, 0.14), rgba(255, 255, 255, 0));
|
||||
border: 0;
|
||||
border-radius: 14px;
|
||||
}
|
||||
|
||||
:root .screen-content.filled-action-buttons button:not(.icon-btn):not(.shine-local-demo-btn):hover,
|
||||
:root .screen-content.filled-action-buttons a.primary-btn:hover,
|
||||
:root .screen-content.filled-action-buttons a.secondary-btn:hover,
|
||||
:root .screen-content.filled-action-buttons a.ghost-btn:hover,
|
||||
:root .screen-content.filled-action-buttons a.text-btn:hover {
|
||||
background: var(--shine-action-blue-hover) !important;
|
||||
box-shadow:
|
||||
inset 0 1px 0 rgba(255,255,255,.28),
|
||||
0 10px 26px rgba(var(--shine-action-blue-rgb), .32) !important;
|
||||
inset 0 1px 0 rgba(255, 255, 255, 0.24),
|
||||
0 8px 22px rgba(var(--shine-action-blue-rgb), 0.24);
|
||||
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.18);
|
||||
}
|
||||
|
||||
:root .screen-content.filled-action-buttons button:not(.icon-btn):not(.shine-local-demo-btn):active,
|
||||
:root .screen-content.filled-action-buttons a.primary-btn:active,
|
||||
:root .screen-content.filled-action-buttons a.secondary-btn:active,
|
||||
:root .screen-content.filled-action-buttons a.ghost-btn:active,
|
||||
:root .screen-content.filled-action-buttons a.text-btn:active {
|
||||
background: var(--shine-action-blue-pressed) !important;
|
||||
box-shadow: inset 0 3px 8px rgba(0,0,0,.26) !important;
|
||||
}
|
||||
|
||||
:root .screen-content.filled-action-buttons button:not(.icon-btn):not(.shine-local-demo-btn):disabled {
|
||||
color: rgba(255,255,255,.58) !important;
|
||||
background: rgba(var(--shine-action-blue-rgb), .42) !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
/* Специальная системная кнопка должна сохранять синюю круглую подложку,
|
||||
* несмотря на глобальный borderless-reset выше. */
|
||||
:root button.scroll-to-bottom-btn,
|
||||
:root button.scroll-to-bottom-btn:hover,
|
||||
:root button.scroll-to-bottom-btn:focus,
|
||||
:root button.scroll-to-bottom-btn:focus-visible {
|
||||
color: #ffffff !important;
|
||||
background: var(--shine-action-blue) !important;
|
||||
border: 0 !important;
|
||||
.filled-action-buttons :is(.primary-btn, .secondary-btn, .destructive-btn, .ghost-btn, .text-btn, .shine-btn, .square-btn, .login-panel-inline-back, .registration-faq-link, .profiles-select, .profiles-close):hover {
|
||||
background: var(--shine-action-blue-hover);
|
||||
box-shadow:
|
||||
inset 0 1px 0 rgba(255,255,255,.25),
|
||||
0 10px 26px rgba(var(--shine-action-blue-rgb), .34) !important;
|
||||
filter: none !important;
|
||||
inset 0 1px 0 rgba(255, 255, 255, 0.28),
|
||||
0 10px 26px rgba(var(--shine-action-blue-rgb), 0.32);
|
||||
filter: brightness(1.12);
|
||||
}
|
||||
|
||||
:root button.scroll-to-bottom-btn:hover {
|
||||
background: var(--shine-action-blue-hover) !important;
|
||||
.filled-action-buttons :is(.primary-btn, .secondary-btn, .destructive-btn, .ghost-btn, .text-btn, .shine-btn, .square-btn, .login-panel-inline-back, .registration-faq-link, .profiles-select, .profiles-close):active {
|
||||
background: var(--shine-action-blue-pressed);
|
||||
box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.26);
|
||||
transform: translateY(1px) scale(0.97);
|
||||
filter: brightness(0.9);
|
||||
}
|
||||
|
||||
:root button.scroll-to-bottom-btn:active {
|
||||
background: var(--shine-action-blue-pressed) !important;
|
||||
box-shadow: inset 0 3px 9px rgba(0,0,0,.28) !important;
|
||||
.filled-action-buttons :is(.primary-btn, .secondary-btn, .destructive-btn, .ghost-btn, .text-btn, .shine-btn, .square-btn, .login-panel-inline-back, .registration-faq-link, .profiles-select, .profiles-close):focus-visible {
|
||||
outline: 2px solid rgba(255, 255, 255, 0.62);
|
||||
outline-offset: 2px;
|
||||
}
|
||||
|
||||
/* Пункты унифицированных выпадающих меню остаются без постоянной заливки,
|
||||
* но получают общую синюю реакцию при наведении/фокусе. */
|
||||
:root button.dm-head-menu-item,
|
||||
:root button.channel-menu-item,
|
||||
:root button.dm-message-action-btn {
|
||||
justify-content: flex-start !important;
|
||||
color: #f4f8ff !important;
|
||||
background: transparent !important;
|
||||
text-align: left !important;
|
||||
.filled-action-buttons :is(.primary-btn, .secondary-btn, .destructive-btn, .ghost-btn, .text-btn, .shine-btn, .square-btn, .login-panel-inline-back, .registration-faq-link, .profiles-select, .profiles-close)::before,
|
||||
.filled-action-buttons :is(.primary-btn, .secondary-btn, .destructive-btn, .ghost-btn, .text-btn, .shine-btn, .square-btn, .login-panel-inline-back, .registration-faq-link, .profiles-select, .profiles-close)::after {
|
||||
background: transparent;
|
||||
background-image: none;
|
||||
border-color: transparent;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
:root button.dm-head-menu-item:hover,
|
||||
:root button.dm-head-menu-item:focus-visible,
|
||||
:root button.channel-menu-item:hover,
|
||||
:root button.channel-menu-item:focus-visible,
|
||||
:root button.dm-message-action-btn:hover,
|
||||
:root button.dm-message-action-btn:focus-visible {
|
||||
background: rgba(var(--shine-action-blue-rgb), .12) !important;
|
||||
box-shadow: none !important;
|
||||
transform: none !important;
|
||||
}
|
||||
|
||||
:root button.channel-menu-item.destructive,
|
||||
:root button.dm-message-action-btn--danger {
|
||||
color: #ffb7c5 !important;
|
||||
}
|
||||
|
||||
/* 2026-08-28: исключения из borderless-reset для явных выборов и действий настроек. */
|
||||
:root body .language-choice-grid button.language-choice-option,
|
||||
:root body .language-choice-grid button.language-choice-option:hover,
|
||||
:root body .language-choice-grid button.language-choice-option:focus {
|
||||
border: 1px solid rgba(210, 222, 241, 0.16) !important;
|
||||
border-radius: 16px !important;
|
||||
background: rgba(255, 255, 255, 0.035) !important;
|
||||
box-shadow: none !important;
|
||||
transform: none !important;
|
||||
}
|
||||
|
||||
:root body .language-choice-grid button.language-choice-option.is-selected,
|
||||
:root body .language-choice-grid button.language-choice-option.is-selected:hover,
|
||||
:root body .language-choice-grid button.language-choice-option.is-selected:focus {
|
||||
border-color: rgba(92, 190, 255, 0.62) !important;
|
||||
background: rgba(39, 141, 255, 0.12) !important;
|
||||
box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 0 20px rgba(39,141,255,.10) !important;
|
||||
}
|
||||
|
||||
:root body button.pairing-approve-btn,
|
||||
:root body button.pairing-approve-btn:hover,
|
||||
:root body button.pairing-approve-btn:focus {
|
||||
background: linear-gradient(180deg, rgba(57, 180, 108, .92), rgba(22, 116, 69, .94)) !important;
|
||||
border: 1px solid rgba(126, 235, 170, .55) !important;
|
||||
border-radius: 14px !important;
|
||||
box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 8px 22px rgba(22,116,69,.20) !important;
|
||||
transform: none !important;
|
||||
}
|
||||
|
||||
:root body button.pairing-reject-btn,
|
||||
:root body button.pairing-reject-btn:hover,
|
||||
:root body button.pairing-reject-btn:focus {
|
||||
color: #fff1f3 !important;
|
||||
background: rgba(134, 31, 49, .28) !important;
|
||||
border: 1px solid rgba(255, 105, 128, .42) !important;
|
||||
border-radius: 14px !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
:root body .screen-content.settings-bordered-actions button:not(.icon-btn):not(.key-toggle-btn):not(.channel-toggle-btn):not(.fg-filter-chip):not(.toolbar-btn):not(.pairing-approve-btn):not(.pairing-reject-btn) {
|
||||
border: 1px solid rgba(183, 203, 235, 0.28) !important;
|
||||
border-radius: 14px !important;
|
||||
background:
|
||||
linear-gradient(180deg, rgba(255,255,255,.055), transparent 30%),
|
||||
rgba(8, 19, 42, .58) !important;
|
||||
box-shadow:
|
||||
inset 0 1px 0 rgba(255,255,255,.10),
|
||||
0 5px 16px rgba(0,0,0,.18) !important;
|
||||
padding-inline: 14px;
|
||||
transform: none !important;
|
||||
}
|
||||
|
||||
:root body .screen-content.settings-bordered-actions button:not(.icon-btn):not(.key-toggle-btn):not(.channel-toggle-btn):not(.fg-filter-chip):not(.toolbar-btn):not(.pairing-approve-btn):not(.pairing-reject-btn):hover {
|
||||
border-color: rgba(213, 225, 247, 0.42) !important;
|
||||
background:
|
||||
linear-gradient(180deg, rgba(255,255,255,.075), transparent 30%),
|
||||
rgba(10, 24, 52, .68) !important;
|
||||
.filled-action-buttons :is(.primary-btn, .secondary-btn, .destructive-btn, .ghost-btn, .text-btn, .shine-btn, .square-btn, .login-panel-inline-back, .registration-faq-link, .profiles-select, .profiles-close):disabled {
|
||||
color: rgba(255, 255, 255, 0.58);
|
||||
background: rgba(var(--shine-action-blue-rgb), 0.42);
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user