|
|
| (не показано 5 промежуточных версий этого же участника) |
| Строка 1: |
Строка 1: |
| /* === КАСТОМНЫЙ ДИЗАЙН ГЛАВНОЙ СТРАНИЦЫ ДЛЯ TIMELESS === */ | | /* Простые стили для главной страницы */ |
| | |
| /* Главный баннер-приветствие */
| |
| .hero-banner { | | .hero-banner { |
| background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%); | | background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%); |
| color: #ffffff; | | color: white; |
| padding: 40px 20px; | | padding: 30px; |
| border-radius: 12px; | | border-radius: 10px; |
| text-align: center; | | text-align: center; |
| margin-bottom: 30px; | | margin-bottom: 20px; |
| box-shadow: 0 8px 20px rgba(0,0,0,0.15);
| |
| }
| |
| .hero-banner h1 {
| |
| font-size: 2.2em;
| |
| margin: 0 0 10px 0;
| |
| font-weight: 700;
| |
| letter-spacing: 1px;
| |
| }
| |
| .hero-banner p {
| |
| font-size: 1.1em;
| |
| opacity: 0.9;
| |
| margin: 0;
| |
| } | | } |
|
| |
|
| /* Сетка для карточек серверов */
| | .server-table td { |
| .server-grid { | | padding: 15px; |
| display: flex; | | vertical-align: top; |
| flex-wrap: wrap;
| |
| gap: 20px;
| |
| margin-bottom: 30px; | |
| } | | } |
|
| |
|
| /* Отдельная карточка сервера */
| | .server-box { |
| .server-card { | | background: #f8f9fa; |
| flex: 1;
| | border-radius: 8px; |
| min-width: 280px;
| | padding: 20px; |
| background: #ffffff; | | border-left: 4px solid #e67e22; |
| border-radius: 10px; | |
| padding: 25px; | |
| box-shadow: 0 4px 12px rgba(0,0,0,0.05); | |
| border-top: 5px solid #ccc;
| |
| transition: transform 0.2s ease, box-shadow 0.2s ease;
| |
| }
| |
| .server-card:hover {
| |
| transform: translateY(-5px);
| |
| box-shadow: 0 8px 25px rgba(0,0,0,0.1);
| |
| }
| |
| | |
| /* Цветовые акценты для разных игр */
| |
| .server-card.tf2 { border-top-color: #e67e22; } /* Оранжевый для TF2 */
| |
| .server-card.csgo { border-top-color: #3498db; } /* Синий для CS:GO */
| |
| .server-card.css { border-top-color: #f1c40f; } /* Жёлтый для CS:S */
| |
| | |
| .server-card h3 {
| |
| margin-top: 0;
| |
| font-size: 1.4em;
| |
| display: flex;
| |
| align-items: center;
| |
| gap: 10px;
| |
| } | | } |
|
| |
|
| /* Список ссылок внутри карточки */
| | .quick-links-box { |
| .server-card ul {
| |
| list-style: none;
| |
| padding: 0;
| |
| margin: 15px 0 0 0;
| |
| }
| |
| .server-card ul li {
| |
| margin-bottom: 10px;
| |
| padding-left: 20px;
| |
| position: relative;
| |
| }
| |
| .server-card ul li::before {
| |
| content: "▸";
| |
| position: absolute;
| |
| left: 0;
| |
| color: #888;
| |
| }
| |
| .server-card ul li a {
| |
| text-decoration: none;
| |
| color: #333;
| |
| font-weight: 500;
| |
| transition: color 0.2s;
| |
| }
| |
| .server-card ul li a:hover {
| |
| color: #e67e22; /* Цвет при наведении */
| |
| }
| |
| | |
| /* Блок быстрых ссылок внизу */
| |
| .quick-links { | |
| background: #f8f9fa; | | background: #f8f9fa; |
| border-radius: 10px;
| |
| padding: 20px; | | padding: 20px; |
| | border-radius: 8px; |
| text-align: center; | | text-align: center; |
| border: 1px solid #e9ecef;
| | margin-top: 20px; |
| }
| |
| .quick-links a {
| |
| display: inline-block;
| |
| margin: 5px 10px; | |
| padding: 8px 16px;
| |
| background: #2a2a2a;
| |
| color: white !important;
| |
| border-radius: 6px;
| |
| text-decoration: none;
| |
| font-weight: 600;
| |
| transition: background 0.2s;
| |
| }
| |
| .quick-links a:hover {
| |
| background: #e67e22;
| |
| }
| |
| | |
| /* Адаптация под тёмную тему Timeless (если пользователь её включит) */
| |
| .skin-timeless.mw-theme-dark .server-card {
| |
| background: #2d2d2d;
| |
| color: #e0e0e0;
| |
| }
| |
| .skin-timeless.mw-theme-dark .server-card ul li a {
| |
| color: #e0e0e0;
| |
| }
| |
| .skin-timeless.mw-theme-dark .quick-links {
| |
| background: #222;
| |
| border-color: #444;
| |
| }
| |
| /* Скрываем правую боковую панель в Timeless */
| |
| .skin-timeless #mw-panel-tb,
| |
| .skin-timeless .mw-portlet-page-tools,
| |
| .skin-timeless #p-tb {
| |
| display: none !important;
| |
| } | | } |
/* Простые стили для главной страницы */
.hero-banner {
background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
color: white;
padding: 30px;
border-radius: 10px;
text-align: center;
margin-bottom: 20px;
}
.server-table td {
padding: 15px;
vertical-align: top;
}
.server-box {
background: #f8f9fa;
border-radius: 8px;
padding: 20px;
border-left: 4px solid #e67e22;
}
.quick-links-box {
background: #f8f9fa;
padding: 20px;
border-radius: 8px;
text-align: center;
margin-top: 20px;
}
