MediaWiki:Common.css: Difference between revisions
No edit summary |
No edit summary |
||
| (84 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
/* | /* Version 36.1 - Restored Anisa Factory Proportions | ||
KH | Goal: Original Anisa layout + KH Colors/Fonts + Readable Tabs | ||
*/ | |||
/ | @import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@700&family=Crimson+Pro:wght@400;700&display=swap'); | ||
/* --- 1. GLOBAL FONTS --- */ | |||
body { | |||
font-family: 'Crimson Pro', serif !important; | |||
font-family: | |||
} | } | ||
/* 2. | /* --- 2. ANISA (DESKTOP) RESTORATION --- */ | ||
/* We remove the forced margins/paddings here to let Anisa look "Factory" */ | |||
.skin-anisa #content, | |||
.skin-anisa .mw-body { | |||
font-size: 16px !important; | font-size: 16px !important; | ||
line-height: 1.6; | |||
/* We are NOT forcing margin-top or padding here anymore */ | |||
margin | |||
} | } | ||
/* | /* Scaling up the tiny Navigation Labels to a readable "Normal" size */ | ||
. | .skin-anisa .vector-menu-tabs li a, | ||
.skin-anisa .vector-menu-dropdown .vector-menu-heading-label, | |||
.skin-anisa #p-cactions .vector-menu-heading-label, | |||
.skin-anisa .vector-menu-tabs li a span { | |||
font-size: 16px !important; /* Readable, but fits the skin's design */ | |||
font-size: | font-weight: 400 !important; | ||
text-transform: none !important; | |||
text-transform: | |||
} | } | ||
/* | /* Restoring the natural spacing between "Read", "Edit", etc. */ | ||
.skin-anisa .vector-menu-tabs li { | |||
margin-right: 5px !important; | |||
} | } | ||
/* | /* --- 3. COSMOS (MOBILE) PRESERVATION --- */ | ||
/* This section ensures our mobile view doesn't change */ | |||
.skin-cosmos #content { | |||
font- | padding: 15px !important; | ||
font-size: 15px !important; | |||
} | } | ||
/* --- 4. THE SEAMLESS INFOBOX (THE "LORE" FIX) --- */ | |||
color: # | /* This keeps your Kingdom Hearts style intact across BOTH skins */ | ||
.portable-infobox { | |||
background-color: #fff !important; | |||
border: 1px solid #a2a9b1 !important; | |||
width: 270px !important; | |||
float: right !important; | |||
margin: 0 0 1em 1.2em !important; | |||
border-collapse: collapse !important; | |||
border-spacing: 0 !important; | |||
} | } | ||
.portable-infobox .pi-title { | |||
.portable-infobox .pi- | background-color: #ffd700 !important; | ||
background-color: # | color: #000 !important; | ||
padding: 15px !important; | font-family: 'Cinzel', serif !important; | ||
padding: 15px 10px !important; | |||
font-size: 1.25em !important; | |||
text-align: center !important; | text-align: center !important; | ||
border-bottom: 1px solid #a2a9b1 !important; | |||
} | } | ||
.portable-infobox .pi- | .portable-infobox .pi-header { | ||
background-color: #3e5a47 !important; | |||
color: #fff !important; | |||
font-family: 'Cinzel', serif !important; | |||
padding: 10px 5px !important; | |||
text-align: center !important; | |||
} | } | ||
.pi-data-label { | |||
background-color: #f2f2f2 !important; | |||
padding: 8px !important; | |||
border | border: 1px solid #a2a9b1 !important; | ||
font-weight: bold !important; | |||
} | } | ||
.pi-data-value { | |||
padding: 8px !important; | |||
padding: | border-bottom: 1px solid #a2a9b1 !important; | ||
border- | |||
} | } | ||
/* --- 5. TABLE OF CONTENTS --- */ | |||
/* | |||
. | |||
#toc, .toc { | #toc, .toc { | ||
border: | background-color: #f8f9fa !important; | ||
border: 1px solid #a2a9b1 !important; | |||
padding: 8px !important; | |||
} | } | ||
/* Styling TabberNeue inside PortableInfobox */ | |||
.pi-image .tabber__tabs { | |||
display: flex !important; | |||
/* | justify-content: center !important; | ||
. | background: #f2f2f2 !important; /* Matches your label color */ | ||
border-bottom: 1px solid #a2a9b1 !important; | |||
margin-bottom: 5px !important; | |||
display: | |||
border- | |||
} | } | ||
.pi-image .tabber__tab { | |||
font-family: 'Crimson Pro', serif !important; | |||
font-size: 14px !important; | |||
padding: 5px 10px !important; | |||
cursor: pointer !important; | |||
} | } | ||
.pi-image .tabber__tab--active { | |||
background-color: var(--kh-green) !important; | |||
color: white !important; | |||
font-weight: bold !important; | |||
background- | |||
} | } | ||