MediaWiki:Common.css: различия между версиями

Материал из Игровой проект Хаос Тайги
Новая страница: «→Размещённый здесь CSS будет применяться ко всем темам оформления: →Общие контейнеры главной страницы: .ht-welcome-box { width: 100%; background: #2a2a2a; border: 2px solid #e0711a; border-radius: 8px; padding: 25px; margin-bottom: 20px; color: #ffffff; } .ht-grid { display: flex; justify-content: space-between; gap: 15px; fl...»
 
Нет описания правки
 
(не показана 1 промежуточная версия этого же участника)
Строка 1: Строка 1:
/* Размещённый здесь CSS будет применяться ко всем темам оформления */
/* Главный баннер */
/* Общие контейнеры главной страницы */
.main-banner {
.ht-welcome-box {
     background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
     width: 100%;
     border-radius: 15px;
     background: #2a2a2a;
     padding: 40px;
     border: 2px solid #e0711a;
     color: white;
     border-radius: 8px;
     text-align: center;
     padding: 25px;
     margin-bottom: 30px;
     margin-bottom: 20px;
     box-shadow: 0 10px 30px rgba(0,0,0,0.3);
     color: #ffffff;
}
}
.ht-grid {
 
     display: flex;
.main-banner h1 {
     justify-content: space-between;
     font-size: 2.5em;
    gap: 15px;
     margin-bottom: 15px;
     flex-wrap: wrap;
     text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
    margin-bottom: 25px;
}
}
/* Карточки серверов */
/* Карточки серверов */
.ht-card {
.server-card {
     flex: 1;
     background: white;
     min-width: 220px;
     border-radius: 10px;
     background: #ffffff;
    padding: 20px;
     border: 1px solid #cccccc;
    margin: 15px 0;
    border-radius: 6px;
     box-shadow: 0 4px 15px rgba(0,0,0,0.1);
     overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
     box-shadow: 0 2px 4px rgba(0,0,0,0.05);
     border-left: 5px solid #667eea;
     display: flex;
}
     flex-direction: column;
 
.server-card:hover {
     transform: translateY(-5px);
     box-shadow: 0 8px 25px rgba(0,0,0,0.15);
}
 
.server-card.tf2 {
     border-left-color: #e67e22;
    background: linear-gradient(to right, #fff5eb, #ffffff);
}
 
.server-card.csgo {
    border-left-color: #3498db;
    background: linear-gradient(to right, #ebf5ff, #ffffff);
}
 
.server-card.css {
     border-left-color: #f39c12;
    background: linear-gradient(to right, #fff8eb, #ffffff);
}
}
.ht-card-header {
 
    background: #e0711a;
/* Иконки и эмодзи */
    color: #ffffff;
.feature-item {
    font-weight: bold;
     padding: 10px 0;
    font-size: 16px;
     border-bottom: 1px solid #eee;
     padding: 10px 15px;
     text-align: center;
}
}
.ht-card-header.tf2 { background: #b85621; }
.ht-card-header.csgo { background: #4b69ff; }
.ht-card-header.css { background: #de9b00; }


.ht-card-body {
.feature-item:last-child {
     padding: 15px;
     border-bottom: none;
    background: #fdfdfd;
    flex-grow: 1;
}
}
.ht-server-link {
 
     display: block;
/* Кнопки */
    margin: 8px 0;
.btn {
     padding: 6px;
     display: inline-block;
     background: #f1f1f1;
     padding: 12px 25px;
    border-radius: 4px;
     background: #667eea;
    text-align: center;
     color: white;
    font-weight: bold;
     color: #333333 !important;
     text-decoration: none;
     text-decoration: none;
    border-radius: 5px;
    margin: 5px;
    transition: background 0.3s ease;
}
.btn:hover {
    background: #5568d3;
}
}
.ht-server-link:hover {
 
     background: #e2e2e2;
/* Анимация */
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}
 
.main-content > div {
     animation: fadeIn 0.6s ease-out;
}
}

Текущая версия от 11:14, 4 ноября 2026

/* Главный баннер */
.main-banner {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border-radius: 15px;
    padding: 40px;
    color: white;
    text-align: center;
    margin-bottom: 30px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.3);
}

.main-banner h1 {
    font-size: 2.5em;
    margin-bottom: 15px;
    text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
}

/* Карточки серверов */
.server-card {
    background: white;
    border-radius: 10px;
    padding: 20px;
    margin: 15px 0;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    border-left: 5px solid #667eea;
}

.server-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.15);
}

.server-card.tf2 {
    border-left-color: #e67e22;
    background: linear-gradient(to right, #fff5eb, #ffffff);
}

.server-card.csgo {
    border-left-color: #3498db;
    background: linear-gradient(to right, #ebf5ff, #ffffff);
}

.server-card.css {
    border-left-color: #f39c12;
    background: linear-gradient(to right, #fff8eb, #ffffff);
}

/* Иконки и эмодзи */
.feature-item {
    padding: 10px 0;
    border-bottom: 1px solid #eee;
}

.feature-item:last-child {
    border-bottom: none;
}

/* Кнопки */
.btn {
    display: inline-block;
    padding: 12px 25px;
    background: #667eea;
    color: white;
    text-decoration: none;
    border-radius: 5px;
    margin: 5px;
    transition: background 0.3s ease;
}

.btn:hover {
    background: #5568d3;
}

/* Анимация */
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

.main-content > div {
    animation: fadeIn 0.6s ease-out;
}