ميدياويكي:Common.css
المظهر
ملاحظة: بعد الحفظ، قد يلزمك محو الاختزان الخاص بمتصفحك لرؤية التغييرات.
- فايرفوكس / سافاري: أمسك Shift أثناء ضغط Reload، أو اضغط على إما Ctrl-F5 أو Ctrl-R (⌘-R على ماك)
- جوجل كروم: اضغط Ctrl-Shift-R (⌘-Shift-R على ماك)
- إنترنت إكسبلورر/إيدج: أمسك Ctrl أثناء ضغط Refresh، أو اضغط Ctrl-F5
- أوبرا: اضغط Ctrl-F5.
/* === Faylasof — Astro design ported to MediaWiki Vector 2022 === */
@font-face { font-family:"Thmanyah Sans"; src:url("/_assets/fonts/thmanyah-sans-400.woff2") format("woff2"); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:"Thmanyah Sans"; src:url("/_assets/fonts/thmanyah-sans-500.woff2") format("woff2"); font-weight:500; font-style:normal; font-display:swap; }
@font-face { font-family:"Thmanyah Sans"; src:url("/_assets/fonts/thmanyah-sans-700.woff2") format("woff2"); font-weight:700; font-style:normal; font-display:swap; }
@font-face { font-family:"Thmanyah Display"; src:url("/_assets/fonts/thmanyah-display-700.woff2") format("woff2"); font-weight:700; font-style:normal; font-display:swap; }
@font-face { font-family:"Thmanyah Display"; src:url("/_assets/fonts/thmanyah-display-900.woff2") format("woff2"); font-weight:900; font-style:normal; font-display:swap; }
:root {
--paper:#f6f0e2; --paper-card:#fbf7ee; --paper-deep:#ece2cd; --paper-edge:#e3d8be;
--ink:#211c12; --ink-soft:#4b4435; --muted:#6e6553;
--emerald:#0c5b3c; --emerald-deep:#084027; --emerald-bright:#0a8f5e; --emerald-tint:#e6efe2;
--ink-deep:#0f1f18; --on-dark:#f3ecda; --on-dark-soft:#b7c2b3;
--gold:#b0892f; --gold-soft:#d6b873;
--font-display:"Thmanyah Display","Thmanyah Sans","SF Arabic","Noto Naskh Arabic",serif;
--font-body:"Thmanyah Sans","SF Arabic","Noto Sans Arabic","Geeza Pro",-apple-system,sans-serif;
}
html, body, .mw-body, .mw-page-container, .mw-page-container-inner, .vector-body, #content {
background: var(--paper) !important;
color: var(--ink) !important;
font-family: var(--font-body) !important;
}
/* Dark "bookend" header */
.mw-header, .vector-header-container, .vector-header {
background: var(--ink-deep) !important;
color: var(--on-dark) !important;
border-bottom: 1px solid var(--gold-soft) !important;
}
.mw-header *, .vector-header *, .vector-header-container * { color: var(--on-dark) !important; }
.mw-logo, .mw-logo-wordmark { color: var(--on-dark) !important; font-family: var(--font-display) !important; font-size: 24px !important; }
.mw-logo-icon, .mw-logo-icon img, img.mw-logo-icon { filter: brightness(1.1) !important; }
/* Headings */
.mw-body h1, .mw-body h2, .mw-body h3, .firstHeading, .mw-first-heading {
font-family: var(--font-display) !important;
color: var(--ink-deep) !important;
border-bottom: 1px solid var(--gold) !important;
padding-bottom: .25em !important;
}
.mw-body h1, .firstHeading, .mw-first-heading { font-size: 2.4em !important; font-weight: 900 !important; }
.mw-body h2 { font-size: 1.7em !important; font-weight: 700 !important; }
.mw-body h3 { font-size: 1.3em !important; }
/* Links */
.mw-body a, #content a, a.cdx-tabs__list__item__anchor {
color: var(--emerald) !important;
text-decoration: none !important;
background-image: linear-gradient(var(--gold), var(--gold)) !important;
background-size: 0% 1.5px !important;
background-position: 100% 100% !important;
background-repeat: no-repeat !important;
transition: background-size 240ms ease, color 160ms ease !important;
}
.mw-body a:hover, #content a:hover { background-size: 100% 1.5px !important; color: var(--emerald-deep) !important; }
.mw-body a.new, #content a.new { color: #a93226 !important; }
/* Search box */
#searchInput, .cdx-text-input__input {
background: var(--paper-card) !important;
border: 1px solid var(--gold-soft) !important;
color: var(--ink) !important;
border-radius: 6px !important;
font-family: var(--font-body) !important;
}
#searchInput:focus, .cdx-text-input__input:focus {
border-color: var(--emerald) !important;
outline: 2px solid var(--emerald-tint) !important;
}
/* Sidebars and TOC */
.mw-portlet, .mw-sidebar, #mw-panel, .vector-toc {
background: var(--paper-card) !important;
border: 1px solid var(--paper-edge) !important;
border-radius: 6px !important;
}
.mw-portlet-heading, .vector-toc-heading {
color: var(--emerald) !important;
font-family: var(--font-display) !important;
border-bottom: 1px solid var(--gold) !important;
}
/* Buttons */
.cdx-button, .mw-ui-button, button.oo-ui-buttonElement-button {
background: var(--emerald) !important;
color: var(--on-dark) !important;
border: 1px solid var(--emerald-deep) !important;
font-family: var(--font-body) !important;
border-radius: 6px !important;
}
.cdx-button:hover, .mw-ui-button:hover { background: var(--emerald-deep) !important; }
/* Footer */
.mw-footer, #footer, .vector-footer {
background: var(--ink-deep) !important;
color: var(--on-dark-soft) !important;
border-top: 1px solid var(--gold-soft) !important;
}
.mw-footer a, #footer a, .vector-footer a { color: var(--gold-soft) !important; }
/* Tables */
.mw-body table, table.wikitable {
background: var(--paper-card) !important;
border: 1px solid var(--paper-edge) !important;
}
.mw-body table th, table.wikitable th {
background: var(--emerald-tint) !important;
color: var(--ink-deep) !important;
border-color: var(--gold-soft) !important;
}
/* Code blocks */
.mw-body pre, .mw-body code {
background: var(--paper-deep) !important;
border: 1px solid var(--paper-edge) !important;
color: var(--ink) !important;
border-radius: 4px !important;
}
/* MediaWiki "no text" warning panel - soft */
.noarticletext, .mw-body .noarticletext {
background: var(--paper-card) !important;
border: 1px solid var(--gold-soft) !important;
border-radius: 6px !important;
padding: 18px !important;
}
/* Hide some legacy UI elements that look out of place */
.mw-indicators, #siteNotice { display: none !important; }