MediaWiki:Vector.css: различия между версиями

← Предыдущая правка Следующая правка →

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