MediaWiki:Vector.css: различия между версиями
Shihov (обсуждение | вклад) Нет описания правки |
Shihov (обсуждение | вклад) Нет описания правки |
||
| Строка 150: | Строка 150: | ||
position: fixed !important; | position: fixed !important; | ||
height: 100vh !important; /* Занимает всю высоту экрана */ | height: 100vh !important; /* Занимает всю высоту экрана */ | ||
width: 220px; /* Фиксированная ширина панели, можно изменить */ | width: 220px !important; /* Фиксированная ширина панели, можно изменить */ | ||
overflow: hidden; /* Важно: скрываем общую прокрутку панели */ | overflow: hidden !important; /* Важно: скрываем общую прокрутку панели */ | ||
} | } | ||
| Строка 158: | Строка 158: | ||
#p-navigation { | #p-navigation { | ||
/* Фиксируем положение относительно левого верхнего угла панели */ | /* Фиксируем положение относительно левого верхнего угла панели */ | ||
position: sticky; | position: sticky !important; | ||
top: 0; | top: 0 !important; | ||
z-index: 1; /* Чтобы контент не перекрывался при прокрутке */ | z-index: 1 !important; /* Чтобы контент не перекрывался при прокрутке */ | ||
background-color: #f8f9fa; /* Фон панели, чтобы перекрывать прокручиваемый контент */ | background-color: #f8f9fa !important; /* Фон панели, чтобы перекрывать прокручиваемый контент */ | ||
} | } | ||
/* Контейнер для дерева категорий */ | /* Контейнер для дерева категорий */ | ||
#p-navigation { | #p-navigation { | ||
margin-top: 100px; /* Отступ, можно настроить */ | margin-top: 100px !important; /* Отступ, можно настроить */ | ||
} | } | ||
#p-namespaces { | #p-namespaces { | ||
margin-top: 200px; /* Отступ, можно настроить */ | margin-top: 200px !important; /* Отступ, можно настроить */ | ||
} | } | ||
#mw-panel-category-tree { | #mw-panel-category-tree { | ||
height: calc(100vh - 250px); /* Высота области с категориями, занимает все доступное место, можешь поменять */ | height: calc(100vh - 250px) !important; /* Высота области с категориями, занимает все доступное место, можешь поменять */ | ||
overflow-y: auto; /* Добавляем вертикальную прокрутку только для этого блока */ | overflow-y: auto !important; /* Добавляем вертикальную прокрутку только для этого блока */ | ||
scrollbar-width: thin; /* Для Firefox */ | scrollbar-width: thin !important; /* Для Firefox */ | ||
scrollbar-color: #adb5bd #f8f9fa; /* Для Firefox */ | scrollbar-color: #adb5bd #f8f9fa !important; /* Для Firefox */ | ||
} | } | ||
/* Для Chrome, Edge и Safari */ | /* Для Chrome, Edge и Safari */ | ||
#mw-panel-category-tree::-webkit-scrollbar { | #mw-panel-category-tree::-webkit-scrollbar { | ||
width: 8px; | width: 8px !important; | ||
} | } | ||
#mw-panel-category-tree::-webkit-scrollbar-track { | #mw-panel-category-tree::-webkit-scrollbar-track { | ||
background: #f8f9fa; | background: #f8f9fa !important; | ||
} | } | ||
#mw-panel-category-tree::-webkit-scrollbar-thumb { | #mw-panel-category-tree::-webkit-scrollbar-thumb { | ||
background-color: #adb5bd; | background-color: #adb5bd !important; | ||
border-radius: 4px; | border-radius: 4px !important; | ||
border: 2px solid #f8f9fa; | border: 2px solid #f8f9fa !important; | ||
} | } | ||
#mw-panel-category-tree::-webkit-scrollbar-thumb:hover { | #mw-panel-category-tree::-webkit-scrollbar-thumb:hover { | ||
background-color: #868e96; | background-color: #868e96 !important; | ||
} | } | ||