|
|
| Строка 146: |
Строка 146: |
|
| |
|
| /* Контейнер для категорий (прокрутка) */ | | /* Контейнер для категорий (прокрутка) */ |
| /* Фиксируем сайдбар и разрешаем его прокрутку */
| |
| #mw-panel {
| |
| position: fixed !important;
| |
| height: 100vh !important;
| |
| width: 220px !important;
| |
| overflow-y: auto !important;
| |
| }
| |
|
| |
| /* Контент с учетом сайдбара */
| |
| #content {
| |
| margin-left: 22em !important;
| |
| }
| |
|
| |
| /* Добавляем эффект исчезновения */
| |
| div.catlinks {
| |
| position: relative !important;
| |
| transition: opacity 0.3s ease-in-out !important;
| |
| }
| |
|
| |
| /* Градиентные маски сверху и снизу */
| |
| div.catlinks::before,
| |
| div.catlinks::after {
| |
| content: "" !important;
| |
| position: absolute !important;
| |
| left: 0 !important;
| |
| width: 100% !important;
| |
| height: 30px !important;
| |
| pointer-events: none !important;
| |
| transition: opacity 0.3s ease-in-out !important;
| |
| }
| |
|
| |
| div.catlinks::before {
| |
| top: 0 !important;
| |
| background: linear-gradient(to bottom, rgba(248, 249, 250, 1), rgba(248, 249, 250, 0)) !important;
| |
| opacity: 0 !important;
| |
| }
| |
|
| |
| div.catlinks::after {
| |
| bottom: 0 !important;
| |
| background: linear-gradient(to top, rgba(248, 249, 250, 1), rgba(248, 249, 250, 0)) !important;
| |
| opacity: 0 !important;
| |
| }
| |