MediaWiki:Common.css: Difference between revisions
From MiiWiki
Jump to navigationJump to search
mNo edit summary |
Trig Jegman (talk | contribs) mNo edit summary |
||
(52 intermediate revisions by 3 users not shown) | |||
Line 1: | Line 1: | ||
/* CSS placed here will be applied to all skins */ | /* CSS placed here will be applied to all skins */ | ||
@import url('https://fonts.googleapis.com/css2?family=Libre+Barcode+128&family=Ubuntu:wght@400;500;700&display=swap'); | |||
/* Colored usernames for staff members. */ | /* Colored usernames for staff members. */ | ||
/* Moderators */ | /* Moderators */ | ||
.mw-userlink[title="User: | .mw-userlink[title="User:Kirbo kirbstar"], | ||
#whomod a { color: #DA004E !important; } | #whomod a { color: #DA004E !important; } | ||
/* Administrators */ | /* Administrators */ | ||
.mw-userlink[title="User: | .mw-userlink[title="User:Trig Jegman"], | ||
.mw-userlink[title="User:PinkYoshiFan"], | |||
#whoadmin a { color: #843DA4 !important; } | #whoadmin a { color: #843DA4 !important; } | ||
Line 35: | Line 36: | ||
/* -- Green -- */ | /* -- Green -- */ | ||
table.wikitable.table-green { background: hsl(120,100%,95%) } | table.wikitable.table-green { background: hsl(120,100%,95%) } | ||
table.wikitable.table-green > * > tr > th { background: hsl(120,75%,80%) } | table.wikitable.table-green > * > tr > th { background-color: hsl(120,75%,80%) } | ||
table.wikitable.table-green > * > tr:nth-child(odd) > td { background: hsl(120,100%,90%) } | table.wikitable.table-green > * > tr:nth-child(odd) > td { background: hsl(120,100%,90%) } | ||
table.wikitable.table-green > * > tr > td, table.wikitable.table-green > * > tr > th { border-color: hsl(120,60%,40%) } | table.wikitable.table-green > * > tr > td, table.wikitable.table-green > * > tr > th { border-color: hsl(120,60%,40%) } | ||
Line 41: | Line 42: | ||
/* -- Red -- */ | /* -- Red -- */ | ||
table.wikitable.table-red { background: hsl(0,100%,95%) } | table.wikitable.table-red { background: hsl(0,100%,95%) } | ||
table.wikitable.table-red > * > tr > th { background: hsl(0,75%,80%) } | table.wikitable.table-red > * > tr > th { background-color: hsl(0,75%,80%) } | ||
table.wikitable.table-red > * > tr:nth-child(odd) > td { background: hsl(0,100%,90%) } | table.wikitable.table-red > * > tr:nth-child(odd) > td { background: hsl(0,100%,90%) } | ||
table.wikitable.table-red > * > tr > td, table.wikitable.table-red > * > tr > th { border-color: hsl(0,60%,40%) } | table.wikitable.table-red > * > tr > td, table.wikitable.table-red > * > tr > th { border-color: hsl(0,60%,40%) } | ||
Line 47: | Line 48: | ||
/* -- Yellow -- */ | /* -- Yellow -- */ | ||
table.wikitable.table-yellow { background: hsl(55,100%,95%) } | table.wikitable.table-yellow { background: hsl(55,100%,95%) } | ||
table.wikitable.table-yellow > * > tr > th { background: hsl(55,75%,80%) } | table.wikitable.table-yellow > * > tr > th { background-color: hsl(55,75%,80%) } | ||
table.wikitable.table-yellow > * > tr:nth-child(odd) > td { background: hsl(55,100%,90%) } | table.wikitable.table-yellow > * > tr:nth-child(odd) > td { background: hsl(55,100%,90%) } | ||
table.wikitable.table-yellow > * > tr > td, table.wikitable.table-yellow > * > tr > th { border-color: hsl(55,60%,40%) } | table.wikitable.table-yellow > * > tr > td, table.wikitable.table-yellow > * > tr > th { border-color: hsl(55,60%,40%) } | ||
Line 53: | Line 54: | ||
/* -- Purple -- */ | /* -- Purple -- */ | ||
table.wikitable.table-purple { background: hsl(290,100%,95%) } | table.wikitable.table-purple { background: hsl(290,100%,95%) } | ||
table.wikitable.table-purple > * > tr > th { background: hsl(290,75%,80%) } | table.wikitable.table-purple > * > tr > th { background-color: hsl(290,75%,80%) } | ||
table.wikitable.table-purple > * > tr:nth-child(odd) > td { background: hsl(290,100%,90%) } | table.wikitable.table-purple > * > tr:nth-child(odd) > td { background: hsl(290,100%,90%) } | ||
table.wikitable.table-purple > * > tr > td, table.wikitable.table-purple > * > tr > th { border-color: hsl(290,60%,40%) } | table.wikitable.table-purple > * > tr > td, table.wikitable.table-purple > * > tr > th { border-color: hsl(290,60%,40%) } | ||
Line 59: | Line 60: | ||
/* -- Pink -- */ | /* -- Pink -- */ | ||
table.wikitable.table-pink { background: hsl(320,100%,95%) } | table.wikitable.table-pink { background: hsl(320,100%,95%) } | ||
table.wikitable.table-pink > * > tr > th { background: hsl(320,75%,80%) } | table.wikitable.table-pink > * > tr > th { background-color: hsl(320,75%,80%) } | ||
table.wikitable.table-pink > * > tr:nth-child(odd) > td { background: hsl(320,100%,90%) } | table.wikitable.table-pink > * > tr:nth-child(odd) > td { background: hsl(320,100%,90%) } | ||
table.wikitable.table-pink > * > tr > td, table.wikitable.table-pink > * > tr > th { border-color: hsl(320,60%,40%) } | table.wikitable.table-pink > * > tr > td, table.wikitable.table-pink > * > tr > th { border-color: hsl(320,60%,40%) } | ||
/* -- White -- */ | |||
table.wikitable.table-white { background: hsl(0deg 0% 100%) } | |||
table.wikitable.table-white > * > tr > th { background-color: hsl(0deg 0% 91%) } | |||
table.wikitable.table-white > * > tr:nth-child(odd) > td { background: hsl(208deg 43% 92%) } | |||
table.wikitable.table-white > * > tr > td, table.wikitable.table-white > * > tr > th { border-color: hsl(0deg 0% 0%) } | |||
/* -- Gray/Black -- */ | |||
table.wikitable.table-gray { background: hsl(0deg 0% 57%); color: #fff; } | |||
table.wikitable.table-gray > * > tr > th { background-color: hsl(0deg 0% 0%) } | |||
table.wikitable.table-gray > * > tr:nth-child(odd) > td { background: hsl(0deg 0% 28%) } | |||
table.wikitable.table-gray > * > tr > td, table.wikitable.table-gray > * > tr > th { border-color: hsl(0deg 0% 0%) } | |||
/* Infobox-related */ | /* Infobox-related */ | ||
@media screen and (max-width: 835px) { | |||
.miiInfobox { | |||
float: unset!important; | |||
width: auto!important; | |||
margin: 0 0 .75rem!important; | |||
} | |||
} | |||
.infobox-image img { | .infobox-image img { | ||
max-width: 100%; | max-width: 100%; | ||
Line 72: | Line 93: | ||
@media screen and (max-width: 985px) { | @media screen and (max-width: 985px) { | ||
#mainPageGrid { | #mainPageGrid { | ||
grid-template-columns: repeat(1,1fr) | grid-template-columns: repeat(1,1fr)!important | ||
} | } | ||
#mainPagePanel div:first-of-type > div:first-of-type { | #mainPagePanel div:first-of-type > div:first-of-type { | ||
Line 78: | Line 99: | ||
line-height: 1; | line-height: 1; | ||
} | } | ||
} | |||
@media screen and (max-width: 525px) { | |||
#featuredArticle-responsive { | |||
flex-direction: column; | |||
} | |||
} | |||
/* Empty stuff */ | |||
#siteNotice:empty { | |||
display: none; | |||
} /* May not work on old browsers */ | |||
/* Module navboxes */ | |||
.module-navbox > span.mw-collapsible-toggle { | |||
font-weight: bold; | |||
transform: translate(-8px,3.15px) | |||
} | |||
.lua-navbox td, .lua-navbox th { | |||
padding: 5px; | |||
} | |||
.lua-navbox td { | |||
width: 100%; | |||
} | |||
.lua-navbox tr:nth-child(even) td { | |||
background: rgba(0,0,0,.1) | |||
} | |||
.lua-navbox tr:last-of-type th { | |||
border-radius: 0 0 0 12px; | |||
} | |||
.lua-navbox tr:last-of-type td { | |||
border-radius: 0 0 12px 0 | |||
} | |||
.lua-navbox ul { | |||
margin: 0; | |||
} | |||
.lua-navbox ul li { | |||
display: inline; | |||
} | |||
.lua-navbox ul li:not(:last-child):after { | |||
content: " • " | |||
} | |||
@media screen and (max-width: 925px) { | |||
.lua-navbox { | |||
width: 100%; | |||
text-align: center; | |||
} | |||
.lua-navbox th, .lua-navbox td { | |||
display: block; | |||
} | |||
.lua-navbox td { | |||
margin-top: 2px; | |||
} | |||
.lua-navbox tr:last-of-type th { | |||
border-radius: 0 | |||
} | |||
.lua-navbox tr:last-of-type td { | |||
border-radius: 0 0 12px 12px | |||
} | |||
} | |||
/* Userbox */ | |||
#userbox-container { | |||
max-width: 100%; | |||
} | |||
@media screen and (min-width: 550px) { | |||
#userbox-container { | |||
max-width: 40%; | |||
} | |||
} | |||
@media screen and (min-width: 850px) { | |||
#userbox-container { | |||
max-width: 30%; | |||
} | |||
} | |||
@media screen and (min-width: 1340px) { | |||
#userbox-container { | |||
max-width: 20%; | |||
} | |||
} | |||
.img-greyscale { | |||
filter: grayscale(100%); | |||
} | |||
/* hide potentially sensitive data on file pages */ | |||
#mw_metadata .exif-gpslatitude, | |||
#mw_metadata .exif-gpslongitude, | |||
#mw_metadata .exif-artist { | |||
display: none; | |||
} | |||
/* Hide license dropdown on [[Special:Upload]] */ | |||
p.mw-upload-editlicenses { | |||
display: none; | |||
} | |||
.mw-htmlform-field-Licenses { | |||
display: none; | |||
} | } |
Revision as of 07:19, 2 February 2024
/* CSS placed here will be applied to all skins */ @import url('https://fonts.googleapis.com/css2?family=Libre+Barcode+128&family=Ubuntu:wght@400;500;700&display=swap'); /* Colored usernames for staff members. */ /* Moderators */ .mw-userlink[title="User:Kirbo kirbstar"], #whomod a { color: #DA004E !important; } /* Administrators */ .mw-userlink[title="User:Trig Jegman"], .mw-userlink[title="User:PinkYoshiFan"], #whoadmin a { color: #843DA4 !important; } /* Bureaucrats */ .mw-userlink[title="User:Kirb"], #whocrat a { color: #42D1FF !important; } /* Wikitables */ table.wikitable { background: #E0FAFF; /* Fallback, don't remove */ background: hsl(190,100%,95%); margin: 1em 0; color: black; } table.wikitable > * > tr > td, table.wikitable > * > tr > th { border: 1px solid; padding: 0.2em 0.4em; } /* -- Blue -- */ table.wikitable > * > tr > th { background: hsl(190,75%,80%) } table.wikitable > * > tr:nth-child(odd) > td { background: hsl(190,75%,90%) } table.wikitable > * > tr > td, table.wikitable > * > tr > th { border-color: hsl(190,60%,40%) } /* -- Green -- */ table.wikitable.table-green { background: hsl(120,100%,95%) } table.wikitable.table-green > * > tr > th { background-color: hsl(120,75%,80%) } table.wikitable.table-green > * > tr:nth-child(odd) > td { background: hsl(120,100%,90%) } table.wikitable.table-green > * > tr > td, table.wikitable.table-green > * > tr > th { border-color: hsl(120,60%,40%) } /* -- Red -- */ table.wikitable.table-red { background: hsl(0,100%,95%) } table.wikitable.table-red > * > tr > th { background-color: hsl(0,75%,80%) } table.wikitable.table-red > * > tr:nth-child(odd) > td { background: hsl(0,100%,90%) } table.wikitable.table-red > * > tr > td, table.wikitable.table-red > * > tr > th { border-color: hsl(0,60%,40%) } /* -- Yellow -- */ table.wikitable.table-yellow { background: hsl(55,100%,95%) } table.wikitable.table-yellow > * > tr > th { background-color: hsl(55,75%,80%) } table.wikitable.table-yellow > * > tr:nth-child(odd) > td { background: hsl(55,100%,90%) } table.wikitable.table-yellow > * > tr > td, table.wikitable.table-yellow > * > tr > th { border-color: hsl(55,60%,40%) } /* -- Purple -- */ table.wikitable.table-purple { background: hsl(290,100%,95%) } table.wikitable.table-purple > * > tr > th { background-color: hsl(290,75%,80%) } table.wikitable.table-purple > * > tr:nth-child(odd) > td { background: hsl(290,100%,90%) } table.wikitable.table-purple > * > tr > td, table.wikitable.table-purple > * > tr > th { border-color: hsl(290,60%,40%) } /* -- Pink -- */ table.wikitable.table-pink { background: hsl(320,100%,95%) } table.wikitable.table-pink > * > tr > th { background-color: hsl(320,75%,80%) } table.wikitable.table-pink > * > tr:nth-child(odd) > td { background: hsl(320,100%,90%) } table.wikitable.table-pink > * > tr > td, table.wikitable.table-pink > * > tr > th { border-color: hsl(320,60%,40%) } /* -- White -- */ table.wikitable.table-white { background: hsl(0deg 0% 100%) } table.wikitable.table-white > * > tr > th { background-color: hsl(0deg 0% 91%) } table.wikitable.table-white > * > tr:nth-child(odd) > td { background: hsl(208deg 43% 92%) } table.wikitable.table-white > * > tr > td, table.wikitable.table-white > * > tr > th { border-color: hsl(0deg 0% 0%) } /* -- Gray/Black -- */ table.wikitable.table-gray { background: hsl(0deg 0% 57%); color: #fff; } table.wikitable.table-gray > * > tr > th { background-color: hsl(0deg 0% 0%) } table.wikitable.table-gray > * > tr:nth-child(odd) > td { background: hsl(0deg 0% 28%) } table.wikitable.table-gray > * > tr > td, table.wikitable.table-gray > * > tr > th { border-color: hsl(0deg 0% 0%) } /* Infobox-related */ @media screen and (max-width: 835px) { .miiInfobox { float: unset!important; width: auto!important; margin: 0 0 .75rem!important; } } .infobox-image img { max-width: 100%; height: auto } /* Main page */ @media screen and (max-width: 985px) { #mainPageGrid { grid-template-columns: repeat(1,1fr)!important } #mainPagePanel div:first-of-type > div:first-of-type { text-align: center; line-height: 1; } } @media screen and (max-width: 525px) { #featuredArticle-responsive { flex-direction: column; } } /* Empty stuff */ #siteNotice:empty { display: none; } /* May not work on old browsers */ /* Module navboxes */ .module-navbox > span.mw-collapsible-toggle { font-weight: bold; transform: translate(-8px,3.15px) } .lua-navbox td, .lua-navbox th { padding: 5px; } .lua-navbox td { width: 100%; } .lua-navbox tr:nth-child(even) td { background: rgba(0,0,0,.1) } .lua-navbox tr:last-of-type th { border-radius: 0 0 0 12px; } .lua-navbox tr:last-of-type td { border-radius: 0 0 12px 0 } .lua-navbox ul { margin: 0; } .lua-navbox ul li { display: inline; } .lua-navbox ul li:not(:last-child):after { content: " • " } @media screen and (max-width: 925px) { .lua-navbox { width: 100%; text-align: center; } .lua-navbox th, .lua-navbox td { display: block; } .lua-navbox td { margin-top: 2px; } .lua-navbox tr:last-of-type th { border-radius: 0 } .lua-navbox tr:last-of-type td { border-radius: 0 0 12px 12px } } /* Userbox */ #userbox-container { max-width: 100%; } @media screen and (min-width: 550px) { #userbox-container { max-width: 40%; } } @media screen and (min-width: 850px) { #userbox-container { max-width: 30%; } } @media screen and (min-width: 1340px) { #userbox-container { max-width: 20%; } } .img-greyscale { filter: grayscale(100%); } /* hide potentially sensitive data on file pages */ #mw_metadata .exif-gpslatitude, #mw_metadata .exif-gpslongitude, #mw_metadata .exif-artist { display: none; } /* Hide license dropdown on [[Special:Upload]] */ p.mw-upload-editlicenses { display: none; } .mw-htmlform-field-Licenses { display: none; }