Mafia Closed Circle

MediaWiki:Common.css: відмінності між версіями

Повідомлення Обговорення

MediaWiki:Common.css (переглянути вихідний код)

Версія за 00:29, 20 листопада 2025

18 121 байт додано ,  20 листопад
нема опису редагування
Немає опису редагування
Немає опису редагування
Рядок 488: Рядок 488:
padding-right: 0px!important;
padding-right: 0px!important;
}
}




/* ---------------------------------------------------- */
/* ---------------------------------------------------- */
/* Глобальні стилі для списку та Flexbox для 5 карток */
/* Глобальні стилі та Flexbox для 5 карток у рядку */
/* ---------------------------------------------------- */
/* ---------------------------------------------------- */
.mcc-heroes-list {
.mcc-heroes-list {
   display: flex;
   display: flex;
   flex-wrap: wrap;  
   flex-wrap: wrap;  
   /* gap: 20px; - Замінюємо gap на margin та justify-content для контролю */
   /* Розподіляє вільний простір рівномірно між 5 елементами */
   justify-content: space-between; /* Розподіляє вільний простір рівномірно між елементами */
   justify-content: space-between;  
   list-style: none;
   list-style: none;
   padding: 0;
   padding: 0;
Рядок 505: Рядок 504:


.mcc-heroes-list li {
.mcc-heroes-list li {
   /* width: calc((100% - 4 * gap_size) / 5); де gap_size = (free space)/4 */
   /* Ширина для 5 елементів у рядку з проміжками */
  /* Розрахунок: 100% ширини мінус 4 проміжки. Ділимо на 5, щоб отримати ширину картки. */
  /* Примітка: для 5 елементів у ряді використовуємо 18% або 19% для гарантії, що поміститься 5. */
   width: 18.5%;  
   width: 18.5%;  
   /* Забезпечуємо, що елементи займають рівну частку простору */
   margin-bottom: 20px;
}
}


/* ---------------------------------------------------- */
/* ---------------------------------------------------- */
/* Стилі для картки з фоновим зображенням */
/* Стилі картки та анімація */
/* ---------------------------------------------------- */
/* ---------------------------------------------------- */
.mcc-hero-card {
.mcc-hero-card {
   height: 242px; /* Фіксована висота */
   height: 242px;  
   width: 100%; /* Картка займає 100% ширини свого <li> контейнера */
   width: 100%;  
   border-radius: 12px;  
   border-radius: 12px;  
   overflow: hidden;  
   overflow: hidden;  
  position: relative;
   box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);  
   box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);  
   position: relative;
   background-color: #333;  
    
    
   /* ВАЖЛИВО: Налаштування фонового зображення через CSS */
   /* Налаштування переходу для анімації */
   background-color: #333; /* Колір, якщо зображення не завантажиться */
   transition: transform 0.3s ease-in-out;
  background-size: cover; /* Зображення заповнює весь блок */
}
  background-position: center center; /* Центруємо зображення */
 
  background-repeat: no-repeat;
/* Контейнер для посилання (обгортка картки) */
    
.mcc-hero-card a {
   color: white;  
    display: block;
    height: 100%;
    width: 100%;
    position: relative;
    z-index: 2; /* Щоб посилання було клікабельним поверх градієнта */
    text-decoration: none;
    color: white;
   
    /* Налаштування фонового зображення */
    background-size: cover;  
    background-position: center center;  
    background-repeat: no-repeat;
    transition: transform 0.3s ease-in-out; /* Додаємо перехід до посилання */
}
 
/* Анімація при наведенні: збільшення */
.mcc-hero-card:hover {
   transform: scale(1.03); /* Легке збільшення самої картки */
   box-shadow: 0 8px 16px rgba(0, 0, 0, 0.5);
}
}


/* Напівпрозорий градієнт (без змін) */
/* Градієнт (Напівпрозорий градієнт для читабельності тексту) */
.mcc-hero-card::after {
.mcc-hero-card a::after {
     content: '';
     content: '';
     position: absolute;
     position: absolute;
Рядок 544: Рядок 560:
}
}


