MediaWiki:Common.css: Difference between revisions
MediaWiki interface page
More actions
No edit summary |
No edit summary |
||
| (47 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
/* CSS placed here will be applied to all skins */ | /* CSS placed here will be applied to all skins */ | ||
/* Hide | |||
#p- | /* ============================= */ | ||
display: none; | /* HIDE TOOLBOX */ | ||
/* ============================= */ | |||
#p-tb { | |||
display: none; | |||
} | |||
/* Hide Page / Discussion tabs */ | |||
#p-namespaces { | |||
display: none !important; | |||
} | |||
/* Hide Powered by MediaWiki footer icon */ | |||
#footer-poweredbyico { | |||
display: none !important; | |||
} | } | ||
| Line 10: | Line 24: | ||
display: none; | display: none; | ||
} | } | ||
/* ============================= */ | /* ============================= */ | ||
/* TREEVERSE | /* TREEVERSE CINEMATIC BACKGROUND */ | ||
/* ============================= */ | /* ============================= */ | ||
html, body { | html, body { | ||
height: 100%; | height: 100%; | ||
margin: 0; | margin: 0; | ||
} | } | ||
body { | |||
background-image: url("https://treeverse.wiki/images/b/be/45.57.jpg"); | |||
background-image: url("https://treeverse.wiki/images/ | |||
background-size: cover; | background-size: cover; | ||
background-position: center center; | background-position: center center; | ||
| Line 31: | Line 43: | ||
} | } | ||
/* | body::before { | ||
content: ""; | |||
position: fixed; | |||
inset: 0; | |||
background: rgba(0,0,0,0.25); | |||
z-index: -1; | |||
} | |||
/* ============================= */ | |||
/* REMOVE DEFAULT BACKGROUNDS */ | |||
/* ============================= */ | |||
.citizen-page-container, | |||
.citizen-page-container-inner, | |||
.citizen-body, | |||
.citizen-content, | |||
.mw-body, | |||
#mw-page-base, | #mw-page-base, | ||
#mw-head-base { | #mw-head-base, | ||
#content { | |||
background: transparent !important; | background: transparent !important; | ||
} | } | ||
/* | |||
. | /* ============================= */ | ||
. | /* MAIN CONTENT PANEL */ | ||
/* ============================= */ | |||
#content { | |||
max-width: 1200px; | |||
margin: 50px auto; | |||
} | |||
#bodyContent { | |||
background: rgba(255,255,255,0.84); | |||
backdrop-filter: blur(8px); | |||
-webkit-backdrop-filter: blur(8px); | |||
padding: 32px; | |||
border-radius: 12px; | |||
box-shadow: 0 20px 60px rgba(0,0,0,0.35); | |||
} | |||
/* ============================= */ | |||
/* RIGHT PANEL READABILITY FIX */ | |||
/* ============================= */ | |||
.citizen-page-info, | |||
.citizen-page-info *, | |||
.citizen-toc, | |||
.citizen-toc * { | |||
color: #ffffff !important; | |||
} | |||
.citizen-page-info, | |||
.citizen-toc { | |||
text-shadow: 0 1px 3px rgba(0,0,0,0.8); | |||
} | } | ||
/* ============================= */ | /* ============================= */ | ||
/* | /* GLOBAL LINK UNDERLINES */ | ||
/* ============================= */ | /* ============================= */ | ||
| Line 52: | Line 112: | ||
a:active { | a:active { | ||
text-decoration: underline !important; | text-decoration: underline !important; | ||
} | |||
/* ============================= */ | |||
/* SIDEBAR LINK STYLING */ | |||
/* ============================= */ | |||
.citizen-sidebar a { | |||
text-decoration: none !important; | |||
} | |||
.citizen-sidebar a:hover { | |||
text-decoration: none !important; | |||
} | |||
/* ============================= */ | |||
/* SWORD BULLETS */ | |||
/* ============================= */ | |||
#bodyContent ul { | |||
list-style: none; | |||
padding-left: 0; | |||
} | |||
#bodyContent ul li { | |||
position: relative; | |||
padding-left: 26px; | |||
} | |||
#bodyContent ul li::before { | |||
content: "⚔"; | |||
position: absolute; | |||
left: 0; | |||
top: -4px; | |||
font-size: 20px; | |||
color: #0b1f3a; | |||
} | } | ||
| Line 70: | Line 167: | ||
width: clamp(140px, 28vw, 200px); | width: clamp(140px, 28vw, 200px); | ||
height: auto; | height: auto; | ||
} | } | ||
| Line 107: | Line 203: | ||
display: block; | display: block; | ||
padding: 6px 8px; | padding: 6px 8px; | ||
text-decoration: none; | text-decoration: none; | ||
border: 1px solid #eee; | border: 1px solid #eee; | ||
| Line 121: | Line 216: | ||
padding: 12px; | padding: 12px; | ||
border: 1px solid #e5e5e5; | border: 1px solid #e5e5e5; | ||
background: #fff; | background: #fff; | ||
} | } | ||
| Line 140: | Line 234: | ||
/* ============================= */ | /* ============================= */ | ||
#leaderboardTable | #leaderboardTable th, | ||
#leaderboardTable | #leaderboardTable td { | ||
vertical-align: middle !important; | vertical-align: middle !important; | ||
} | |||
/* ============================= */ | |||
/* TOP NAV TEXT */ | |||
/* ============================= */ | |||
.citizen-header a { | |||
color: #ffffff !important; | |||
text-decoration: none !important; | |||
} | |||
.citizen-header a:hover { | |||
color: #e6f0ff !important; | |||
} | |||
/* ============================= */ | |||
/* NPC INFOBOX (STACKED LAYOUT) */ | |||
/* ============================= */ | |||
.infobox { | |||
float: none !important; | |||
clear: both; | |||
margin: 0 auto 30px auto; | |||
width: 460px; | |||
max-width: 95%; | |||
border-collapse: collapse; | |||
font-size: 90%; | |||
background: #0f141d; | |||
color: #ffffff; | |||
border-radius: 12px; | |||
overflow: hidden; | |||
box-shadow: 0 12px 35px rgba(0,0,0,0.45); | |||
} | |||
.infobox th, | |||
.infobox td { | |||
padding: 10px 12px; | |||
border-top: 1px solid rgba(255,255,255,0.08); | |||
} | |||
.infobox th { | |||
width: 40%; | |||
font-weight: 600; | |||
color: #8fa6d8; | |||
} | |||
.infobox-title { | |||
background: #1a2233; | |||
color: #ffffff !important; | |||
font-size: 130%; | |||
text-align: center !important; | |||
padding: 14px; | |||
} | |||
.infobox-image { | |||
text-align: center !important; | |||
padding: 16px; | |||
} | |||
.infobox-image img { | |||
width: 100%; | |||
max-width: 560px; | |||
height: auto; | |||
border-radius: 8px; | |||
} | |||
/* ============================= */ | |||
/* EDIT MODE READABILITY FIX */ | |||
/* ============================= */ | |||
body.action-edit #content, | |||
body.action-submit #content { | |||
background: #ffffff !important; | |||
} | |||
body.action-edit, | |||
body.action-submit { | |||
color: #000000 !important; | |||
} | |||
body.action-edit textarea, | |||
body.action-submit textarea { | |||
background: #ffffff !important; | |||
color: #000000 !important; | |||
} | |||
body.action-edit .mw-warning, | |||
body.action-submit .mw-warning { | |||
color: #000000 !important; | |||
} | |||
body.action-edit a, | |||
body.action-submit a { | |||
color: #0645ad !important; | |||
} | |||
/* ============================= */ | |||
/* NPC CARD GRID */ | |||
/* ============================= */ | |||
.npc-card { | |||
background:#0f141d; | |||
padding:16px; | |||
border-radius:10px; | |||
text-align:center; | |||
font-weight:600; | |||
box-shadow:0 8px 20px rgba(0,0,0,.4); | |||
} | |||
/* ============================= */ | |||
/* MOBILE MENU TEXT FIX */ | |||
/* ============================= */ | |||
.citizen-drawer a, | |||
.citizen-drawer .citizen-sidebar__item, | |||
.citizen-drawer .citizen-sidebar__item a { | |||
color: #000000 !important; | |||
} | |||
.citizen-drawer h2, | |||
.citizen-drawer h3 { | |||
color: #1a2233 !important; | |||
} | |||
/* ============================= */ | |||
/* CITIZEN SIDEBAR TEXT FIX */ | |||
/* ============================= */ | |||
.citizen-sidebar__label { | |||
color: #ffffff !important; | |||
} | |||
.citizen-sidebar__heading { | |||
color: #ffffff !important; | |||
} | |||
.citizen-sidebar__link:hover .citizen-sidebar__label { | |||
color: #cfe2ff !important; | |||
} | |||
.citizen-sidebar { | |||
text-shadow: 0 1px 3px rgba(0,0,0,0.8); | |||
} | |||
/* Make sidebar navigation links always white */ | |||
.citizen-drawer .citizen-menu__item > a, | |||
.citizen-drawer .citizen-menu__heading { | |||
color: #ffffff !important; | |||
} | |||
.citizen-drawer a { | |||
color: #ffffff !important; | |||
} | |||
body, html { | |||
cursor: url('/treeverse.cur'), auto !important; | |||
} | |||
a { | |||
cursor: url('/firetree.cur'), pointer !important; | |||
} | } | ||