MediaWiki:Common.css

/* CSS placed here will be applied to all skins */

/* Снимаем ограничения ширины с главного контейнера оглавления */
#mw-panel .toc,
#mw-panel #toc {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    display: block !important; /* Убиваем дефолтный display: table, который распирает блок */
}

/* Уменьшаем огромные отступы у вложенных списков (лесенку) */
#mw-panel .toc ul,
#mw-panel #toc ul {
    margin-left: 12px !important; /* Делаем шаг вложенности минимальным */
    padding-left: 0 !important;
}

/* Превращаем ссылки во Flex-контейнеры, чтобы номер и текст не конфликтовали */
#mw-panel .toc a,
#mw-panel #toc a {
    display: flex !important;
    align-items: flex-start !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* Заставляем сам текст ломаться и переноситься, заполняя остаток ширины */
#mw-panel .toc .toctext,
#mw-panel #toc .toctext {
    white-space: normal !important;
    word-break: break-word !important; /* Сломает слово, только если оно длиннее всего сайдбара */
    overflow-wrap: break-word !important;
    padding-left: 0 !important;
    flex: 1 !important; /* Текст занимает всё оставшееся место */
}

/* Фиксируем цифры, чтобы Flexbox их не сплющил при длинном тексте */
#mw-panel .toc .tocnumber,
#mw-panel #toc .tocnumber {
    flex-shrink: 0 !important;
    margin-right: 0 !important;
    padding-right: 6px !important;
}

/* Раздвигаем пункты содержания по вертикали */
#mw-panel .toc li,
#mw-panel #toc li {
    margin-bottom: 8px !important; 
}

/* Отрываем блок подпунктов от родительского текста */
#mw-panel .toc ul ul,
#mw-panel #toc ul ul {
    margin-top: 8px !important;
}

/* Обычная (непосещенная) ссылка */
#mw-panel .toc a:link,
#mw-panel #toc a:link {
    color: #3366BB !important;
}

/* Посещенная ссылка (стандартный фиолетовый цвет MediaWiki) */
#mw-panel .toc a:visited,
#mw-panel #toc a:visited {
    color: #0B0080 !important; 
}

/* Красная (битая) ссылка */
#mw-panel .toc a.new,
#mw-panel #toc a.new {
    color: #CC2200 !important;
}



/* --- Независимость левого сайдбара с содержанием --- */
#mw-panel {
    position: fixed !important; 
    top: 0 !important; 
    left: 0 !important;
    height: 100vh !important;
    overflow-y: auto !important; 
    overflow-x: hidden !important; 
    padding-top: 0 !important; 
    z-index: 99 !important;
    width: 10.4em !important; /* Сдвигаем невидимую границу вправо, освобождая место для поиска */
}

/* Возвращаем логотип внутрь сайдбара и защищаем его подпись */
#p-logo {
    position: relative !important;
    top: 0 !important; 
    display: block !important;
    min-height: 180px !important; /* Жестко бронируем высоту, чтобы надпись "documentation" точно влезла */
    margin-bottom: 15px !important; /* Увеличили отступ, чтобы аккуратно отодвинуть поиск */
}

/* Делаем ползунок скролла тонким и красивым (для браузеров Chrome/Edge/Safari/Opera) */
#mw-panel::-webkit-scrollbar {
    width: 6px;
}
#mw-panel::-webkit-scrollbar-track {
    background: transparent;
}
#mw-panel::-webkit-scrollbar-thumb {
    background-color: #c8ccd1; 
    border-radius: 4px;
}

/* Создаем невидимую пустую область (распорку) в самом низу содержимого сайдбара */
#mw-panel::after {
    content: "";
    display: block;
    height: 50px;
}