MediaWiki:Vector.css

Замечание: Возможно, после публикации вам придётся очистить кэш своего браузера, чтобы увидеть изменения.

• Firefox / Safari: Удерживая клавишу Shift, нажмите на панели инструментов Обновить либо нажмите Ctrl+F5 или Ctrl+R (⌘+R на Mac)
• Google Chrome: Нажмите Ctrl+Shift+R (⌘+Shift+R на Mac)
• Internet Explorer / Edge: Удерживая Ctrl, нажмите Обновить либо нажмите Ctrl+F5
• Opera: Нажмите Ctrl+F5.

.categorytree-frame {
    border: none; /* Удаляет рамку */
    padding: 2%; /* Отступы внутри рамки, в процентах от ширины окна */
    margin: 2%; /* Отступы вокруг рамки, в процентах от ширины окна */
    position: fixed; /* Фиксированное позиционирование */
    left: 0; /* Позиция слева */
    top: 2%; /* Позиция сверху, в процентах от высоты окна */
    width: 20vw; /* Ширина блока в процентах от ширины окна */
    z-index: 0; /* Уровень наложения для отображения поверх других элементов */
    background-color: transparent; /* Полностью прозрачный фон */
    overflow: auto; /* Прокрутка внутри рамки (если содержимое выходит за рамки) */
}

@media screen and (max-width: 768px) {
    .categorytree-frame {
        width: 40vw; /* Увеличиваем ширину для меньших экранов */
        padding: 5%; /* Увеличиваем отступы для меньших экранов */
        margin: 5%; /* Увеличиваем внешние отступы для меньших экранов */
        top: 5%; /* Сдвигаем немного вниз для меньших экранов */
    }
}

@media screen and (max-width: 480px) {
    .categorytree-frame {
        width: 80vw; /* Еще больше увеличиваем ширину для самых маленьких экранов */
        padding: 10%; /* Увеличиваем отступы */
        margin: 10%; /* Увеличиваем внешние отступы */
        top: 10%; /* Сдвигаем еще ниже для самых маленьких экранов */
    }
}