MediaWiki:Common.css
Страница интерфейса MediaWiki
Дополнительные действия
Замечание: Возможно, после публикации вам придётся очистить кэш своего браузера, чтобы увидеть изменения.
- Firefox / Safari: Удерживая клавишу Shift, нажмите на панели инструментов Обновить либо нажмите Ctrl+F5 или Ctrl+R (⌘+R на Mac)
- Google Chrome: Нажмите Ctrl+Shift+R (⌘+Shift+R на Mac)
- Edge: Удерживая Ctrl, нажмите Обновить либо нажмите Ctrl+F5
- Opera: Нажмите Ctrl+F5.
/* =========================================================
CRYPTOWIKI — MEDIAWIKI COMMON.CSS
Dark technical interface / Acid Green / Minimalism
Совместимость: Vector 2022, Vector Legacy, MonoBook, Timeless
========================================================= */
/* ---------- 1. FONTS ---------- */
@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&family=Space+Grotesk:wght@400;500;600;700&display=swap');
/* ---------- 2. DESIGN TOKENS ---------- */
:root {
color-scheme: dark;
--cw-bg: #090b0b;
--cw-panel: #101414;
--cw-panel-hover: #171d1a;
--cw-panel-active: #1d261d;
--cw-text: #e8eee8;
--cw-muted: #89938c;
--cw-subtle: #59635c;
--cw-accent: #c4f36b;
--cw-accent-hover: #d7ff80;
--cw-accent-soft: rgba(196, 243, 107, 0.10);
--cw-line: rgba(226, 239, 228, 0.14);
--cw-line-strong: rgba(226, 239, 228, 0.24);
--cw-danger: #ff7777;
--cw-warning: #f3c969;
--cw-success: #a8e58b;
--cw-info: #82c8ed;
--cw-radius: 8px;
--cw-radius-small: 5px;
--cw-font: 'Manrope', 'Segoe UI', sans-serif;
--cw-heading: 'Space Grotesk', 'Manrope', sans-serif;
--cw-mono: 'DM Mono', 'Consolas', monospace;
--cw-content-width: 1200px;
}
/* ---------- 3. GLOBAL RESET ---------- */
html {
background: var(--cw-bg) !important;
scroll-behavior: smooth;
}
body,
.mw-page-container,
.mw-body,
#content,
#mw-content-container,
#mw-page-base,
#mw-head-base {
background: var(--cw-bg) !important;
color: var(--cw-text) !important;
}
body {
font-family: var(--cw-font);
font-size: 15px;
line-height: 1.75;
}
* {
scrollbar-width: thin;
scrollbar-color: #39443b var(--cw-bg);
}
*::-webkit-scrollbar {
width: 9px;
height: 9px;
}
*::-webkit-scrollbar-track {
background: var(--cw-bg);
}
*::-webkit-scrollbar-thumb {
background: #39443b;
border: 2px solid var(--cw-bg);
border-radius: 10px;
}
*::-webkit-scrollbar-thumb:hover {
background: var(--cw-accent);
}
::selection {
background: var(--cw-accent);
color: #090b0b;
}
/* ---------- 4. BACKGROUND GRID ---------- */
body {
background-image:
linear-gradient(rgba(196, 243, 107, 0.018) 1px, transparent 1px),
linear-gradient(90deg, rgba(196, 243, 107, 0.018) 1px, transparent 1px) !important;
background-size: 48px 48px;
background-attachment: fixed;
}
/* ---------- 5. LINKS ---------- */
a,
a:visited {
color: var(--cw-accent);
text-decoration: none;
transition:
color 0.18s ease,
opacity 0.18s ease;
}
a:hover,
a:focus {
color: var(--cw-accent-hover);
text-decoration: none;
}
a:active {
opacity: 0.75;
}
a.new,
a.new:visited {
color: var(--cw-danger);
}
a.external,
a.extiw {
color: var(--cw-accent);
}
.mw-parser-output a.external::after {
opacity: 0.45;
}
/* ---------- 6. HEADINGS ---------- */
h1,
h2,
h3,
h4,
h5,
h6,
.firstHeading,
.mw-first-heading {
color: var(--cw-text) !important;
font-family: var(--cw-heading);
font-weight: 600;
letter-spacing: -0.035em;
line-height: 1.25;
}
h1,
.firstHeading,
.mw-first-heading {
font-size: clamp(2rem, 4vw, 3rem);
border-bottom: 1px solid var(--cw-line);
padding-bottom: 0.35em;
margin-bottom: 0.8em;
}
h2 {
font-size: 1.8rem;
margin-top: 1.8em;
padding-bottom: 0.35em;
border-bottom: 1px solid var(--cw-line);
}
h3 {
font-size: 1.35rem;
margin-top: 1.5em;
}
h4 {
font-size: 1.1rem;
}
.mw-parser-output h2 .mw-headline,
.mw-parser-output h3 .mw-headline {
color: var(--cw-text);
}
/* ---------- 7. HEADER / VECTOR ---------- */
.vector-header-container,
.vector-header,
.vector-sticky-header,
#mw-head,
#mw-page-header,
#mw-navigation,
#mw-panel,
.vector-main-menu-container {
background: rgba(9, 11, 11, 0.94) !important;
color: var(--cw-text) !important;
border-color: var(--cw-line) !important;
}
.vector-header-container,
.vector-sticky-header {
border-bottom: 1px solid var(--cw-line) !important;
backdrop-filter: blur(16px);
}
.vector-header-container a,
.vector-header a,
.vector-sticky-header a,
#mw-head a {
color: var(--cw-text);
}
.vector-header-container a:hover,
.vector-header a:hover,
.vector-sticky-header a:hover,
#mw-head a:hover {
color: var(--cw-accent);
}
.vector-header-container .mw-logo,
#p-logo {
opacity: 0.95;
}
.mw-logo-icon {
filter: none;
}
.mw-logo-wordmark,
.mw-logo-tagline {
color: var(--cw-text) !important;
}
/* ---------- 8. SEARCH ---------- */
.vector-search-box,
#p-search,
#searchform,
.mw-search-form,
.mw-search-form-wrapper {
color: var(--cw-text);
}
.vector-search-box input,
#searchInput,
#searchText,
.mw-search-form input,
input[type="search"] {
background: var(--cw-panel) !important;
color: var(--cw-text) !important;
border: 1px solid var(--cw-line) !important;
border-radius: var(--cw-radius-small) !important;
font-family: var(--cw-font);
transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.vector-search-box input:focus,
#searchInput:focus,
#searchText:focus,
input[type="search"]:focus {
border-color: var(--cw-accent) !important;
outline: none !important;
box-shadow: 0 0 0 3px var(--cw-accent-soft);
}
.vector-search-box input::placeholder,
input::placeholder {
color: var(--cw-muted);
}
/* ---------- 9. SIDEBAR ---------- */
.vector-main-menu,
.vector-main-menu-container,
#mw-panel,
#mw-panel .portal,
#mw-panel .portal .body {
background: transparent !important;
color: var(--cw-text);
}
.vector-main-menu,
#mw-panel {
border-right: 1px solid var(--cw-line);
}
.vector-main-menu .vector-menu-heading,
#mw-panel h3,
#mw-panel .portal h3 {
color: var(--cw-muted) !important;
font-family: var(--cw-mono);
font-size: 0.72rem;
font-weight: 500;
letter-spacing: 0.12em;
text-transform: uppercase;
}
.vector-main-menu a,
#mw-panel .portal a {
color: var(--cw-muted);
border-radius: var(--cw-radius-small);
transition: all 0.18s ease;
}
.vector-main-menu a:hover,
#mw-panel .portal a:hover {
color: var(--cw-accent);
background: var(--cw-accent-soft);
}
.vector-main-menu .vector-menu-content-list,
#mw-panel .portal .body {
padding: 5px 0;
}
#mw-panel .portal {
border: none;
margin-bottom: 1.5em;
}
/* ---------- 10. PAGE CONTENT ---------- */
#content,
.mw-body,
.mw-content-container {
color: var(--cw-text);
}
.mw-body {
border: 1px solid var(--cw-line);
border-radius: var(--cw-radius);
padding: clamp(20px, 4vw, 42px) !important;
margin-top: 20px;
background: rgba(16, 20, 20, 0.82) !important;
box-shadow: 0 12px 50px rgba(0, 0, 0, 0.12);
}
.mw-body-content {
font-size: 15px;
line-height: 1.85;
}
.mw-parser-output {
max-width: var(--cw-content-width);
}
.mw-parser-output > p:first-of-type {
margin-top: 0;
}
.mw-parser-output p {
margin: 0.9em 0;
}
/* ---------- 11. PAGE TABS ---------- */
.vector-menu-tabs,
.vector-menu-tabs-legacy,
#p-views,
#p-namespaces {
background: transparent !important;
border: none !important;
}
.vector-menu-tabs li,
.vector-menu-tabs-legacy li {
background: transparent !important;
border: none !important;
}
.vector-menu-tabs a,
.vector-menu-tabs-legacy a,
#p-views a,
#p-namespaces a {
color: var(--cw-muted) !important;
border: 1px solid transparent !important;
border-radius: var(--cw-radius-small);
padding: 7px 11px !important;
transition: all 0.18s ease;
}
.vector-menu-tabs a:hover,
.vector-menu-tabs-legacy a:hover,
#p-views a:hover,
#p-namespaces a:hover {
color: var(--cw-accent) !important;
background: var(--cw-accent-soft) !important;
}
.vector-menu-tabs .selected a,
.vector-menu-tabs-legacy .selected a,
#p-views .selected a,
#p-namespaces .selected a {
color: var(--cw-accent) !important;
background: var(--cw-accent-soft) !important;
border-color: rgba(196, 243, 107, 0.2) !important;
}
/* ---------- 12. TABLE OF CONTENTS ---------- */
#toc,
.toc,
.toccolours {
background: var(--cw-panel) !important;
border: 1px solid var(--cw-line) !important;
border-radius: var(--cw-radius);
padding: 18px 22px;
color: var(--cw-text);
box-shadow: none;
}
#toc .toctitle,
.toc .toctitle {
color: var(--cw-text);
font-family: var(--cw-heading);
font-size: 1rem;
font-weight: 700;
}
#toc ul,
.toc ul {
margin-top: 10px;
}
#toc li,
.toc li {
margin: 4px 0;
}
#toc a,
.toc a {
color: var(--cw-muted);
}
#toc a:hover,
.toc a:hover {
color: var(--cw-accent);
}
.toctogglelabel {
color: var(--cw-accent);
}
/* ---------- 13. TABLES ---------- */
.mw-parser-output table {
border-collapse: separate;
border-spacing: 0;
width: 100%;
margin: 1.5em 0;
background: var(--cw-panel);
border: 1px solid var(--cw-line);
border-radius: var(--cw-radius);
overflow: hidden;
}
.mw-parser-output th {
background: #171e19;
color: var(--cw-accent);
font-family: var(--cw-heading);
font-weight: 600;
text-align: left;
}
.mw-parser-output th,
.mw-parser-output td {
padding: 12px 15px;
border: none;
border-bottom: 1px solid var(--cw-line);
}
.mw-parser-output tr:last-child td {
border-bottom: none;
}
.mw-parser-output tr:nth-child(even) td {
background: rgba(255, 255, 255, 0.018);
}
.mw-parser-output tr:hover td {
background: rgba(196, 243, 107, 0.035);
}
/* ---------- 14. CODE / SYNTAX ---------- */
code,
tt,
.mw-code,
.mw-highlight,
pre,
.sourceCode {
font-family: var(--cw-mono) !important;
}
code,
tt {
color: var(--cw-accent);
background: rgba(196, 243, 107, 0.08);
border: 1px solid rgba(196, 243, 107, 0.12);
border-radius: 4px;
padding: 2px 5px;
font-size: 0.88em;
}
pre,
.mw-code,
.mw-highlight {
background: #080b09 !important;
color: #dce8dc !important;
border: 1px solid var(--cw-line) !important;
border-radius: var(--cw-radius);
padding: 18px !important;
overflow-x: auto;
line-height: 1.65;
}
pre code {
background: transparent;
border: none;
padding: 0;
color: inherit;
}
.mw-highlight .k,
.mw-highlight .kd,
.mw-highlight .kn {
color: #c4f36b;
}
.mw-highlight .s,
.mw-highlight .s1,
.mw-highlight .s2 {
color: #a8d9a0;
}
.mw-highlight .c,
.mw-highlight .c1,
.mw-highlight .cm {
color: #78857a;
}
/* ---------- 15. BLOCKQUOTES ---------- */
blockquote {
margin: 1.5em 0;
padding: 15px 20px;
background: var(--cw-panel);
border-left: 3px solid var(--cw-accent);
border-radius: 0 var(--cw-radius) var(--cw-radius) 0;
color: var(--cw-muted);
}
blockquote p:first-child {
margin-top: 0;
}
blockquote p:last-child {
margin-bottom: 0;
}
/* ---------- 16. LISTS ---------- */
.mw-parser-output ul,
.mw-parser-output ol {
padding-left: 1.7em;
}
.mw-parser-output li {
margin: 0.35em 0;
}
.mw-parser-output ul > li::marker {
color: var(--cw-accent);
}
.mw-parser-output ol > li::marker {
color: var(--cw-accent);
font-family: var(--cw-mono);
}
/* ---------- 17. INFOBOXES ---------- */
.infobox,
.mw-parser-output .infobox {
background: var(--cw-panel) !important;
color: var(--cw-text) !important;
border: 1px solid var(--cw-line) !important;
border-radius: var(--cw-radius);
padding: 12px;
margin: 0 0 20px 20px;
max-width: 340px;
}
.infobox th,
.infobox caption {
background: #171e19 !important;
color: var(--cw-accent) !important;
}
.infobox td,
.infobox th {
border-color: var(--cw-line) !important;
}
.infobox a {
color: var(--cw-accent);
}
/* ---------- 18. NOTICE BOXES ---------- */
.mbox,
.ambox,
.tmbox,
.imbox,
.cmbox,
.fmbox,
.messagebox {
background: var(--cw-panel) !important;
color: var(--cw-text) !important;
border: 1px solid var(--cw-line) !important;
border-left: 3px solid var(--cw-accent) !important;
border-radius: var(--cw-radius);
padding: 12px 16px;
}
.ambox-notice,
.mbox-notice {
border-left-color: var(--cw-info) !important;
}
.ambox-warning,
.mbox-warning {
border-left-color: var(--cw-warning) !important;
}
.ambox-delete,
.mbox-delete {
border-left-color: var(--cw-danger) !important;
}
/* ---------- 19. CATEGORIES ---------- */
.catlinks {
background: var(--cw-panel) !important;
border: 1px solid var(--cw-line) !important;
border-radius: var(--cw-radius);
padding: 12px 16px;
color: var(--cw-muted);
}
.catlinks a {
color: var(--cw-accent);
}
.mw-normal-catlinks,
.mw-hidden-catlinks {
color: var(--cw-muted);
}
/* ---------- 20. BUTTONS ---------- */
button,
input[type="submit"],
input[type="button"],
input[type="reset"],
.mw-ui-button,
.oo-ui-buttonElement-button {
background: var(--cw-panel) !important;
color: var(--cw-text) !important;
border: 1px solid var(--cw-line-strong) !important;
border-radius: var(--cw-radius-small) !important;
padding: 8px 14px;
font-family: var(--cw-font);
font-weight: 600;
cursor: pointer;
transition: all 0.18s ease;
}
button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
.mw-ui-button:hover,
.oo-ui-buttonElement-button:hover {
color: var(--cw-accent) !important;
border-color: var(--cw-accent) !important;
background: var(--cw-accent-soft) !important;
}
.mw-ui-button-primary,
.oo-ui-buttonElement-framed.oo-ui-flaggedElement-primary .oo-ui-buttonElement-button {
background: var(--cw-accent) !important;
color: #090b0b !important;
border-color: var(--cw-accent) !important;
}
.mw-ui-button-primary:hover,
.oo-ui-buttonElement-framed.oo-ui-flaggedElement-primary .oo-ui-buttonElement-button:hover {
background: var(--cw-accent-hover) !important;
color: #090b0b !important;
}
/* ---------- 21. INPUTS / FORMS ---------- */
input,
textarea,
select {
background: var(--cw-panel) !important;
color: var(--cw-text) !important;
border: 1px solid var(--cw-line) !important;
border-radius: var(--cw-radius-small) !important;
font-family: var(--cw-font);
padding: 8px 10px;
}
input:focus,
textarea:focus,
select:focus {
outline: none !important;
border-color: var(--cw-accent) !important;
box-shadow: 0 0 0 3px var(--cw-accent-soft);
}
textarea {
line-height: 1.6;
}
label {
color: var(--cw-muted);
}
/* ---------- 22. EDITOR ---------- */
.wikiEditor-ui,
.wikiEditor-ui .wikiEditor-ui-top,
.wikiEditor-ui .wikiEditor-ui-toolbar,
.wikiEditor-ui .wikiEditor-ui-text,
.wikiEditor-ui .wikiEditor-ui-bottom {
background: var(--cw-panel) !important;
color: var(--cw-text) !important;
border-color: var(--cw-line) !important;
}
.wikiEditor-ui textarea,
#wpTextbox1,
#wpSummary {
background: #080b09 !important;
color: var(--cw-text) !important;
border: 1px solid var(--cw-line) !important;
font-family: var(--cw-mono) !important;
}
.mw-editform,
.mw-editform fieldset {
border-color: var(--cw-line);
}
.mw-editform legend {
color: var(--cw-accent);
}
/* ---------- 23. FOOTER ---------- */
#footer,
#footer-info,
#footer-places,
.mw-footer {
color: var(--cw-muted) !important;
background: transparent !important;
border-color: var(--cw-line) !important;
}
#footer a,
.mw-footer a {
color: var(--cw-muted);
}
#footer a:hover,
.mw-footer a:hover {
color: var(--cw-accent);
}
/* ---------- 24. SPECIAL PAGES ---------- */
.mw-specialpages-list,
.mw-allpages-table,
.mw-category,
.mw-category-group {
color: var(--cw-text);
}
.mw-specialpages-list h4,
.mw-category-group h3 {
color: var(--cw-accent);
font-family: var(--cw-heading);
}
.mw-allpages-table th,
.mw-allpages-table td {
border-color: var(--cw-line);
}
.mw-pager-navigation-bar {
background: var(--cw-panel);
border: 1px solid var(--cw-line);
border-radius: var(--cw-radius);
padding: 10px;
}
/* ---------- 25. DIFF / HISTORY ---------- */
.mw-diff,
.diff {
color: var(--cw-text);
}
.diff-addedline {
background: rgba(120, 200, 110, 0.12) !important;
border-color: rgba(120, 200, 110, 0.35) !important;
}
.diff-deletedline {
background: rgba(255, 100, 100, 0.10) !important;
border-color: rgba(255, 100, 100, 0.3) !important;
}
.diff-addedline .diffchange {
background: rgba(120, 200, 110, 0.22);
}
.diff-deletedline .diffchange {
background: rgba(255, 100, 100, 0.2);
}
.mw-history-compareselected {
background: var(--cw-accent-soft);
}
/* ---------- 26. NOTIFICATIONS ---------- */
.mw-notification,
.mw-notification-area {
background: var(--cw-panel) !important;
color: var(--cw-text) !important;
border: 1px solid var(--cw-line) !important;
border-radius: var(--cw-radius);
}
.mw-notification-type-warn {
border-left: 3px solid var(--cw-warning) !important;
}
.mw-notification-type-error {
border-left: 3px solid var(--cw-danger) !important;
}
.mw-notification-type-success {
border-left: 3px solid var(--cw-success) !important;
}
/* ---------- 27. IMAGES / GALLERIES ---------- */
.thumbinner,
.gallerybox,
.gallerytext {
background: var(--cw-panel) !important;
border-color: var(--cw-line) !important;
color: var(--cw-muted) !important;
}
.thumbcaption {
color: var(--cw-muted);
font-size: 0.85rem;
}
figure,
.mw-file-description {
color: var(--cw-muted);
}
/* ---------- 28. HORIZONTAL RULE ---------- */
hr {
border: none;
border-top: 1px solid var(--cw-line);
margin: 2em 0;
}
/* ---------- 29. MONOSPACE METADATA ---------- */
.mw-editsection,
.mw-editsection-like,
.mw-last-modified,
#siteSub,
#contentSub,
.mw-indicators {
color: var(--cw-muted) !important;
font-family: var(--cw-mono);
font-size: 0.75rem;
}
.mw-editsection a {
color: var(--cw-accent);
}
/* ---------- 30. VECTOR 2022 CONTENT WIDTH ---------- */
.vector-body,
.vector-body-before-content,
.vector-body-after-content {
color: var(--cw-text);
}
.vector-page-toolbar,
.vector-page-toolbar-container {
background: transparent !important;
}
.vector-page-titlebar,
.vector-page-titlebar h1 {
color: var(--cw-text) !important;
}
/* ---------- 31. LEGACY SKIN SUPPORT ---------- */
#column-content,
#content {
background: transparent !important;
}
#p-cactions,
#p-personal,
#p-namespaces,
#p-views {
background: transparent !important;
}
#p-cactions li,
#p-personal li {
background: var(--cw-panel);
border: 1px solid var(--cw-line);
border-radius: var(--cw-radius-small);
}
#p-cactions a,
#p-personal a {
color: var(--cw-muted);
}
#p-cactions a:hover,
#p-personal a:hover {
color: var(--cw-accent);
}
/* ---------- 32. ANIMATIONS ---------- */
@media (prefers-reduced-motion: no-preference) {
a,
button,
input,
.mw-ui-button,
.vector-menu-tabs a,
#mw-panel .portal a {
transition:
color 0.18s ease,
background-color 0.18s ease,
border-color 0.18s ease,
box-shadow 0.18s ease;
}
}
/* ---------- 33. RESPONSIVE ---------- */
@media screen and (max-width: 900px) {
.mw-body {
padding: 22px !important;
margin-top: 10px;
}
.mw-parser-output table {
display: block;
overflow-x: auto;
}
.infobox {
max-width: 100%;
margin: 0 0 20px 0;
float: none;
}
}
@media screen and (max-width: 600px) {
body {
font-size: 14px;
background-size: 32px 32px;
}
.mw-body {
border-left: none;
border-right: none;
border-radius: 0;
padding: 16px !important;
margin-top: 0;
}
h1,
.firstHeading,
.mw-first-heading {
font-size: 2rem;
}
h2 {
font-size: 1.5rem;
}
#toc,
.toc {
padding: 12px;
}
.mw-parser-output th,
.mw-parser-output td {
padding: 9px 10px;
}
}
/* ---------- 34. DARK THEME ENFORCEMENT ---------- */
.skin-vector-2022,
.skin-vector,
.skin-monobook,
.skin-timeless {
background: var(--cw-bg) !important;
color: var(--cw-text) !important;
}
.vector-dropdown-content,
.vector-menu-dropdown .vector-menu-content,
.oo-ui-popupWidget-popup,
.oo-ui-menuSelectWidget,
.oo-ui-menuOptionWidget,
.mw-rcfilters-ui-filterMenuHeaderWidget-header {
background: var(--cw-panel) !important;
color: var(--cw-text) !important;
border-color: var(--cw-line) !important;
}
.vector-dropdown-content a,
.oo-ui-menuOptionWidget {
color: var(--cw-text) !important;
}
.vector-dropdown-content a:hover,
.oo-ui-menuOptionWidget:hover {
background: var(--cw-accent-soft) !important;
color: var(--cw-accent) !important;
}
/* ---------- 35. FINAL POLISH ---------- */
.mw-parser-output .mw-collapsible {
background: var(--cw-panel);
border: 1px solid var(--cw-line);
border-radius: var(--cw-radius);
padding: 12px;
}
.mw-collapsible-toggle {
color: var(--cw-accent);
}
.mw-parser-output .mw-collapsible-toggle a {
color: var(--cw-accent);
}
.mw-parser-output .hatnote,
.hatnote {
color: var(--cw-muted);
font-size: 0.9rem;
}
.mw-parser-output .plainlinks a {
color: var(--cw-accent);
}
.mw-parser-output .error {
color: var(--cw-danger);
}
.mw-parser-output .success {
color: var(--cw-success);
}
/* =========================================================
CRYPTOWIKI — COMMON.CSS EXTENSION
Дополнительные стили интерфейса MediaWiki
========================================================= */
/* ---------- 36. VECTOR DROPDOWNS ---------- */
.vector-dropdown,
.vector-menu-dropdown {
background: transparent !important;
}
.vector-dropdown-label,
.vector-menu-dropdown .vector-menu-heading {
color: var(--cw-muted) !important;
}
.vector-dropdown-label:hover,
.vector-menu-dropdown .vector-menu-heading:hover {
color: var(--cw-accent) !important;
}
.vector-dropdown-content,
.vector-menu-dropdown .vector-menu-content {
background: var(--cw-panel) !important;
border: 1px solid var(--cw-line) !important;
border-radius: var(--cw-radius) !important;
box-shadow: 0 12px 35px rgba(0, 0, 0, .35) !important;
padding: 6px !important;
}
.vector-dropdown-content a,
.vector-menu-dropdown .vector-menu-content a {
display: block;
color: var(--cw-muted) !important;
border-radius: 4px;
padding: 8px 12px !important;
}
.vector-dropdown-content a:hover,
.vector-menu-dropdown .vector-menu-content a:hover {
background: var(--cw-accent-soft) !important;
color: var(--cw-accent) !important;
}
/* ---------- 37. PERSONAL MENU ---------- */
#p-personal,
.vector-user-links,
.vector-user-menu {
color: var(--cw-muted) !important;
}
#p-personal a,
.vector-user-links a,
.vector-user-menu a {
color: var(--cw-muted) !important;
}
#p-personal a:hover,
.vector-user-links a:hover,
.vector-user-menu a:hover {
color: var(--cw-accent) !important;
}
/* ---------- 38. LOGIN / ACCOUNT ---------- */
.mw-htmlform,
.mw-htmlform-field-HTMLTextField,
.mw-htmlform-field-HTMLTextAreaField,
.mw-htmlform-field-HTMLSelectField {
color: var(--cw-text);
}
.mw-htmlform fieldset {
background: var(--cw-panel);
border: 1px solid var(--cw-line);
border-radius: var(--cw-radius);
padding: 20px;
}
.mw-htmlform legend {
color: var(--cw-accent);
font-family: var(--cw-heading);
font-weight: 600;
}
.mw-htmlform label {
color: var(--cw-muted);
}
.mw-htmlform input {
max-width: 100%;
}
/* ---------- 39. SEARCH RESULTS ---------- */
.mw-search-results {
color: var(--cw-text);
}
.mw-search-result {
padding: 16px 0;
border-bottom: 1px solid var(--cw-line);
}
.mw-search-result-heading {
font-family: var(--cw-heading);
font-size: 1.15rem;
font-weight: 600;
}
.mw-search-result-heading a {
color: var(--cw-accent);
}
.mw-search-result-data,
.searchresult {
color: var(--cw-muted);
}
.mw-search-result-data {
font-family: var(--cw-mono);
font-size: .75rem;
}
/* ---------- 40. RECENT CHANGES ---------- */
.mw-changeslist,
.mw-changeslist-line {
color: var(--cw-text);
}
.mw-changeslist-line {
padding: 5px 8px;
border-radius: 4px;
}
.mw-changeslist-line:hover {
background: var(--cw-accent-soft);
}
.mw-plusminus-pos {
color: var(--cw-success);
}
.mw-plusminus-neg {
color: var(--cw-danger);
}
.mw-tag {
background: var(--cw-panel-active);
color: var(--cw-accent);
border: 1px solid var(--cw-line);
border-radius: 4px;
padding: 2px 6px;
font-family: var(--cw-mono);
font-size: .7rem;
}
/* ---------- 41. PAGINATION ---------- */
.mw-pager-navigation-bar,
.mw-pager-navigation-bar a {
color: var(--cw-muted);
}
.mw-pager-navigation-bar a {
padding: 5px 9px;
border-radius: 4px;
}
.mw-pager-navigation-bar a:hover {
color: var(--cw-accent);
background: var(--cw-accent-soft);
}
/* ---------- 42. CATEGORY PAGES ---------- */
.mw-category-generated {
background: transparent;
}
.mw-category-group {
background: var(--cw-panel);
border: 1px solid var(--cw-line);
border-radius: var(--cw-radius);
padding: 15px 20px;
margin: 15px 0;
}
.mw-category-group h3 {
color: var(--cw-accent);
font-family: var(--cw-heading);
border-bottom: 1px solid var(--cw-line);
padding-bottom: 8px;
}
.mw-category-group ul {
columns: 2;
column-gap: 30px;
}
@media (max-width: 600px) {
.mw-category-group ul {
columns: 1;
}
}
/* ---------- 43. FILE PAGES ---------- */
.fullImageLink,
.filehistory,
.fileinfo {
color: var(--cw-muted);
}
.filehistory {
background: var(--cw-panel);
border: 1px solid var(--cw-line);
border-radius: var(--cw-radius);
padding: 15px;
}
.filehistory th,
.filehistory td {
border-color: var(--cw-line);
}
.mw-filepage-other-resolutions {
color: var(--cw-muted);
}
/* ---------- 44. COLLAPSIBLE ELEMENTS ---------- */
.mw-collapsible {
border: 1px solid var(--cw-line);
border-radius: var(--cw-radius);
background: var(--cw-panel);
padding: 12px 16px;
}
.mw-collapsible-toggle {
font-family: var(--cw-mono);
font-size: .8rem;
}
.mw-collapsible-toggle a {
color: var(--cw-accent) !important;
}
/* ---------- 45. TOOLTIP ---------- */
.mw-tooltip,
.oo-ui-popupWidget-popup {
background: var(--cw-panel) !important;
color: var(--cw-text) !important;
border: 1px solid var(--cw-line) !important;
border-radius: var(--cw-radius) !important;
box-shadow: 0 10px 30px rgba(0, 0, 0, .3) !important;
}
/* ---------- 46. MODALS ---------- */
.oo-ui-window-frame,
.oo-ui-dialog,
.oo-ui-processDialog-content {
background: var(--cw-panel) !important;
color: var(--cw-text) !important;
border: 1px solid var(--cw-line) !important;
border-radius: var(--cw-radius) !important;
}
.oo-ui-window-head,
.oo-ui-dialog-content {
background: var(--cw-panel) !important;
color: var(--cw-text) !important;
}
.oo-ui-window-head {
border-bottom: 1px solid var(--cw-line) !important;
}
/* ---------- 47. NOTICES AND WARNINGS ---------- */
.mw-message-box {
background: var(--cw-panel) !important;
color: var(--cw-text) !important;
border: 1px solid var(--cw-line) !important;
border-radius: var(--cw-radius);
padding: 14px 18px;
}
.mw-message-box-warning {
border-left: 3px solid var(--cw-warning) !important;
}
.mw-message-box-error {
border-left: 3px solid var(--cw-danger) !important;
}
.mw-message-box-success {
border-left: 3px solid var(--cw-success) !important;
}
.mw-message-box-info {
border-left: 3px solid var(--cw-info) !important;
}
/* ---------- 48. TAGS / STATUS LABELS ---------- */
.mw-tag,
.mw-rcfilters-ui-chip,
.oo-ui-labelElement-label {
font-family: var(--cw-mono);
}
.mw-rcfilters-ui-chip {
background: var(--cw-panel) !important;
color: var(--cw-accent) !important;
border: 1px solid var(--cw-line) !important;
border-radius: 4px !important;
}
/* ---------- 49. ACCESSIBILITY ---------- */
:focus-visible {
outline: 2px solid var(--cw-accent) !important;
outline-offset: 3px;
}
a:focus-visible,
button:focus-visible {
border-radius: 3px;
}
/* ---------- 50. PRINT ---------- */
@media print {
body,
#content,
.mw-body {
background: white !important;
color: black !important;
box-shadow: none !important;
}
a,
a:visited {
color: black !important;
text-decoration: underline;
}
.vector-header-container,
#mw-panel,
#mw-navigation,
#footer,
.mw-editsection {
display: none !important;
}
.mw-body {
border: none !important;
padding: 0 !important;
}
}