MediaWiki:Citizen.css: Unterschied zwischen den Versionen

Version vom 7. Juli 2026, 13:00 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; /* Убираем инверсию цвета */
}
@media screen and (max-width: 720px) {
    .citizen-drawer,
    .citizen-drawer__container,
    .citizen-drawer__header,
    .citizen-drawer__menu {
        background-color: #ffffff !important;
        background-image: none !important;
    }
    
    .citizen-drawer * {
        background-color: transparent !important;
    }
    
    .citizen-drawer .mw-list-item a {
        color: #1a1a1a !important;
    }
/*07.07.26*/

/* Исправляем позиционирование левой панели БЕЗ смещения контента */
.skin-citizen .mw-page-container {
    position: relative !important;
    padding-left: 280px !important; /* Создаём место для панели */
}

/* Левая панель - фиксируем её слева */
.skin-citizen .citizen-panel,
.skin-citizen .mw-panel {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 280px !important;
    height: 100vh !important;
    overflow-y: auto !important;
    background-color: #ffffff !important;
    border-right: 1px solid #e0e0e0 !important;
    z-index: 100 !important;
}

/* Хедер - теперь он не смещается */
.skin-citizen .mw-header {
    margin-left: 0 !important;
    width: 100% !important;
    position: relative !important;
    z-index: 10 !important;
}

/* Основной контент - без лишних отступов */
.skin-citizen .mw-body,
.skin-citizen .mw-body-container {
    margin-left: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 20px !important;
    box-sizing: border-box !important;
}

/* Мобильная версия - убираем отступы и панель внизу */
@media screen and (max-width: 720px) {
    .skin-citizen .mw-page-container {
        padding-left: 0 !important;
    }
    
    .skin-citizen .citizen-panel,
    .skin-citizen .mw-panel {
        position: relative !important;
        width: 100% !important;
        height: auto !important;
        border-right: none !important;
        border-bottom: 1px solid #e0e0e0 !important;
    }
}