|
|
| (не показаны 2 промежуточные версии этого же участника) |
| Строка 1: |
Строка 1: |
| /* ============================================ | | /* Простые стили для главной страницы */ |
| КАСТОМНЫЙ ДИЗАЙН ГЛАВНОЙ СТРАНИЦЫ
| |
| Скин: Timeless
| |
| Проект: Игровой проект Хаос Тайги
| |
| ============================================ */
| |
| | |
| /* === 1. ГЛАВНЫЙ БАННЕР (HERO) === */
| |
| .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 { | | .server-table td { |
| font-size: 2.2em; | | padding: 15px; |
| margin: 0 0 10px 0;
| | vertical-align: top; |
| font-weight: 700;
| |
| letter-spacing: 1px; | |
| } | | } |
|
| |
|
| .hero-banner p {
| | .server-box { |
| font-size: 1.1em;
| | background: #f8f9fa; |
| opacity: 0.9;
| | border-radius: 8px; |
| margin: 0;
| | padding: 20px; |
| }
| | border-left: 4px solid #e67e22; |
| | |
| .hero-banner #toc,
| |
| .hero-banner .toc {
| |
| display: none !important;
| |
| }
| |
| | |
| /* === 2. СЕТКА КАРТОЧЕК СЕРВЕРОВ === */
| |
| .server-grid { | |
| display: flex;
| |
| flex-wrap: wrap;
| |
| gap: 20px;
| |
| margin-bottom: 30px;
| |
| }
| |
| | |
| .server-card {
| |
| flex: 1;
| |
| min-width: 280px;
| |
| background: #ffffff; | |
| 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 { | | .quick-links-box { |
| transform: translateY(-5px);
| |
| box-shadow: 0 8px 25px rgba(0,0,0,0.1);
| |
| }
| |
| | |
| .server-card.tf2 { border-top-color: #e67e22; }
| |
| .server-card.csgo { border-top-color: #3498db; }
| |
| .server-card.css { border-top-color: #f1c40f; }
| |
| | |
| .server-card h3 {
| |
| margin-top: 0;
| |
| font-size: 1.4em;
| |
| display: flex;
| |
| align-items: center;
| |
| gap: 10px;
| |
| }
| |
| | |
| .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;
| |
| }
| |
| | |
| /* === 3. БЛОК БЫСТРЫХ ССЫЛОК === */
| |
| .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 strong {
| |
| display: block;
| |
| margin-bottom: 10px;
| |
| font-size: 1.1em;
| |
| }
| |
| | |
| .quick-links a {
| |
| display: inline-block;
| |
| margin: 5px 10px; | |
| padding: 10px 18px;
| |
| background: #2a2a2a;
| |
| color: white !important;
| |
| border-radius: 6px;
| |
| text-decoration: none;
| |
| font-weight: 600;
| |
| transition: background 0.2s, transform 0.2s;
| |
| }
| |
| | |
| .quick-links a:hover {
| |
| background: #e67e22;
| |
| transform: translateY(-2px);
| |
| }
| |
| | |
| /* === 4. ПОДДЕРЖКА ТЁМНОЙ ТЕМЫ === */
| |
| .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 .server-card ul li a:hover {
| |
| color: #e67e22;
| |
| }
| |
| | |
| .skin-timeless.mw-theme-dark .quick-links {
| |
| background: #222;
| |
| border-color: #444;
| |
| color: #e0e0e0;
| |
| }
| |
| | |
| .skin-timeless.mw-theme-dark .quick-links a {
| |
| background: #444;
| |
| }
| |
| | |
| .skin-timeless.mw-theme-dark .quick-links a:hover {
| |
| background: #e67e22;
| |
| }
| |
| | |
| /* === 5. СКРЫТИЕ БОКОВЫХ ПАНЕЛЕЙ (УНИВЕРСАЛЬНЫЙ МЕТОД) === */
| |
| | |
| /* Скрываем ВСЕ боковые панели в Timeless */
| |
| .skin-timeless #mw-panel-navigation,
| |
| .skin-timeless #mw-panel-tb,
| |
| .skin-timeless #mw-panel-page-tools,
| |
| .skin-timeless .mw-portlet-navigation,
| |
| .skin-timeless .mw-portlet-page-tools,
| |
| .skin-timeless .mw-portlet-tb,
| |
| .skin-timeless #p-navigation,
| |
| .skin-timeless #p-tb,
| |
| .skin-timeless #p-page-tools {
| |
| display: none !important;
| |
| }
| |
| | |
| /* Расширяем контент на всю ширину */
| |
| .skin-timeless #mw-content-container {
| |
| max-width: 100% !important;
| |
| margin: 0 auto !important;
| |
| padding: 20px !important;
| |
| }
| |
| | |
| /* Убираем отступы для боковых колонок */
| |
| .skin-timeless .mw-portlet {
| |
| display: none !important;
| |
| }
| |
| | |
| /* Возвращаем нормальный вид для обычных статей (если нужно) */
| |
| /* Раскомментируйте строки ниже, если хотите показать панели на других страницах */
| |
| /*
| |
| .skin-timeless:not(.page-Home) #mw-panel-navigation,
| |
| .skin-timeless:not(.page-Home) .mw-portlet-navigation {
| |
| display: block !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;
}
