MediaWiki:Common.css: Difference between revisions
No edit summary |
No edit summary |
||
| (143 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
/* | /* Version 36.1 - Restored Anisa Factory Proportions | ||
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; | |||
body | |||
} | } | ||
/* 2. Anisa | /* --- 2. ANISA (DESKTOP) RESTORATION --- */ | ||
/* We remove the forced margins/paddings here to let Anisa look "Factory" */ | |||
.skin-anisa #content, | |||
.skin-anisa .mw-body { | |||
body | font-size: 16px !important; | ||
line-height: 1.6; | |||
/* We are NOT forcing margin-top or padding here anymore */ | |||
} | } | ||
/* | /* 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-weight: 400 !important; | |||
text-transform: none !important; | |||
} | } | ||
/* 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 { | |||
padding: 15px !important; | |||
font-size: 15px !important; | |||
} | } | ||
/* | /* --- 4. THE SEAMLESS INFOBOX (THE "LORE" FIX) --- */ | ||
/* This keeps your Kingdom Hearts style intact across BOTH skins */ | |||
.portable-infobox { | |||
background-color: #fff !important; | |||
/* | border: 1px solid #a2a9b1 !important; | ||
width: 270px !important; | |||
background-color: # | |||
border: | |||
width: | |||
float: right !important; | float: right !important; | ||
margin: 0 0 1em 1.2em !important; | |||
margin: 0 0 1em | border-collapse: collapse !important; | ||
border-spacing: 0 !important; | |||
} | } | ||
.portable-infobox .pi-title { | |||
background-color: #ffd700 !important; | |||
background-color: # | color: #000 !important; | ||
font-family: 'Cinzel', serif !important; | |||
padding: 15px 10px !important; | |||
font-size: 1.25em !important; | |||
text-align: center !important; | |||
border-bottom: 1px solid #a2a9b1 !important; | |||
} | } | ||
.portable-infobox .pi-header { | |||
background-color: #3e5a47 !important; | |||
background-color: # | color: #fff !important; | ||
color: # | font-family: 'Cinzel', serif !important; | ||
font- | padding: 10px 5px !important; | ||
text-align: center !important; | text-align: center !important; | ||
} | } | ||
.pi-data-label { | |||
background-color: # | background-color: #f2f2f2 !important; | ||
padding: 8px !important; | |||
border: 1px solid #a2a9b1 !important; | |||
font-weight: bold !important; | |||
} | } | ||
.pi-data-value { | |||
padding: 8px !important; | |||
border-bottom: 1px solid #a2a9b1 !important; | |||
padding: 8px | |||
border- | |||
} | } | ||
/* | /* --- 5. TABLE OF CONTENTS --- */ | ||
#toc, .toc { | |||
background-color: #f8f9fa !important; | |||
background-color: #f8f9fa !important; | border: 1px solid #a2a9b1 !important; | ||
padding: 8px !important; | |||
padding: | |||
} | } | ||
/* Styling TabberNeue inside PortableInfobox */ | |||
background- | .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; | |||
} | } | ||
.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; | |||
background-color: | color: white !important; | ||
color: | |||
font-weight: bold !important; | font-weight: bold !important; | ||
} | } | ||