5494
редагування
MediaWiki:Common.css: відмінності між версіями
нема опису редагування
Admin (обговорення | внесок) Немає опису редагування Мітка: Скасовано |
Admin (обговорення | внесок) Немає опису редагування Мітка: Скасовано |
||
| Рядок 946: | Рядок 946: | ||
/* Ефект наведення на картку */ | /* Ефект наведення на картку */ | ||
.mcc-hero-card:hover { | .mcc-hero-card:hover { | ||
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.6); | |||
} | |||
.mcc-champion-card:hover { | |||
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.6); | box-shadow: 0 8px 20px rgba(0, 0, 0, 0.6); | ||
} | } | ||
| Рядок 966: | Рядок 970: | ||
/* 1. SPAN контейнер: позиціонування */ | /* 1. SPAN контейнер: позиціонування */ | ||
.mcc-hero-card .hero-image-wiki { | .mcc-hero-card .hero-image-wiki { | ||
position: absolute; | |||
top: 0; | |||
left: 0; | |||
width: 100%; | |||
height: 100%; | |||
z-index: 0; /* Найнижчий шар */ | |||
overflow: hidden; | |||
} | |||
.mcc-champion-card .hero-image-wiki { | |||
position: absolute; | position: absolute; | ||
top: 0; | top: 0; | ||
| Рядок 977: | Рядок 991: | ||
/* 2. IMG елемент: масштабування та ефекти */ | /* 2. IMG елемент: масштабування та ефекти */ | ||
.mcc-hero-card .hero-image-wiki img { | .mcc-hero-card .hero-image-wiki img { | ||
width: 100%; | |||
height: 100%; | |||
object-fit: cover; | |||
transform: scale(1); | |||
/* Анімує збільшення, фільтри та прозорість */ | |||
transition: transform 0.3s ease-in-out, filter 0.3s ease-in-out, opacity 0.3s ease-in-out; | |||
} | |||
.mcc-champion-card .hero-image-wiki img { | |||
width: 100%; | width: 100%; | ||
height: 100%; | height: 100%; | ||
| Рядок 987: | Рядок 1010: | ||
/* Анімація при наведенні: стандартне збільшення зображення */ | /* Анімація при наведенні: стандартне збільшення зображення */ | ||
.mcc-hero-card:hover .hero-image-wiki img { | .mcc-hero-card:hover .hero-image-wiki img { | ||
transform: scale(1.1); | |||
} | |||
.mcc-champion-card:hover .hero-image-wiki img { | |||
transform: scale(1.1); | transform: scale(1.1); | ||
} | } | ||