8,957
edits
MediaWiki:Common.css: Difference between revisions
Jump to navigation
Jump to search
no edit summary
No edit summary |
No edit summary |
||
| Line 1: | Line 1: | ||
/* Media */ | |||
.mw-parser-output .media_box-container { | |||
display: flex; /* Используем Flexbox для расположения по три в ряд */ | |||
flex-wrap: wrap; /* Перенос на новую строку, если не помещаются */ | |||
gap: 20px; /* Отступы между контейнерами */ | |||
justify-content: space-between; /* Равномерное распределение */ | |||
} | |||
.mw-parser-output .media_box { | |||
width: calc(33.33% - 14px); /* По три в ряд: 33.33% ширины минус отступы */ | |||
box-sizing: border-box; /* Учитываем padding и border в размерах */ | |||
border: 2px solid #D02019; /* Гладкие края, толщина 2px, красный цвет (как в вашем стиле) */ | |||
border-radius: 10px; /* Скругленные углы для гладкости */ | |||
overflow: hidden; /* Убедимся, что изображение не выходит за края */ | |||
transition: transform 0.3s ease, filter 0.3s ease; /* Плавные эффекты */ | |||
} | |||
.mw-parser-output .media_box img { | |||
width: 100%; /* Изображение занимает всю ширину контейнера */ | |||
height: auto; /* Сохраняем пропорции */ | |||
display: block; /* Убираем лишние отступы */ | |||
} | |||
.mw-parser-output .media_box:hover { | |||
transform: scale(1.05); /* Увеличение на 5% при наведении */ | |||
} | |||
.mw-parser-output .media_box:active { | |||
filter: brightness(0.8); /* Затемнение на 20% при нажатии */ | |||
} | |||
/* links */ | /* links */ | ||
.mw-parser-output a[href="/index.php/Special:Random"] { | .mw-parser-output a[href="/index.php/Special:Random"] { | ||