MediaWiki:Citizen.css: Unterschied zwischen den Versionen

Version vom 6. Juli 2026, 10:17 Uhr

/* Das folgende CSS wird für Benutzer des Citizen-Skins geladen */
body {
    background: #fcfbf8;
}

.citizen-page-container {
    background: #ffffff;
}

.citizen-sidebar {
    background: #faf8f5;
}
/* Принудительно белый фон для всех основных областей */
body,
.skin-citizen .mw-page-container,
.skin-citizen .mw-header,
.skin-citizen .mw-content-container,
.skin-citizen .mw-workspace-container,
.skin-citizen .citizen-body-container {
    background-color: #ffffff !important;
}

/* Гарантируем, что текст будет темным и читабельным */
body,
.skin-citizen .mw-body-content,
.skin-citizen .mw-body,
.skin-citizen .mw-page-container * {
    color: #1a1a1a !important; /* Темно-серый, почти черный, хорошая читаемость */
}

/* На случай, если фон у карточек или панелей остается серым */
.skin-citizen .citizen-card,
.skin-citizen .citizen-panel,
.skin-citizen .mw-echo-ui-notificationItemWidget {
    background-color: #f8f9fa !important; /* Светлый фон, чтобы не сливался с белым */
    color: #1a1a1a !important;
}
/* ==========================================
   Michaeliten Wiki - Logo
   ========================================== */

/* Увеличиваем область логотипа */
.mw-logo {
    max-width: 110px !important;
    max-height: 110px !important;
}

/* Убираем ограничение на изображение */
.mw-logo img {
    max-width: 100% !important;
    max-height: 100% !important;
    width: auto !important;
    height: auto !important;
}
/* Футер - делаем фон белым, убираем голубизну */
.skin-citizen .mw-footer,
.skin-citizen .citizen-footer {
    background-color: #ffffff !important;
    /* Убираем градиент, если он есть */
    background-image: none !important;
    border-top: 1px solid #e0e0e0 !important; /* Легкая серая линия вместо голубой */
}

/* Все элементы внутри футера тоже на белом фоне */
.skin-citizen .mw-footer *,
.skin-citizen .citizen-footer * {
    background-color: transparent !important; /* Прозрачный фон, чтобы не перекрывать белый */
    color: #1a1a1a !important; /* Текст темный для читаемости */
}

/* Ссылки в футере делаем чуть светлее, но читаемыми */
.skin-citizen .mw-footer a,
.skin-citizen .citizen-footer a {
    color: #0645ad !important; /* Стандартный синий для ссылок */
}

.skin-citizen .mw-footer a:visited,
.skin-citizen .citizen-footer a:visited {
    color: #0b0080 !important; /* Цвет для посещенных ссылок */
}
/* Скрываем иконку логотипа в футере, оставляем только wordmark (logo1.png) */
.skin-citizen .mw-footer .mw-logo-icon,
.skin-citizen .citizen-footer .mw-logo-icon {
    display: none !important;
}

/* Убеждаемся, что wordmark отображается правильно */
.skin-citizen .mw-footer .mw-logo-wordmark,
.skin-citizen .citizen-footer .mw-logo-wordmark {
    display: block !important;
    height: 100px !important; /* Ваша желаемая высота */
    width: auto !important;
    max-width: 200px !important;
    filter: none !important; /* Убираем инверсию цвета */
}
/* Мобильная версия - убираем голубой фон у нижней панели (Drawer) */
@media screen and (max-width: 720px) {
    /* Основной блок панели */
    .citizen-drawer {
        background-color: #ffffff !important;
        background-image: none !important;
        border-top: 1px solid #e0e0e0 !important;
        box-shadow: none !important;
    }
    
    /* Заголовок панели (где логотип) */
    .citizen-drawer__header {
        background-color: #ffffff !important;
        background-image: none !important;
    }
    
    /* Меню панели (список ссылок) */
    .citizen-drawer__menu {
        background-color: #ffffff !important;
        background-image: none !important;
    }
    
    /* Все дочерние элементы */
    .citizen-drawer * {
        background-color: transparent !important;
        color: #1a1a1a !important;
    }
    
    /* Ссылки делаем синими для читаемости */
    .citizen-drawer a {
        color: #0645ad !important;
    }
    
    /* Заголовки разделов */
    .citizen-drawer .drawer__section-title,
    .citizen-drawer .mw-list-item .mw-list-item-label {
        color: #1a1a1a !important;
    }
}