Anonymous user
MediaWiki:Common.css: Difference between revisions
m
oops
imported>Ttv pedro270707 m (Changed shadows too) |
imported>Ttv pedro270707 m (oops) |
||
(84 intermediate revisions by 2 users not shown) | |||
Line 1: | Line 1: | ||
html { | |||
--table-header-background: #eaecf0; | |||
--table-border: #a2a9b1; | |||
--table-background-color: #f8f9fa; | |||
--code-background-color: #f8f9fa; | |||
--code-border: #eaecf0; | |||
--default-text-color: #000000; | |||
--infobox-out-background: #c6c6c6; | |||
--tooltip-background: rgba(0,0,0,0.7529411765); | |||
} | |||
html.client-darkmode { | |||
--table-header-background: #444444; | |||
--table-background-color: #222226; | |||
--code-background-color: #000011; | |||
--code-border: #222222; | |||
--default-text-color: #dddddd; | |||
--infobox-out-background: #222226; | |||
} | |||
@font-face { | @font-face { | ||
font-family: 'Minecraft'; | font-family: 'Minecraft'; | ||
Line 15: | Line 35: | ||
font-style: normal; | font-style: normal; | ||
font-display: fallback; | font-display: fallback; | ||
} | |||
.vector-menu-portal .vector-menu-content li a:visited { | |||
color: #69bad9; | |||
} | |||
.vector-menu-portal .vector-menu-content li a { | |||
color: #aa69cf; | |||
} | } | ||
Line 24: | Line 52: | ||
background-image: none !important; | background-image: none !important; | ||
padding-right: 0 !important; | padding-right: 0 !important; | ||
} | |||
/* Collapsible table button restyle */ | |||
.mw-collapsible-toggle { | |||
margin-left: 0.8em; | |||
} | |||
.mw-collapsible-text::before { | |||
content: "hide"; | |||
display: inline; | |||
font-size: 14px; | |||
} | |||
.mw-collapsible-toggle-collapsed .mw-collapsible-text::before { | |||
content: 'show'; | |||
} | |||
.mw-collapsible-text { | |||
font-size: 0; | |||
} | |||
/* Module:Sprite p.doc() */ | |||
.spritedoc-ul { | |||
list-style-type: none; | |||
display: flex; | |||
align-items: stretch; | |||
flex-wrap: wrap; | |||
margin: 0 !important; | |||
padding: 0 !important; | |||
} | |||
.spritedoc-cell { | |||
display: flex; | |||
align-items: center; | |||
border: 1px solid var(--table-border); | |||
background-color: var(--table-background-color); | |||
padding: 5px; | |||
width: 14em; | |||
margin: 0 0 -1px -1px; | |||
} | |||
.spritedoc-image { | |||
margin-right: 5px; | |||
} | |||
.spritedoc-names { | |||
margin: 0 !important; | |||
} | |||
.spritedoc-name { | |||
display: block; | |||
} | } | ||
/* Adds "BTA WIKI" overlay on wiki icon */ | /* Adds "BTA WIKI" overlay on wiki icon */ | ||
.mw-wiki-logo::before { | /*.mw-wiki-logo::before { | ||
content: ''; | content: ''; | ||
width: 160px; | width: 160px; | ||
Line 37: | Line 116: | ||
position: absolute; | position: absolute; | ||
image-rendering: pixelated; | image-rendering: pixelated; | ||
} | }*/ | ||
#mw-page-base { | #mw-page-base { | ||
Line 67: | Line 146: | ||
.client-darkmode #content, .client-darkmode #content h1, .client-darkmode #content h2, .client-darkmode #content h3, .client-darkmode #content h4, .client-darkmode #content h5, .client-darkmode #content h6 { | .client-darkmode #content, .client-darkmode #content h1, .client-darkmode #content h2, .client-darkmode #content h3, .client-darkmode #content h4, .client-darkmode #content h5, .client-darkmode #content h6 { | ||
background-color: #111116; | background-color: #111116; | ||
color: | color: var(--default-text-color); | ||
} | } | ||
Line 83: | Line 162: | ||
} | } | ||
.catlinks { | |||
background-color: | background-color: var(--table-background-color); | ||
} | } | ||
/* ignore the errors, this code is perfectly valid and compatible with most modern browsers */ | /* ignore the errors, this code is perfectly valid and compatible with most modern browsers */ | ||
pre:not(.documentation pre), code:not(.documentation code), .mw-code:not(.documentation .mw-code), table code { | |||
background-color: var(--code-background-color); | |||
color: var(--default-text-color); | |||
border: 1px solid var(--code-border); | |||
} | } | ||
table, table.ambox-content, table.toccolours, .mw-notification, .mwe-popups, .infobox, .toc, .thumbinner, .wikitable, .cbnnr-main, .cx-callout, #simpleSearch, #searchInput, #centralNotice .cnotice { | |||
background-color: | background-color: var(--table-background-color) !important; | ||
} | } | ||
Line 100: | Line 181: | ||
} | } | ||
.wikitable > tr > th, .wikitable > * > tr > th { | |||
background-color: | background-color: var(--table-header-background); | ||
border: 1px solid var(--table-border); | |||
} | } | ||
Line 110: | Line 192: | ||
.client-darkmode .tocnumber { | .client-darkmode .tocnumber { | ||
color: #aaa; | color: #aaa; | ||
} | } | ||
Line 168: | Line 232: | ||
.infobox { | .infobox { | ||
padding: 8px; | padding: 8px; | ||
min-width: 200px; | |||
max-width: 300px; | |||
text-align: center; | |||
box-sizing: border-box; | |||
} | } | ||
Line 186: | Line 251: | ||
image-rendering: pixelated; | image-rendering: pixelated; | ||
image-rendering: crisp-edges; | image-rendering: crisp-edges; | ||
background-color: | background-color: var(--infobox-out-background) !important; | ||
} | } | ||
Line 196: | Line 261: | ||
border-left: 2px solid black; | border-left: 2px solid black; | ||
border-right: 2px solid black; | border-right: 2px solid black; | ||
background-color: #555555; | background-color: #555555 !important; | ||
} | } | ||
Line 203: | Line 268: | ||
width: 100%; | width: 100%; | ||
text-align: left; | text-align: left; | ||
background-color: transparent !important; | |||
} | } | ||
Line 266: | Line 332: | ||
/* Message boxes */ | /* Message boxes */ | ||
.msgbox { | .msgbox { | ||
width: | width: 70%; | ||
padding: 5px; | padding: 5px; | ||
box-sizing: border-box; | box-sizing: border-box; | ||
Line 580: | Line 646: | ||
} | } | ||
.c-n .c-1, .c-n .c-2, .c-n .c-3, .c-n .c-4, .c-n .c-5, .c-n .c-6, .c-n .c-7, .c-n .c-8, .c-n .c-9, .c-n .c-a, .c-n .c-b, .c-n .c-c, .c-n .c-d, .c-n .c-e, .c-n .c-f, .c-n .c-g, .c-n .c-h { | .c-n .c-0, .c-n .c-1, .c-n .c-2, .c-n .c-3, .c-n .c-4, .c-n .c-5, .c-n .c-6, .c-n .c-7, .c-n .c-8, .c-n .c-9, .c-n .c-a, .c-n .c-b, .c-n .c-c, .c-n .c-d, .c-n .c-e, .c-n .c-f, .c-n .c-g, .c-n .c-h { | ||
text-decoration: underline 0.125em; | text-decoration: underline 0.125em; | ||
} | } | ||
.c-1, .c-2, .c-3, .c-4, .c-5, .c-6, .c-7, .c-8, .c-9, .c-a, .c-b, .c-c, .c-d, .c-e, .c-f, .c-g, .c-h { | .c-0, .c-1, .c-2, .c-3, .c-4, .c-5, .c-6, .c-7, .c-8, .c-9, .c-a, .c-b, .c-c, .c-d, .c-e, .c-f, .c-g, .c-h { | ||
position: relative; | position: relative; | ||
font-family: Minecraft; | font-family: Minecraft; | ||
font-size: 16px; | font-size: 16px; | ||
word-spacing: 0. | word-spacing: 0.375em; | ||
} | } | ||
Line 596: | Line 662: | ||
border: 0.125em solid transparent; | border: 0.125em solid transparent; | ||
background-color: #000000; | background-color: #000000; | ||
background-color: | background-color: var(--tooltip-background); | ||
font-family: Minecraft,"WenQuanYi Bitmap Song",SimSun,Unifont,NISC18030,Beijing,Courier,sans-serif; | font-family: Minecraft,"WenQuanYi Bitmap Song",SimSun,Unifont,NISC18030,Beijing,Courier,sans-serif; | ||
word-spacing: 0. | word-spacing: 0.375em; | ||
margin: 0.125em 0.125em; | margin: 0.125em 0.125em; | ||
padding: 0 0. | padding: 0 0.25em 0.375em 0.25em; | ||
line-height: 1.125em; | line-height: 1.125em; | ||
white-space: nowrap; | white-space: nowrap; | ||
Line 633: | Line 699: | ||
.shadow-line { | .shadow-line { | ||
z-index: -1; | z-index: -1; | ||
} | } | ||
Line 660: | Line 723: | ||
display: inline-block; | display: inline-block; | ||
top: 0.125em; | top: 0.125em; | ||
left: 0. | left: 0.375em; | ||
} | } | ||
Line 702: | Line 765: | ||
100% { | 100% { | ||
transform: translate(-50%, -50%) scale(1.1) rotateZ(-20deg); | transform: translate(-50%, -50%) scale(1.1) rotateZ(-20deg); | ||
} | |||
} | |||
/* Main page */ | |||
.page-Main_Page .firstHeading { | |||
display: none; | |||
} | |||
.main-page-logo { | |||
background-color: rgb(30,100,200); | |||
background-color: rgba(80,150,255,0.4); | |||
border: 1px solid rgb(100,100,160); | |||
padding: 40px 15px; | |||
display: flex; | |||
align-items: center; | |||
flex-direction: column; | |||
flex-wrap: wrap; | |||
gap: 15px; | |||
background-image: url(https://static.miraheze.org/btawiki/f/f5/BetterTownscreenshot1.png); | |||
background-attachment: fixed; | |||
background-size: 100vw; | |||
background-size: 100svw; | |||
} | |||
.main-page-block { | |||
position: relative; | |||
border: 1px solid var(--table-border); | |||
padding: 5px; | |||
padding-top: 40px; | |||
} | |||
.main-page-blocks { | |||
display: grid; | |||
grid-template-columns: repeat(3, 1fr); | |||
grid-template-rows: repeat(3, 1fr); | |||
gap: 10px; | |||
grid-template-areas: 'a a d' | |||
'b b d' | |||
'c c e'; | |||
} | |||
.main-page-block-title { | |||
position: absolute; | |||
top: 0; | |||
left: 0; | |||
width: 100%; | |||
height: 30px; | |||
background-image: linear-gradient(rgb(0 0 0 / 0.6), rgb(0 0 0 / 0.6)), url(https://static.miraheze.org/btawiki/f/f5/BetterTownscreenshot1.png); | |||
background-attachment: fixed; | |||
image-rendering: pixelated; | |||
box-shadow: rgb(0 0 0 / 10%) 0 0.25em; | |||
display: flex; | |||
align-items: center; | |||
padding-left: 10px; | |||
box-sizing: border-box; | |||
background-size: 100vw; | |||
background-size: 100svw; | |||
} | |||
@media only screen and (max-width: 900px) { | |||
.main-page-blocks { | |||
grid-template-rows: repeat(3, 1fr); | |||
grid-template-areas: 'a a a' | |||
'b b b' | |||
'c c c' | |||
'd d d' | |||
'e e e'; | |||
} | } | ||
} | } |