|
|
| Строка 23: |
Строка 23: |
| .page-actions__left { | | .page-actions__left { |
| display: none !important; | | display: none !important; |
| }
| |
|
| |
| /* ============================================================
| |
| RedStar sidebar
| |
| ============================================================ */
| |
|
| |
| .tgui-sidebar {
| |
| background:
| |
| linear-gradient(
| |
| 180deg,
| |
| rgba(14, 16, 22, 0.98) 0%,
| |
| rgba(9, 11, 15, 0.98) 100%
| |
| ) !important;
| |
|
| |
| border-right: 1px solid rgba(255, 255, 255, 0.055) !important;
| |
|
| |
| box-shadow:
| |
| 8px 0 26px rgba(0, 0, 0, 0.22),
| |
| inset -1px 0 rgba(255, 59, 63, 0.025) !important;
| |
| }
| |
|
| |
| .tgui-sidebar-content {
| |
| padding: 8px 7px 12px 6px !important;
| |
| }
| |
|
| |
|
| |
| /* Category panel */
| |
|
| |
| .tgui-sidebar-content .tgui-menu {
| |
| margin: 0 0 8px 0 !important;
| |
|
| |
| border: 1px solid rgba(255, 255, 255, 0.075) !important;
| |
| border-radius: 9px !important;
| |
|
| |
| background:
| |
| linear-gradient(
| |
| 180deg,
| |
| rgba(255, 255, 255, 0.060),
| |
| rgba(255, 255, 255, 0.025)
| |
| ) !important;
| |
|
| |
| box-shadow:
| |
| 0 4px 14px rgba(0, 0, 0, 0.16),
| |
| inset 0 1px rgba(255, 255, 255, 0.025) !important;
| |
|
| |
| overflow: hidden !important;
| |
|
| |
| transition:
| |
| border-color 0.14s ease,
| |
| background 0.14s ease,
| |
| box-shadow 0.14s ease !important;
| |
| }
| |
|
| |
| /* Expanded category */
| |
| .tgui-sidebar-content .tgui-menu:not(.collapsed) {
| |
| border-color: rgba(255, 59, 63, 0.16) !important;
| |
|
| |
| background:
| |
| linear-gradient(
| |
| 180deg,
| |
| rgba(255, 59, 63, 0.040),
| |
| rgba(255, 255, 255, 0.018)
| |
| ) !important;
| |
|
| |
| box-shadow:
| |
| 0 5px 16px rgba(0, 0, 0, 0.18),
| |
| inset 0 1px rgba(255, 255, 255, 0.028) !important;
| |
| }
| |
|
| |
| /* Collapsed category */
| |
| .tgui-sidebar-content .tgui-menu.collapsed {
| |
| border-color: rgba(255, 255, 255, 0.095) !important;
| |
| }
| |
|
| |
| /* Category hover */
| |
|
| |
| .tgui-sidebar-content .tgui-menu.collapsed:hover {
| |
| border-color: rgba(255, 59, 63, 0.30) !important;
| |
|
| |
| background:
| |
| linear-gradient(
| |
| 180deg,
| |
| rgba(255, 59, 63, 0.075),
| |
| rgba(255, 255, 255, 0.025)
| |
| ) !important;
| |
|
| |
| box-shadow:
| |
| 0 5px 16px rgba(0, 0, 0, 0.22),
| |
| inset 2px 0 0 rgba(255, 59, 63, 0.42),
| |
| inset 0 1px rgba(255, 255, 255, 0.035) !important;
| |
| }
| |
|
| |
| .tgui-sidebar-content .tgui-menu.collapsed:hover > .tgui-menu__heading {
| |
| color: #f0f2f6 !important;
| |
| }
| |
|
| |
|
| |
| /* Category heading */
| |
|
| |
| /* Category heading */
| |
|
| |
| /* Category heading */
| |
|
| |
| .tgui-sidebar-content .tgui-menu__heading {
| |
| position: relative !important;
| |
|
| |
| height: 34px !important;
| |
|
| |
| padding: 0 11px !important;
| |
|
| |
| background:
| |
| linear-gradient(
| |
| 90deg,
| |
| rgba(255, 255, 255, 0.025),
| |
| rgba(255, 255, 255, 0.008)
| |
| ) !important;
| |
|
| |
| color: #d9dee8 !important;
| |
|
| |
| font-size: 11px !important;
| |
| font-weight: 700 !important;
| |
| letter-spacing: 0.02em !important;
| |
|
| |
| border: 0 !important;
| |
| }
| |
|
| |
|
| |
| /* Thin RedStar accent under category heading */
| |
|
| |
| .tgui-sidebar-content .tgui-menu__heading::after {
| |
| content: "" !important;
| |
|
| |
| position: absolute !important;
| |
|
| |
| left: 10px !important;
| |
| right: 10px !important;
| |
| bottom: 0 !important;
| |
|
| |
| height: 1px !important;
| |
|
| |
| background:
| |
| linear-gradient(
| |
| 90deg,
| |
| rgba(255, 59, 63, 0.62),
| |
| rgba(255, 59, 63, 0.13) 65%,
| |
| transparent
| |
| ) !important;
| |
| }
| |
|
| |
|
| |
| /* Category content */
| |
|
| |
|
| |
| .tgui-sidebar-content .tgui-menu__content {
| |
| background: transparent !important;
| |
| }
| |
|
| |
| .tgui-sidebar-content .tgui-menu__content ul {
| |
| gap: 2px !important;
| |
|
| |
| padding: 7px !important;
| |
| }
| |
|
| |
|
| |
| /* Navigation item */
| |
|
| |
| .tgui-sidebar-content .tgui-menu__content li {
| |
| position: relative !important;
| |
|
| |
| min-height: 28px !important;
| |
|
| |
| margin: 0 !important;
| |
| padding: 0 !important;
| |
|
| |
| border: 0 !important;
| |
| border-radius: 6px !important;
| |
|
| |
| background: transparent !important;
| |
|
| |
| box-shadow: none !important;
| |
|
| |
| transition:
| |
| background 0.14s ease,
| |
| color 0.14s ease,
| |
| transform 0.14s ease !important;
| |
| }
| |
|
| |
|
| |
| /* Kill old TGUI button treatment */
| |
|
| |
| .tgui-sidebar-content .tgui-menu__content li::before,
| |
| .tgui-sidebar-content .tgui-menu__content li::after {
| |
| box-shadow: none !important;
| |
| border: 0 !important;
| |
| }
| |
|
| |
|
| |
| /* Link */
| |
|
| |
| .tgui-sidebar-content .tgui-menu__content li > a {
| |
| display: flex !important;
| |
| align-items: center !important;
| |
|
| |
| box-sizing: border-box !important;
| |
|
| |
| width: 100% !important;
| |
| height: 28px !important;
| |
|
| |
| padding: 0 9px !important;
| |
|
| |
| color: #aeb7c5 !important;
| |
|
| |
| font-size: 11px !important;
| |
| font-weight: 550 !important;
| |
| line-height: 28px !important;
| |
|
| |
| text-decoration: none !important;
| |
|
| |
| border-radius: 6px !important;
| |
| }
| |
|
| |
|
| |
| /* Hover */
| |
|
| |
| .tgui-sidebar-content .tgui-menu__content li:hover {
| |
| background:
| |
| linear-gradient(
| |
| 90deg,
| |
| rgba(255, 255, 255, 0.055),
| |
| rgba(255, 255, 255, 0.022)
| |
| ) !important;
| |
| }
| |
|
| |
| .tgui-sidebar-content .tgui-menu__content li:hover > a {
| |
| color: #eef1f6 !important;
| |
| }
| |
|
| |
|
| |
| /* Active/current page */
| |
|
| |
| .tgui-sidebar-content .tgui-menu__content li.selected,
| |
| .tgui-sidebar-content .tgui-menu__content li.active,
| |
| .tgui-sidebar-content .tgui-menu__content li.current,
| |
| .tgui-sidebar-content .tgui-menu__content li:has(> a[aria-current="page"]) {
| |
| background:
| |
| linear-gradient(
| |
| 90deg,
| |
| rgba(255, 59, 63, 0.15),
| |
| rgba(255, 59, 63, 0.055)
| |
| ) !important;
| |
|
| |
| box-shadow:
| |
| inset 2px 0 0 rgba(255, 59, 63, 0.78) !important;
| |
| }
| |
|
| |
| .tgui-sidebar-content .tgui-menu__content li.selected > a,
| |
| .tgui-sidebar-content .tgui-menu__content li.active > a,
| |
| .tgui-sidebar-content .tgui-menu__content li.current > a,
| |
| .tgui-sidebar-content .tgui-menu__content li:has(> a[aria-current="page"]) > a {
| |
| color: #f5dfe0 !important;
| |
| font-weight: 650 !important;
| |
| }
| |
|
| |
|
| |
| /* Scrollbar */
| |
|
| |
|
| |
| .tgui-sidebar-content {
| |
| scrollbar-width: thin !important;
| |
| scrollbar-color:
| |
| rgba(255, 255, 255, 0.12)
| |
| transparent !important;
| |
| }
| |
|
| |
| .tgui-sidebar-content::-webkit-scrollbar {
| |
| width: 6px !important;
| |
| }
| |
|
| |
| .tgui-sidebar-content::-webkit-scrollbar-track {
| |
| background: transparent !important;
| |
| }
| |
|
| |
| .tgui-sidebar-content::-webkit-scrollbar-thumb {
| |
| border-radius: 6px !important;
| |
| background: rgba(255, 255, 255, 0.12) !important;
| |
| }
| |
|
| |
| .tgui-sidebar-content::-webkit-scrollbar-thumb:hover {
| |
| background: rgba(255, 255, 255, 0.20) !important;
| |
| }
| |
|
| |
|
| |
| /* ============================================================
| |
| RedStar header
| |
| ============================================================ */
| |
|
| |
| .tgui-header {
| |
| background:
| |
| linear-gradient(
| |
| 180deg,
| |
| rgba(66, 20, 27, 0.90) 0%,
| |
| rgba(37, 14, 19, 0.88) 52%,
| |
| rgba(21, 13, 16, 0.90) 100%
| |
| ) !important;
| |
|
| |
| border-bottom: 1px solid rgba(255, 59, 63, 0.24) !important;
| |
|
| |
| box-shadow:
| |
| 0 7px 26px rgba(0, 0, 0, 0.34),
| |
| 0 1px 12px rgba(255, 36, 48, 0.055),
| |
| inset 0 -1px rgba(255, 255, 255, 0.025) !important;
| |
|
| |
| -webkit-backdrop-filter: blur(16px) saturate(125%);
| |
| backdrop-filter: blur(16px) saturate(125%);
| |
| }
| |
|
| |
| .tgui-header::before {
| |
| opacity: 0 !important;
| |
| }
| |
|
| |
| /* Header buttons */
| |
| .tgui-header .tgui-header__button,
| |
| .tgui-header .tgui-dropdown-summary {
| |
| border-radius: 7px !important;
| |
|
| |
| transition:
| |
| color 0.14s ease,
| |
| background 0.14s ease,
| |
| box-shadow 0.14s ease !important;
| |
| }
| |
|
| |
| .tgui-header .tgui-header__button:hover,
| |
| .tgui-header .tgui-dropdown-summary:hover {
| |
| background:
| |
| linear-gradient(
| |
| 180deg,
| |
| rgba(255, 74, 78, 0.14),
| |
| rgba(255, 59, 63, 0.055)
| |
| ) !important;
| |
|
| |
| box-shadow:
| |
| inset 0 0 0 1px rgba(255, 72, 76, 0.18) !important;
| |
| }
| |
|
| |
| /* Search */
| |
| .tgui-header input[type="search"],
| |
| .tgui-header input[name="search"],
| |
| .tgui-header .cdx-text-input__input {
| |
| background:
| |
| linear-gradient(
| |
| 180deg,
| |
| rgba(8, 8, 11, 0.70),
| |
| rgba(14, 9, 12, 0.78)
| |
| ) !important;
| |
|
| |
| border-color: rgba(255, 255, 255, 0.105) !important;
| |
|
| |
| box-shadow:
| |
| inset 0 1px 3px rgba(0, 0, 0, 0.42),
| |
| 0 1px rgba(255, 255, 255, 0.018) !important;
| |
|
| |
| transition:
| |
| border-color 0.14s ease,
| |
| box-shadow 0.14s ease,
| |
| background 0.14s ease !important;
| |
| }
| |
|
| |
| .tgui-header input[type="search"]:focus,
| |
| .tgui-header input[name="search"]:focus,
| |
| .tgui-header .cdx-text-input__input:focus {
| |
| border-color: rgba(255, 70, 74, 0.48) !important;
| |
|
| |
| background:
| |
| linear-gradient(
| |
| 180deg,
| |
| rgba(25, 9, 13, 0.86),
| |
| rgba(11, 8, 10, 0.84)
| |
| ) !important;
| |
|
| |
| box-shadow:
| |
| inset 0 1px 3px rgba(0, 0, 0, 0.42),
| |
| 0 0 0 1px rgba(255, 59, 63, 0.12),
| |
| 0 0 14px rgba(255, 59, 63, 0.07) !important;
| |
|
| |
| outline: none !important;
| |
| } | | } |
