MediaWiki:Vector.css

Материал из Radix-IT

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

  • 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: 1em; /* Отступы внутри рамки */
    margin: 0; /* Убираем отступы вокруг рамки */
    position: fixed; /* Фиксированное позиционирование */
    left: 0; /* Позиция слева */
    top: 5vh; /* Позиция сверху в единицах высоты экрана */
    width: 20vw; /* Ширина блока в единицах ширины экрана */
    z-index: 0; /* Уровень наложения */
    background-color: transparent; /* Прозрачный фон */
    overflow: auto; /* Прокрутка внутри рамки, если содержимое выходит за пределы */
    transform-origin: 0 0; /* Точка, относительно которой происходит масштабирование */
    transform: scale(1); /* Начальное масштабирование */
    transition: transform 0.3s ease; /* Анимация при изменении масштаба */
}

body {
    transform-origin: 0 0; /* Установка точки масштабирования */
    transform: scale(1); /* Начальное масштабирование */
    transition: transform 0.3s ease; /* Плавное изменение масштаба */
}

/* Медиа-запросы для адаптации под разные экраны */
@media (max-width: 768px) {
    .categorytree-frame {
        width: 40vw; /* Увеличение ширины на узких экранах */
        top: 10vh; /* Увеличение отступа сверху на узких экранах */
    }
}

@media (min-width: 1200px) {
    .categorytree-frame {
        width: 15vw; /* Уменьшение ширины на больших экранах */
        top: 2vh; /* Уменьшение отступа сверху на больших экранах */
    }
}