MediaWiki:Common.css: Difference between revisions

Jump to navigation Jump to search

MediaWiki:Common.css (view source)

Revision as of 00:04, 4 April 2025

153 bytes removed ,  4 April
no edit summary
No edit summary
No edit summary
Line 1: Line 1:
/* Media */
/* Media */
.mw-parser-output .media_box-container {
.mw-parser-output .media_box-container {
     display: flex; /* Используем Flexbox для расположения по три в ряд */
     display: flex;
     flex-wrap: wrap; /* Перенос на новую строку, если не помещаются */
     flex-wrap: wrap;
     gap: 20px; /* Отступы между контейнерами */
     gap: 20px;
     justify-content: space-between; /* Равномерное распределение */
     justify-content: space-between;
}
}


.mw-parser-output .media_box {
.mw-parser-output .media_box {
     width: calc(33.33% - 14px); /* По три в ряд: 33.33% ширины минус отступы */
     width: 310px; /* Фиксированная ширина */
     box-sizing: border-box; /* Учитываем padding и border в размерах */
    height: 310px; /* Фиксированная высота (квадрат) */
     border: 2px solid #D02019; /* Гладкие края, толщина 2px, красный цвет (как в вашем стиле) */
     box-sizing: border-box;
     border-radius: 10px; /* Скругленные углы для гладкости */
     border: 2px solid #D02019;
     overflow: hidden; /* Убедимся, что изображение не выходит за края */
     border-radius: 10px;
     transition: transform 0.3s ease, filter 0.3s ease; /* Плавные эффекты */
     overflow: hidden;
     transition: transform 0.3s ease, filter 0.3s ease;
    display: flex; /* Для центрирования текста */
    align-items: center; /* Центрируем по вертикали */
    justify-content: center; /* Центрируем по горизонтали */
    background-color: #f0f0f0; /* Светлый фон для контраста */
    text-align: center; /* Центрируем текст */
    padding: 10px; /* Внутренний отступ для текста */
}
}


.mw-parser-output .media_box img {
.mw-parser-output .media_box:hover {
     width: 100%; /* Изображение занимает всю ширину контейнера */
     transform: scale(1.05);
    height: auto; /* Сохраняем пропорции */
}
     display: block; /* Убираем лишние отступы */
 
.mw-parser-output .media_box:active {
     filter: brightness(0.8);
}
}


.mw-parser-output .media_box:hover {
/* Скрываем изображение */
     transform: scale(1.05); /* Увеличение на 5% при наведении */
.mw-parser-output .media_box img {
     display: none; /* Убираем изображение */
}
}


.mw-parser-output .media_box:active {
/* Стили для названия файла */
     filter: brightness(0.8); /* Затемнение на 20% при нажатии */
.mw-parser-output .media_box .file-name {
    font-family: Arial, sans-serif;
    font-size: 14px;
    color: #000;
     word-break: break-all; /* Перенос длинных имен */
}
}


Retrieved from "https://twentyonewiki.info/index.php/Special:MobileDiff/10476"

Navigation menu