|
|
| Line 1: |
Line 1: |
| /* Стилизация только сайдбар-меню Twenty one pilots */
| | .sidebar-nav { |
| #p-Twenty_one_pilots .vector-menu-content-list {
| | margin: 0 0 12px 0; |
| padding: 0.6em 0; | | padding: 0; |
| margin: 0; | |
| list-style: none; | | list-style: none; |
| display: flex; | | background: linear-gradient(98deg, #7a0018 0%, #d90429 100%); |
| flex-direction: column; | | border-radius: 14px; |
| gap: 0.35em; | | box-shadow: 0 1px 14px #a70021b0; |
| | padding: 10px 8px 10px 8px; |
| } | | } |
|
| |
|
| #p-Twenty_one_pilots .vector-menu-content-list .mw-list-item {
| | .sidebar-nav .mw-list-item { |
| transition: transform 0.13s, box-shadow 0.14s, background 0.13s; | | padding: 7px 0 7px 15px; |
| border-radius: 11px; | | margin-bottom: 5px; |
| overflow: hidden; | | font-size: 1.07em; |
| margin: 0; | | color: #fff !important; |
| background: linear-gradient(90deg, #2d2f38 85%, #554099 120%);
| | border-left: 4px solid transparent; |
| box-shadow: 0 2px 8px 0 rgba(34,34,54,0.04); | | border-radius: 7px; |
| border: 1.5px solid #3b3651; | | transition: background 0.14s, border-color 0.14s, color 0.13s; |
| position: relative; | |
| } | | } |
|
| |
|
| #p-Twenty_one_pilots .vector-menu-content-list .mw-list-item:hover,
| | .sidebar-nav .mw-list-item:last-child { |
| #p-Twenty_one_pilots .vector-menu-content-list .mw-list-item:focus-within {
| | margin-bottom: 0; |
| background: linear-gradient(90deg, #473877 75%, #ffcd6b 140%); | |
| box-shadow: 0 4px 20px 0 rgba(34,34,54,0.18);
| |
| transform: translateY(-2px) scale(1.03);
| |
| border-color: #b49af7;
| |
| } | | } |
|
| |
|
| #p-Twenty_one_pilots .vector-menu-content-list .mw-list-item a {
| | .sidebar-nav .mw-list-item > a { |
| | color: #fff !important; |
| | text-decoration: none; |
| display: block; | | display: block; |
| padding: 0.66em 1.3em 0.66em 1.1em; | | width: 100%; |
| color: #efeafc;
| | transition: color 0.13s, padding-left 0.14s; |
| text-decoration: none;
| | border-radius: 7px; |
| font-weight: 500;
| | font-weight: 600; |
| font-size: 1.07em;
| | letter-spacing: 0.01em; |
| letter-spacing: 0.03em;
| |
| transition: color 0.13s; | |
| position: relative;
| |
| z-index: 2;
| |
| }
| |
| | |
| #p-Twenty_one_pilots .vector-menu-content-list .mw-list-item:hover a,
| |
| #p-Twenty_one_pilots .vector-menu-content-list .mw-list-item:focus-within a {
| |
| color: #2d1e49;
| |
| }
| |
| | |
| /* Маленький декоративный акцент слева */
| |
| #p-Twenty_one_pilots .vector-menu-content-list .mw-list-item a::before {
| |
| content: '';
| |
| display: inline-block;
| |
| width: 0.4em;
| |
| height: 1.5em;
| |
| background: linear-gradient(135deg,#ffcd6b 70%,#b49af7 100%);
| |
| border-radius: 4px; | |
| margin-right: 0.8em; | |
| vertical-align: middle; | |
| opacity: 0.67;
| |
| transition: opacity 0.14s;
| |
| } | | } |
|
| |
|
| #p-Twenty_one_pilots .vector-menu-content-list .mw-list-item:hover a::before,
| | .sidebar-nav .mw-list-item:hover, |
| #p-Twenty_one_pilots .vector-menu-content-list .mw-list-item:focus-within a::before {
| | .sidebar-nav .mw-list-item:focus-within { |
| opacity: 1; | | background: rgba(250,30,68,0.19); |
| | border-left: 4px solid #f6d311; |
| } | | } |
|
| |
|
| @media (max-width: 700px) {
| | .sidebar-nav .mw-list-item:hover > a, |
| #p-Twenty_one_pilots .vector-menu-content-list .mw-list-item a {
| | .sidebar-nav .mw-list-item:focus-within > a { |
| padding: 0.55em 0.8em;
| | color: #f6d311 !important; |
| font-size: 0.98em;
| | padding-left: 13px; |
| }
| |
| } | | } |