5494
редагування
Admin (обговорення | внесок) Немає опису редагування Мітка: Ручний відкіт |
Admin (обговорення | внесок) Немає опису редагування Мітка: Скасовано |
||
| Рядок 67: | Рядок 67: | ||
.minerva-header .branding-box { | .minerva-header .branding-box { | ||
opacity: 1.0!important; | opacity: 1.0!important; | ||
} | |||
.mcc-heroes-list { | |||
display: flex; | |||
flex-wrap: wrap; /* Дозволяє переносити картки на новий рядок */ | |||
gap: 20px; /* Відступ між картками */ | |||
justify-content: flex-start; /* Вирівнювання карток на початку (зліва) */ | |||
list-style: none; | |||
padding: 0; | |||
margin: 20px 0; /* Додаємо зовнішній відступ, щоб відокремити від попереднього блоку */ | |||
} | |||
/* Стилі для окремої картки переможця */ | |||
.mcc-hero-card { | |||
width: 184px; /* Задана ширина картки */ | |||
height: 242px; /* Задана висота картки */ | |||
border-radius: 12px; /* Заокруглені кути */ | |||
overflow: hidden; /* Обрізає вміст по заокруглених кутах */ | |||
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Невеликий тінь для 3D ефекту */ | |||
position: relative; | |||
background-color: #333; /* Фоновий колір картки (замініть на ваше бажання) */ | |||
color: white; /* Колір тексту на картці */ | |||
display: flex; | |||
flex-direction: column; | |||
justify-content: flex-end; /* Вирівнює вміст внизу */ | |||
} | |||
/* Стилі для зображення/заглушки */ | |||
.mcc-hero-image { | |||
width: 100%; | |||
height: 100%; | |||
position: absolute; | |||
top: 0; | |||
left: 0; | |||
object-fit: cover; | |||
z-index: 1; /* Зображення має бути під текстом */ | |||
} | |||
/* Стилі для блоку з текстом */ | |||
.mcc-hero-info { | |||
position: absolute; | |||
bottom: 20px; /* 20 пікселів від нижнього краю */ | |||
width: 100%; | |||
text-align: center; | |||
padding: 0 5px; | |||
box-sizing: border-box; | |||
z-index: 2; /* Текст має бути над зображенням */ | |||
} | |||
/* Стилі для нікнейму */ | |||
.mcc-hero-nickname { | |||
font-size: 16px; | |||
font-weight: bold; | |||
line-height: 1.2; | |||
} | |||
/* Стилі для дати */ | |||
.mcc-hero-date { | |||
font-size: 14px; | |||
opacity: 0.8; | |||
line-height: 1.2; | |||
} | |||
/* Стилі для посилання */ | |||
.mcc-hero-info a { | |||
color: inherit; /* Посилання буде того ж кольору, що й батьківський блок (white) */ | |||
text-decoration: none; | |||
} | |||
.mcc-hero-info a:hover { | |||
text-decoration: underline; | |||
} | } | ||