/* Інформаційний блок */
.mcc-hero-info {
.mcc-hero-info {
   position: absolute;
   position: absolute;
Рядок 551: Рядок 568:
   padding: 0 5px;
   padding: 0 5px;
   box-sizing: border-box;
   box-sizing: border-box;
   z-index: 2;  
   z-index: 3; /* Вище, ніж градієнт */
}
 
/* ... інші стилі тексту без змін ... */
 
.mcc-hero-info a {
  color: inherit;
  text-decoration: none;
  display: block;
}
}


Рядок 574: Рядок 583:
   line-height: 1.2;
   line-height: 1.2;
   text-shadow: 0 0 5px rgba(0, 0, 0, 0.9);
   text-shadow: 0 0 5px rgba(0, 0, 0, 0.9);
}
.mcc-hero-card.cancelled {
  background-color: #5b0000;
}
}


/* ---------------------------------------------------- */
/* ---------------------------------------------------- */
/* ІНДИВІДУАЛЬНІ ЗОБРАЖЕННЯ (додаємо тут) */
/* ІНДИВІДУАЛЬНІ ЗОБРАЖЕННЯ (105 класів) */
/* ---------------------------------------------------- */
/* ---------------------------------------------------- */
.card-Анастезія {
 
    background-image: url("https://mafiacc.site/images/6/6e/Hero_anastasia.png"); /* ЗМІНИТИ НА ПРАВИЛЬНЕ ПОСИЛАННЯ */
.card-Абракаладабра { background-image: url("https://mafiacc.site/images/placeholders/Hero_Абракаладабра.png"); }
}
.card-Адамант { background-image: url("https://mafiacc.site/images/placeholders/Hero_Адамант.png"); }
.card-Ноунейм {
.card-Алоха { background-image: url("https://mafiacc.site/images/placeholders/Hero_Алоха.png"); }
    background-image: url("https://mafiacc.site/images/6/6e/Hero_noname.png"); /* ЗМІНИТИ НА ПРАВИЛЬНЕ ПОСИЛАННЯ */
.card-Ананасік { background-image: url("https://mafiacc.site/images/placeholders/Hero_Ананасік.png"); }
}
.card-Анастезія { background-image: url("https://mafiacc.site/images/placeholders/Hero_Анастезія.png"); }
.card-Берлін {
.card-Андервуд { background-image: url("https://mafiacc.site/images/placeholders/Hero_Андервуд.png"); }
    background-image: url("https://mafiacc.site/images/6/6e/Hero_berlin.png"); /* Ваше посилання */
.card-Аристократ { background-image: url("https://mafiacc.site/images/placeholders/Hero_Аристократ.png"); }
}
.card-Аріель { background-image: url("https://mafiacc.site/images/placeholders/Hero_Аріель.png"); }
/* ... і так для всіх 40 карток ... */
.card-Артерія { background-image: url("https://mafiacc.site/images/placeholders/Hero_Артерія.png"); }
.card-Ачоровал { background-image: url("https://mafiacc.site/images/placeholders/Hero_Ачоровал.png"); }
.card-Балтіка-9 { background-image: url("https://mafiacc.site/images/placeholders/Hero_Балтіка-9.png"); }
.card-Барні { background-image: url("https://mafiacc.site/images/placeholders/Hero_Барні.png"); }
.card-Безкiнечнiсть { background-image: url("https://mafiacc.site/images/placeholders/Hero_Безкiнечнiсть.png"); }
.card-Бейбі { background-image: url("https://mafiacc.site/images/placeholders/Hero_Бейбі.png"); }
.card-Бейтман { background-image: url("https://mafiacc.site/images/placeholders/Hero_Бейтман.png"); }
.card-Бембі { background-image: url("https://mafiacc.site/images/placeholders/Hero_Бембі.png"); }
.card-Бендер { background-image: url("https://mafiacc.site/images/placeholders/Hero_Бендер.png"); }
.card-Берлін { background-image: url("https://mafiacc.site/images/placeholders/Hero_Берлін.png"); }
.card-Бетмен { background-image: url("https://mafiacc.site/images/placeholders/Hero_Бетмен.png"); }
.card-Бівер { background-image: url("https://mafiacc.site/images/placeholders/Hero_Бівер.png"); }
.card-Блінк { background-image: url("https://mafiacc.site/images/placeholders/Hero_Блінк.png"); }
.card-Боб { background-image: url("https://mafiacc.site/images/placeholders/Hero_Боб.png"); }
.card-Бонд { background-image: url("https://mafiacc.site/images/placeholders/Hero_Бонд.png"); }
.card-Борщ { background-image: url("https://mafiacc.site/images/placeholders/Hero_Борщ.png"); }
.card-Браун { background-image: url("https://mafiacc.site/images/placeholders/Hero_Браун.png"); }
.card-Бродхан { background-image: url("https://mafiacc.site/images/placeholders/Hero_Бродхан.png"); }
.card-Васильович { background-image: url("https://mafiacc.site/images/placeholders/Hero_Васильович.png"); }
.card-ВВ { background-image: url("https://mafiacc.site/images/placeholders/Hero_ВВ.png"); }
.card-Вишня { background-image: url("https://mafiacc.site/images/placeholders/Hero_Вишня.png"); }
.card-Вікі { background-image: url("https://mafiacc.site/images/placeholders/Hero_Вікі.png"); }
.card-Вотер { background-image: url("https://mafiacc.site/images/placeholders/Hero_Вотер.png"); }
.card-Гробік { background-image: url("https://mafiacc.site/images/placeholders/Hero_Гробік.png"); }
.card-Гроза { background-image: url("https://mafiacc.site/images/placeholders/Hero_Гроза.png"); }
.card-Гросмейстер { background-image: url("https://mafiacc.site/images/placeholders/Hero_Гросмейстер.png"); }
.card-Дальтонік { background-image: url("https://mafiacc.site/images/placeholders/Hero_Дальтонік.png"); }
.card-Дантес { background-image: url("https://mafiacc.site/images/placeholders/Hero_Дантес.png"); }
.card-Дежаву { background-image: url("https://mafiacc.site/images/placeholders/Hero_Дежаву.png"); }
.card-Демон { background-image: url("https://mafiacc.site/images/placeholders/Hero_Демон.png"); }
.card-Джордж { background-image: url("https://mafiacc.site/images/placeholders/Hero_Джордж.png"); }
.card-Динамо { background-image: url("https://mafiacc.site/images/placeholders/Hero_Динамо.png"); }
.card-Доктор-Хаус { background-image: url("https://mafiacc.site/images/placeholders/Hero_Доктор-Хаус.png"); }
.card-Доктор-Ямато { background-image: url("https://mafiacc.site/images/placeholders/Hero_Доктор-Ямато.png"); }
.card-Дюймовочка { background-image: url("https://mafiacc.site/images/placeholders/Hero_Дюймовочка.png"); }
.card-Емесай { background-image: url("https://mafiacc.site/images/placeholders/Hero_Емесай.png"); }
.card-Еморі { background-image: url("https://mafiacc.site/images/placeholders/Hero_Еморі.png"); }
.card-ЕХС { background-image: url("https://mafiacc.site/images/placeholders/Hero_ЕХС.png"); }
.card-Жасмін { background-image: url("https://mafiacc.site/images/placeholders/Hero_Жасмін.png"); }
.card-Жовтень { background-image: url("https://mafiacc.site/images/placeholders/Hero_Жовтень.png"); }
.card-Зірка { background-image: url("https://mafiacc.site/images/placeholders/Hero_Зірка.png"); }
.card-Зодіак { background-image: url("https://mafiacc.site/images/placeholders/Hero_Зодіак.png"); }
.card-Індиго { background-image: url("https://mafiacc.site/images/placeholders/Hero_Індиго.png"); }
.card-Інфанта { background-image: url("https://mafiacc.site/images/placeholders/Hero_Інфанта.png"); }
.card-Інша { background-image: url("https://mafiacc.site/images/placeholders/Hero_Інша.png"); }
.card-Ітеро { background-image: url("https://mafiacc.site/images/placeholders/Hero_Ітеро.png"); }
.card-Іуда { background-image: url("https://mafiacc.site/images/placeholders/Hero_Іуда.png"); }
.card-Каратель { background-image: url("https://mafiacc.site/images/placeholders/Hero_Каратель.png"); }
.card-Карфакс { background-image: url("https://mafiacc.site/images/placeholders/Hero_Карфакс.png"); }
.card-Кексік { background-image: url("https://mafiacc.site/images/placeholders/Hero_Кексік.png"); }
.card-Керміт { background-image: url("https://mafiacc.site/images/placeholders/Hero_Керміт.png"); }
.card-Кетрін { background-image: url("https://mafiacc.site/images/placeholders/Hero_Кетрін.png"); }
.card-Кінік { background-image: url("https://mafiacc.site/images/placeholders/Hero_Кінік.png"); }
.card-Кіноманка { background-image: url("https://mafiacc.site/images/placeholders/Hero_Кіноманка.png"); }
.card-Кіфа { background-image: url("https://mafiacc.site/images/placeholders/Hero_Кіфа.png"); }
.card-Клайд { background-image: url("https://mafiacc.site/images/placeholders/Hero_Клайд.png"); }
.card-Клей { background-image: url("https://mafiacc.site/images/placeholders/Hero_Клей.png"); }
.card-Кобальт { background-image: url("https://mafiacc.site/images/placeholders/Hero_Кобальт.png"); }
.card-Колапс { background-image: url("https://mafiacc.site/images/placeholders/Hero_Колапс.png"); }
.card-Комар { background-image: url("https://mafiacc.site/images/placeholders/Hero_Комар.png"); }
.card-Комедіант { background-image: url("https://mafiacc.site/images/placeholders/Hero_Комедіант.png"); }
.card-Космос { background-image: url("https://mafiacc.site/images/placeholders/Hero_Космос.png"); }
.card-Котик { background-image: url("https://mafiacc.site/images/placeholders/Hero_Котик.png"); }
.card-Кузя { background-image: url("https://mafiacc.site/images/placeholders/Hero_Кузя.png"); }
.card-Ластон { background-image: url("https://mafiacc.site/images/placeholders/Hero_Ластон.png"); }
.card-Лева { background-image: url("https://mafiacc.site/images/placeholders/Hero_Лева.png"); }
.card-Леві { background-image: url("https://mafiacc.site/images/placeholders/Hero_Леві.png"); }
.card-Легасі { background-image: url("https://mafiacc.site/images/placeholders/Hero_Легасі.png"); }
.card-Лектор { background-image: url("https://mafiacc.site/images/placeholders/Hero_Лектор.png"); }
.card-Лектоp { background-image: url("https://mafiacc.site/images/placeholders/Hero_Лектоp.png"); }
.card-Лемур { background-image: url("https://mafiacc.site/images/placeholders/Hero_Лемур.png"); }
.card-Лівінгстон { background-image: url("https://mafiacc.site/images/placeholders/Hero_Лівінгстон.png"); }
.card-Лілія { background-image: url("https://mafiacc.site/images/placeholders/Hero_Лілія.png"); }
.card-Ліна { background-image: url("https://mafiacc.site/images/placeholders/Hero_Ліна.png"); }
.card-Лінчакі { background-image: url("https://mafiacc.site/images/placeholders/Hero_Лінчакі.png"); }
.card-Ліп-Дей { background-image: url("https://mafiacc.site/images/placeholders/Hero_Ліп-Дей.png"); }
.card-Магуз { background-image: url("https://mafiacc.site/images/placeholders/Hero_Магуз.png"); }
.card-Маджест { background-image: url("https://mafiacc.site/images/placeholders/Hero_Маджест.png"); }
.card-Македонський { background-image: url("https://mafiacc.site/images/placeholders/Hero_Македонський.png"); }
.card-Малена { background-image: url("https://mafiacc.site/images/placeholders/Hero_Малена.png"); }
.card-Мальвінка { background-image: url("https://mafiacc.site/images/placeholders/Hero_Мальвінка.png"); }
.card-Малюк { background-image: url("https://mafiacc.site/images/placeholders/Hero_Малюк.png"); }
.card-Мамка { background-image: url("https://mafiacc.site/images/placeholders/Hero_Мамка.png"); }
.card-Марвел { background-image: url("https://mafiacc.site/images/placeholders/Hero_Марвел.png"); }
.card-Маска { background-image: url("https://mafiacc.site/images/placeholders/Hero_Маска.png"); }
.card-Мата { background-image: url("https://mafiacc.site/images/placeholders/Hero_Мата.png"); }
.card-Медді { background-image: url("https://mafiacc.site/images/placeholders/Hero_Медді.png"); }
.card-Медик { background-image: url("https://mafiacc.site/images/placeholders/Hero_Медик.png"); }
.card-Меля { background-image: url("https://mafiacc.site/images/placeholders/Hero_Меля.png"); }
.card-Мері { background-image: url("https://mafiacc.site/images/placeholders/Hero_Мері.png"); }
.card-Меріманго { background-image: url("https://mafiacc.site/images/placeholders/Hero_Меріманго.png"); }
.card-Мерч { background-image: url("https://mafiacc.site/images/placeholders/Hero_Мерч.png"); }
.card-Механік { background-image: url("https://mafiacc.site/images/placeholders/Hero_Механік.png"); }
.card-Міна { background-image: url("https://mafiacc.site/images/placeholders/Hero_Міна.png"); }
.card-Міракл-Найт { background-image: url("https://mafiacc.site/images/placeholders/Hero_Міракл-Найт.png"); }
.card-Містер-Тен { background-image: url("https://mafiacc.site/images/placeholders/Hero_Містер-Тен.png"); }
.card-Муза { background-image: url("https://mafiacc.site/images/placeholders/Hero_Муза.png"); }
.card-Мун { background-image: url("https://mafiacc.site/images/placeholders/Hero_Мун.png"); }
.card-Мюнхен { background-image: url("https://mafiacc.site/images/placeholders/Hero_Мюнхен.png"); }
.card-Назавжди { background-image: url("https://mafiacc.site/images/placeholders/Hero_Назавжди.png"); }
.card-Найтінґейл { background-image: url("https://mafiacc.site/images/placeholders/Hero_Найтінґейл.png"); }
.card-Ната { background-image: url("https://mafiacc.site/images/placeholders/Hero_Ната.png"); }
.card-Нахтіґаль { background-image: url("https://mafiacc.site/images/placeholders/Hero_Нахтіґаль.png"); }
.card-Нелл { background-image: url("https://mafiacc.site/images/placeholders/Hero_Нелл.png"); }
.card-Ніколетта { background-image: url("https://mafiacc.site/images/placeholders/Hero_Ніколетта.png"); }
.card-Ноунейм { background-image: url("https://mafiacc.site/images/placeholders/Hero_Ноунейм.png"); }
.card-Нюта { background-image: url("https://mafiacc.site/images/placeholders/Hero_Нюта.png"); }
.card-Оксі { background-image: url("https://mafiacc.site/images/placeholders/Hero_Оксі.png"); }
.card-Оттерія { background-image: url("https://mafiacc.site/images/placeholders/Hero_Оттерія.png"); }
.card-Палац-Україна { background-image: url("https://mafiacc.site/images/placeholders/Hero_Палац-Україна.png"); }
.card-Панда { background-image: url("https://mafiacc.site/images/placeholders/Hero_Панда.png"); }
.card-Патрік { background-image: url("https://mafiacc.site/images/placeholders/Hero_Патрік.png"); }
.card-Патрон { background-image: url("https://mafiacc.site/images/placeholders/Hero_Патрон.png"); }
.card-Пікассо { background-image: url("https://mafiacc.site/images/placeholders/Hero_Пікассо.png"); }
.card-Пірожуля { background-image: url("https://mafiacc.site/images/placeholders/Hero_Пірожуля.png"); }
.card-Повар { background-image: url("https://mafiacc.site/images/placeholders/Hero_Повар.png"); }
.card-Посейдон { background-image: url("https://mafiacc.site/images/placeholders/Hero_Посейдон.png"); }
.card-Привіт-киця { background-image: url("https://mafiacc.site/images/placeholders/Hero_Привіт-киця.png"); }
.card-Протон { background-image: url("https://mafiacc.site/images/placeholders/Hero_Протон.png"); }
.card-Радаґаст { background-image: url("https://mafiacc.site/images/placeholders/Hero_Радаґаст.png"); }
.card-Радист { background-image: url("https://mafiacc.site/images/placeholders/Hero_Радист.png"); }
.card-Расм { background-image: url("https://mafiacc.site/images/placeholders/Hero_Расм.png"); }
.card-Рауль { background-image: url("https://mafiacc.site/images/placeholders/Hero_Рауль.png"); }
.card-Рендал { background-image: url("https://mafiacc.site/images/placeholders/Hero_Рендал.png"); }
.card-Ротація { background-image: url("https://mafiacc.site/images/placeholders/Hero_Ротація.png"); }
.card-Седвік { background-image: url("https://mafiacc.site/images/placeholders/Hero_Седвік.png"); }
.card-Сенаторс { background-image: url("https://mafiacc.site/images/placeholders/Hero_Сенаторс.png"); }
.card-Сенс { background-image: url("https://mafiacc.site/images/placeholders/Hero_Сенс.png"); }
.card-Сімон { background-image: url("https://mafiacc.site/images/placeholders/Hero_Сімон.png"); }
.card-Скромний { background-image: url("https://mafiacc.site/images/placeholders/Hero_Скромний.png"); }
.card-Соло { background-image: url("https://mafiacc.site/images/placeholders/Hero_Соло.png"); }
.card-Справа { background-image: url("https://mafiacc.site/images/placeholders/Hero_Справа.png"); }
.card-Стеля { background-image: url("https://mafiacc.site/images/placeholders/Hero_Стеля.png"); }
.card-Сутінки { background-image: url("https://mafiacc.site/images/placeholders/Hero_Сутінки.png"); }
.card-Тайєр { background-image: url("https://mafiacc.site/images/placeholders/Hero_Тайєр.png"); }
.card-Тігарбо { background-image: url("https://mafiacc.site/images/placeholders/Hero_Тігарбо.png"); }
.card-Тіна { background-image: url("https://mafiacc.site/images/placeholders/Hero_Тіна.png"); }
.card-Трололо { background-image: url("https://mafiacc.site/images/placeholders/Hero_Трололо.png"); }
.card-Тян { background-image: url("https://mafiacc.site/images/placeholders/Hero_Тян.png"); }
.card-Фавер { background-image: url("https://mafiacc.site/images/placeholders/Hero_Фавер.png"); }
.card-Фаза { background-image: url("https://mafiacc.site/images/placeholders/Hero_Фаза.png"); }
.card-Фейт { background-image: url("https://mafiacc.site/images/placeholders/Hero_Фейт.png"); }
.card-Фенікс { background-image: url("https://mafiacc.site/images/placeholders/Hero_Фенікс.png"); }
.card-Фея { background-image: url("https://mafiacc.site/images/placeholders/Hero_Фея.png"); }
.card-Філоріан { background-image: url("https://mafiacc.site/images/placeholders/Hero_Філоріан.png"); }
.card-Фінлі { background-image: url("https://mafiacc.site/images/placeholders/Hero_Фінлі.png"); }
.card-Флекс { background-image: url("https://mafiacc.site/images/placeholders/Hero_Флекс.png"); }
.card-Фолд { background-image: url("https://mafiacc.site/images/placeholders/Hero_Фолд.png"); }
.card-Фeя { background-image: url("https://mafiacc.site/images/placeholders/Hero_Фeя.png"); }
.card-Х'юґо { background-image: url("https://mafiacc.site/images/placeholders/Hero_Х'юґо.png"); }
.card-Хантер { background-image: url("https://mafiacc.site/images/placeholders/Hero_Хантер.png"); }
.card-Хоррорчік { background-image: url("https://mafiacc.site/images/placeholders/Hero_Хоррорчік.png"); }
.card-Хуаніта { background-image: url("https://mafiacc.site/images/placeholders/Hero_Хуаніта.png"); }
.card-Шадоу { background-image: url("https://mafiacc.site/images/placeholders/Hero_Шадоу.png"); }
.card-Шеперд { background-image: url("https://mafiacc.site/images/placeholders/Hero_Шеперд.png"); }
.card-Шостік { background-image: url("https://mafiacc.site/images/placeholders/Hero_Шостік.png"); }
.card-Щирі-Очі { background-image: url("https://mafiacc.site/images/placeholders/Hero_Щирі-Очі.png"); }
.card-Ювентіно { background-image: url("https://mafiacc.site/images/placeholders/Hero_Ювентіно.png"); }
.card-Nasty27 { background-image: url("https://mafiacc.site/images/placeholders/Hero_Nasty27.png"); }
Отримано з https://mafiacc.site/index.php/Спеціальна:Мобільна_різниця_версій/3546