MediaWiki:Light.css
Перейти до навігації
Перейти до пошуку
Увага: Після публікування слід очистити кеш браузера, щоб побачити зміни.
- Firefox / Safari: тримайте Shift, коли натискаєте Оновити, або натисніть Ctrl-F5 чи Ctrl-Shift-R (⌘-R на Apple Mac)
- Google Chrome: натисніть Ctrl-Shift-R (⌘-Shift-R на Apple Mac)
- Edge: тримайте Ctrl, коли натискаєте Оновити, або натисніть Ctrl-F5.
/* =========================
Світла тема для MediaWiki 1.44 (Vector)
========================= */
/* =========================
Фон сторінки та шапка
========================= */
html, body, .mw-body {
background-color: #f9f9f9;
color: #000000; /* основний текст чорний */
font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
min-height: 100%;
}
#mw-head {
background-color: #e0e0e0; /* світла шапка */
color: #000000;
}
#mw-head h1, #mw-head h2 {
color: #000000; /* заголовки чорні */
}
/* =========================
Панелі навігації
========================= */
#p-personal, #p-navigation, #p-tb, #p-lang, #p-cactions {
background-color: #e0e0e0;
color: #000000;
}
#p-personal a, #p-navigation a, #p-tb a, #p-lang a, #p-cactions a {
color: #000000;
}
#p-personal a:hover, #p-navigation a:hover, #p-tb a:hover,
#p-lang a:hover, #p-cactions a:hover {
text-decoration: underline;
}
/* =========================
Вкладки сторінки
========================= */
#ca-nstab-main, #ca-nstab-talk, #ca-view, #ca-edit, #ca-viewsource, #ca-history {
background-color: #ffffff !important;
border: 1px solid #ccc;
border-radius: 4px 4px 0 0;
}
#ca-nstab-main a,
#ca-nstab-talk a,
#ca-view a,
#ca-edit a,
#ca-viewsource a,
#ca-history a {
color: #000000 !important;
text-decoration: none;
padding: 4px 10px;
display: inline-block;
background-color: #ffffff !important;
box-shadow: none !important;
outline: none !important;
border-radius: 4px 4px 0 0;
}
/* Hover / Focus / Active для вкладок */
#ca-nstab-main a:hover,
#ca-nstab-talk a:hover,
#ca-view a:hover,
#ca-edit a:hover,
#ca-viewsource a:hover,
#ca-history a:hover,
#ca-nstab-main a:focus,
#ca-nstab-talk a:focus,
#ca-view a:focus,
#ca-edit a:focus,
#ca-viewsource a:focus,
#ca-history a:focus,
#ca-nstab-main a:active,
#ca-nstab-talk a:active,
#ca-view a:active,
#ca-edit a:active,
#ca-viewsource a:active,
#ca-history a:active {
background-color: #d0e1ff !important; /* світло-синій hover */
color: #1a73e8 !important;
box-shadow: none !important;
outline: none !important;
}
/* Активна вкладка */
#ca-nstab-main.mw-selected a,
#ca-nstab-talk.mw-selected a,
#ca-view.mw-selected a,
#ca-edit.mw-selected a,
#ca-viewsource.mw-selected a,
#ca-history.mw-selected a {
background-color: #d0e1ff !important;
color: #1a73e8 !important;
font-weight: bold;
box-shadow: none !important;
outline: none !important;
}
/* Vector специфіка */
.mw-vectorTabs a,
.mw-vectorTabs a:focus,
.mw-vectorTabs a:active {
background-color: #ffffff !important;
color: #000000 !important;
box-shadow: none !important;
outline: none !important;
}
/* =========================
Приховати вкладку Інструменти для неавторизованих користувачів
========================= */
body:not(.logged-in) #p-tb {
display: none !important;
}
/* =========================
Приховати бічні блоки для незареєстрованих користувачів
========================= */
body:not(.logged-in) #p-navigation,
body:not(.logged-in) #p-specialpages {
display: none !important;
}
/* =========================
Основний контент
========================= */
.mw-parser-output {
background-color: #ffffff;
padding: 20px;
border-radius: 6px;
}
p, li, span, a {
color: #000000;
text-decoration: none;
}
p a:hover, li a:hover, span a:hover {
color: #1a73e8;
text-decoration: underline;
}
/* Таблиці */
.mw-parser-output table {
border: 1px solid #ccc;
background-color: #ffffff;
color: #000000;
}
.mw-parser-output th {
background-color: #e0e0e0;
color: #000000;
padding: 6px;
}
.mw-parser-output td {
background-color: #ffffff;
padding: 6px;
}
/* =========================
Кнопки та форми
========================= */
button, input[type="submit"], input[type="button"] {
background-color: #f0f0f0 !important;
border: 1px solid #ccc !important;
color: #000000 !important;
padding: 6px 12px;
border-radius: 4px;
cursor: pointer;
box-shadow: none !important;
outline: none !important;
}
button:hover, button:focus, button:active,
input[type="submit"]:hover, input[type="submit"]:focus, input[type="submit"]:active,
input[type="button"]:hover, input[type="button"]:focus, input[type="button"]:active {
background-color: #d0e1ff !important;
color: #1a73e8 !important;
box-shadow: none !important;
outline: none !important;
}
/* Приховати політику конфіденційності та відмову від відповідальності у футері */
#footer-places-privacy,
#footer-places-disclaimers {
display: none !important;
}
/* =========================
Підвал сайту
========================= */
#footer {
background-color: #e0e0e0;
color: #555;
padding: 10px;
}
/* =========================
Приховати вкладки для неавторизованих користувачів
========================= */
body:not(.logged-in) #ca-nstab-talk,
body:not(.logged-in) #ca-talk,
body:not(.logged-in) #ca-viewsource,
body:not(.logged-in) #ca-history {
display: none !important;
}
/* =========================
УНІВЕРСАЛЬНИЙ РЕЖИМ ДОСТУПНОСТІ (для обох тем)
========================= */
body.accessibility-mode {
/* Поліпшена читабельність без фіксованого розміру шрифту */
line-height: 1.8 !important;
letter-spacing: 0.5px !important;
word-spacing: 1px !important;
}
/* ПОКРАЩЕНІ КОНТРАСТИ ТА КОЛЬОРИ */
body.accessibility-mode .mw-body,
body.accessibility-mode .mw-parser-output {
border: 3px solid #ff6600 !important;
background-color: #ffffff !important;
color: #000000 !important;
}
/* Для темної теми - особливі налаштування контрасту */
body.dark-theme.accessibility-mode .mw-body,
body.dark-theme.accessibility-mode .mw-parser-output {
background-color: #000000 !important;
color: #ffffff !important;
border-color: #ffff00 !important;
}
/* ПОКРАЩЕНА НАВІГАЦІЯ */
body.accessibility-mode #mw-head,
body.accessibility-mode #p-personal,
body.accessibility-mode #p-navigation,
body.accessibility-mode #p-tb,
body.accessibility-mode #p-lang {
background-color: #f8f8f8 !important;
border: 2px solid #ff6600 !important;
color: #000000 !important;
}
body.dark-theme.accessibility-mode #mw-head,
body.dark-theme.accessibility-mode #p-personal,
body.dark-theme.accessibility-mode #p-navigation,
body.dark-theme.accessibility-mode #p-tb,
body.dark-theme.accessibility-mode #p-lang {
background-color: #333333 !important;
border-color: #ffff00 !important;
color: #ffffff !important;
}
/* ЧІТКІ ПОСИЛАННЯ */
body.accessibility-mode a {
color: #d40000 !important;
font-weight: bold !important;
text-decoration: underline !important;
padding: 2px 4px !important;
border-radius: 3px !important;
}
body.accessibility-mode a:hover,
body.accessibility-mode a:focus {
color: #ffffff !important;
background-color: #d40000 !important;
text-decoration: none !important;
outline: 3px solid #ff6600 !important;
}
/* ВЕЛИКІ ТА ЧІТКІ КНОПКИ */
body.accessibility-mode button,
body.accessibility-mode input[type="submit"],
body.accessibility-mode input[type="button"] {
font-size: 16px !important;
padding: 14px 20px !important;
border: 3px solid #000000 !important;
border-radius: 8px !important;
min-height: 50px !important;
min-width: 120px !important;
font-weight: bold !important;
background-color: #1a73e8 !important;
color: #ffffff !important;
}
body.accessibility-mode button:hover,
body.accessibility-mode input[type="submit"]:hover,
body.accessibility-mode input[type="button"]:hover {
background-color: #d40000 !important;
border-color: #d40000 !important;
transform: scale(1.05) !important;
}
/* ПОЛЯ ВВОДУ */
body.accessibility-mode input[type="text"],
body.accessibility-mode input[type="search"],
body.accessibility-mode input[type="email"],
body.accessibility-mode textarea,
body.accessibility-mode select {
font-size: 16px !important;
padding: 12px !important;
border: 3px solid #000000 !important;
border-radius: 6px !important;
min-height: 44px !important;
background-color: #ffffff !important;
color: #000000 !important;
}
/* СИЛЬНІ ФОКУСИ ДЛЯ КЛАВІАТУРНОЇ НАВІГАЦІЇ */
body.accessibility-mode *:focus {
outline: 4px solid #ff6600 !important;
outline-offset: 3px !important;
box-shadow: 0 0 0 6px rgba(255, 102, 0, 0.3) !important;
}
/* АКТИВНІ ВКЛАДКИ */
body.accessibility-mode .mw-vectorTabs .mw-selected a,
body.accessibility-mode #ca-nstab-main.mw-selected a,
body.accessibility-mode #ca-nstab-talk.mw-selected a {
background-color: #d40000 !important;
color: #ffffff !important;
font-weight: bold !important;
font-size: 1.1em !important;
border: 3px solid #ff6600 !important;
}
/* ТАБЛИЦІ */
body.accessibility-mode table {
border: 3px solid #000000 !important;
background-color: #f8f8f8 !important;
}
body.accessibility-mode th {
background-color: #1a73e8 !important;
color: #ffffff !important;
font-weight: bold !important;
padding: 12px !important;
font-size: 1.1em !important;
}
body.accessibility-mode td {
background-color: #ffffff !important;
color: #000000 !important;
padding: 10px !important;
border: 2px solid #cccccc !important;
}
/* ЗОБРАЖЕННЯ */
body.accessibility-mode img {
border: 3px solid #1a73e8 !important;
border-radius: 5px !important;
}
body.accessibility-mode img:hover {
border-color: #d40000 !important;
transform: scale(1.02) !important;
}
/* СПИСКИ */
body.accessibility-mode ul,
body.accessibility-mode ol {
padding-left: 2em !important;
}
body.accessibility-mode li {
margin-bottom: 8px !important;
padding-left: 10px !important;
}
/* ЗАГОЛОВКИ */
body.accessibility-mode h1,
body.accessibility-mode h2,
body.accessibility-mode h3,
body.accessibility-mode h4,
body.accessibility-mode h5,
body.accessibility-mode h6 {
color: #d40000 !important;
border-left: 5px solid #1a73e8 !important;
padding-left: 15px !important;
margin-bottom: 1.2em !important;
}
/* КОД */
body.accessibility-mode code,
body.accessibility-mode pre {
background-color: #f0f0f0 !important;
color: #000000 !important;
border: 2px solid #cccccc !important;
padding: 10px !important;
font-size: 1.1em !important;
border-radius: 5px !important;
}
/* ВИДІЛЕННЯ ТЕКСТУ */
body.accessibility-mode ::selection {
background-color: #ff6600 !important;
color: #ffffff !important;
}
body.accessibility-mode ::-moz-selection {
background-color: #ff6600 !important;
color: #ffffff !important;
}