MediaWiki:Common.css: Difference between revisions

Latest revision as of 01:47, 2 May 2024

/* CSS placed here will be applied to all skins */

 .wkfelt { background-color:#4DFD4D; background-image:url(https://cdn.wikirby.com/3/39/KEY_Fabric_Lime_Felt.png); }

 .wkyellow { background-color:#FAF191; background-image:url(https://cdn.wikirby.com/9/9d/BackYellow.png); }

 .wkblue { background-color:#DFEAFE; background-image:url(https://cdn.wikirby.com/e/eb/BackBlue.png); }

 .wkred { background-color:#E47575; background-image:url(https://cdn.wikirby.com/1/1b/KSS_Megaton_Punch_Background.png); }

 .wkcork { background-color:#FAF191; background-image:url(https://cdn.wikirby.com/5/5a/BackCork.png); }

 .wksky { background-color:#DFEAFE; background-image:url(https://cdn.wikirby.com/b/ba/BackSky.png); }

 .wkpuzzle { background-color:#FF9F9F; background-image:url(https://cdn.wikirby.com/0/06/BackPuzzle.png); }

 .wkblock { background-color:#DFCFAF; background-image:url(https://cdn.wikirby.com/e/e4/KEY_Fabric_Colored_Blocks.png); }

 .wksnow { background-color:#8FDFFF; background-image:url(https://cdn.wikirby.com/0/0c/BackBluedot.png); }

 .wkquilt { background-color:#DFDFDF; background-image:url(https://cdn.wikirby.com/8/8e/KEY_Fabric_Aqua_Quilted.png); }

/* Keeby fabrics */

 .wkkeebycotton { background-color:#FFFA66; background-image:url(https://cdn.wikirby.com/2/25/KEY_Fabric_Yellow_Cotton.png); }

 .wkkeebyfelt { background-color:#FFFA66; background-image:url(https://cdn.wikirby.com/9/94/KEY_Fabric_Yellow_Felt.png); }

 .wkkeebystriped { background-color:#FFFA66; background-image:url(https://cdn.wikirby.com/f/fa/KEY_Fabric_Yellow_Striped.png); }

 .wkkeebylemonade { background-color:#FFFA66; background-image:url(https://cdn.wikirby.com/2/24/KEY_Fabric_Lemonade.png); }

 .wkkeebydot { background-color:#FFFA66; background-image:url(https://cdn.wikirby.com/3/32/KEY_Fabric_Yellow_Dot.png); }

 .wkkeebystar { background-color:#FFFA66; background-image:url(https://cdn.wikirby.com/0/0d/KEY_Fabric_Gold_Star.png); }

/* Colored usernames for staff members. */
/* Patrollers */
.mw-userlink[title="User:AdieuLain"],
.mw-userlink[title="User:EleCyon"],
.mw-userlink[title="User:Iliekchez"],
.mw-userlink[title="User:Luigi1234"],
.mw-userlink[title="User:Pandakekok9"],
.mw-userlink[title="User:ShadowKirby"],
.mw-userlink[title="User:Typman"],
.mw-userlink[title="User:WillIdleAway"],
#whopatrol a { color: #B500F1 !important; }

/* Moderators */
.mw-userlink[title="User:Basic Person"],
.mw-userlink[title="User:Kirb"],
.mw-userlink[title="User:Superbound"],
.mw-userlink[title="User:Zolerian"],
#whomod a { color: #ED7014 !important; }

/* Administrators */
.mw-userlink[title="User:DeepFriedCabbage"],
.mw-userlink[title="User:FalcoLau"],
.mw-userlink[title="User:Jellytost♡"],
.mw-userlink[title="User:Owencrazyboy17"],
.mw-userlink[title="User:StarPunch"],
#whoadmin a { color: #30C5A4 !important; }

/* Bureaucrats */
.mw-userlink[title="User:Gigi"],
.mw-userlink[title="User:Pinkyoshifan"],
.mw-userlink[title="User:Samwell"],
.mw-userlink[title="User:Vellidragon"],
.mw-userlink[title="User:YoshiFlutterJump"],
#whocrat a { color: #CA408A !important; }

/* Pink wikitable styling */
table.wikitable {
    background: #fff;
    margin: 1em 0;
    border: 1pt solid #000;
    border-collapse: collapse;
    color: black
}

table.wikitable > * > tr > td, table.wikitable > * > tr > th {
    border: 1pt solid #A92C3C;
    padding: 0.2em 0.4em;
}

table.wikitable > * > tr > th {
    background: #F59C98;
}

table.wikitable > * > tr:nth-child(odd) > td {
    background: #FACCC7;
}

table.wikitable > * > tr:nth-child(even) > td {
    background:#FFD8D2;
}

table.roundtable tr:last-of-type td:first-of-type {
	border-radius: 0 0 0 10px;
}

table.roundtable tr:last-of-type td:last-of-type {
	border-radius: 0 0 10px 0;
}

table.sticky tr:first-of-type th{
	position:sticky;
	top:0;
	z-index:2
}

table.sticky-2 tr:nth-of-type(2) th{
	position:sticky;
	top:0;
	z-index:2
}

/* File history table workaround */
.filehistory tr td:last-of-type {
    word-break: break-word;
}

/* text sizes */
.large {
  font-size: 16px;
}

.xlarge {
  font-size: 20px;
}

/* text alignment */
.top-right { 
	position: absolute;
	top: -26px;
	right: 10px;
}
.top-right-text { 
	position: absolute;
	top: -17px;
	right: 10px;
}
.help-shift { 
	top: -20px;
	right: 60px;
}


/* border */
fieldset {
    border: 1px solid #a92c3c;
}

div.mw-warning-with-logexcerpt {
    border: 2px solid #A92C3C;
}

/* main page */
body.page-Kirby_Wiki.action-view h1.firstHeading,
body.page-Kirby_Wiki.action-view #siteSub,
body.page-Kirby_Wiki.action-view #catlinks,
body.page-Kirby_Wiki.action-view #lastmod,
body.page-Kirby_Wiki.action-view .mw-revision { 
    display: none;
}
body.page-Kirby_Wiki.action-view #bodyContent {
    margin-top: 16px;
}
body.page-Kirby_Wiki.action-view .usermessage {
    margin-top: 43px;
}
body.page-Kirby_Wiki.action-view #bodyContent {
    margin-top: -20px;
}
body.page-Kirby_Wiki.action-view #siteNotice {
    margin-bottom: 28px;
}
#mw-indicator-mw-helplink {
    display: none;
}

@media (max-width: 1010px) {
    .onlydesktop {
        display:none;
    }
}

@media (min-width: 1011px) {
    .onlymobile {
        display:none;
    }
}

.editOptions {
    background-color: #ECF6FF;
    border: 1px solid #A7BEEA;
    border-top: none;
}

/* Delfino font */
@font-face {
  font-family: "Delfino";
  src: url("https://wikirby.com/fonts/delfino-webfont.woff2") format("woff2"),
       url("https://wikirby.com/fonts/delfino-webfont.woff") format("woff");
}

/* Module navboxes test */
.module-navbox > span.mw-collapsible-toggle {
    font-weight: bold;
    transform: translate(-8px,3.15px)
}

.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
    }
}

/* Responsive flex (based on Bootstrap) */
.row {
  --bs-gutter-x: .25rem;
  --bs-gutter-y: 0;
  display: flex;
  flex-wrap: wrap;
  margin-top: calc(var(--bs-gutter-y) * -1);
  margin-right: calc(var(--bs-gutter-x) / -2);
  margin-left: calc(var(--bs-gutter-x) / -2);
}
.row > * {
  box-sizing: border-box;
  flex-shrink: 0;
  width: 100%;
  max-width: 100%;
  margin-top: var(--bs-gutter-y);
}

.col {
  flex: 1 0 0%;
}

	/* -- Columns without any size reference -- */
	.col-sm { flex: 1 0 0%; }
	.col-1 { flex: 0 0 auto; width: 8.3333333333%; }
	.col-2 { flex: 0 0 auto; width: 16.6666666667%; }
	.col-3 { flex: 0 0 auto; width: 25%; }
	.col-4 { flex: 0 0 auto; width: 33.3333333333%; }
	.col-5 { flex: 0 0 auto; width: 41.6666666667%; }
	.col-6 { flex: 0 0 auto; width: 50%; }
	.col-7 { flex: 0 0 auto; width: 58.3333333333%; }
	.col-8 { flex: 0 0 auto; width: 66.6666666667%; }
	.col-9 { flex: 0 0 auto; width: 75%; }
	.col-10 { flex: 0 0 auto; width: 83.3333333333%; }
	.col-11 { flex: 0 0 auto; width: 91.6666666667%; }
	.col-12 { flex: 0 0 auto; width: 100%; }
	
	  /* ---- Displays ---- */
	  .d-block { display: block!important; }
	  .d-inline { display: inline!important; }
	  .d-inline-block { display: inline-block!important; }
	  .d-flex { display: flex!important; }
	  .d-grid { display: grid!important; }
	  .d-none { display: none!important; }

/* -- Columns for small sizes -- */
  .col-sm { flex: 1 0 0%; }
  .col-sm-1 { flex: 0 0 auto; width: 8.3333333333%; }
  .col-sm-2 { flex: 0 0 auto; width: 16.6666666667%; }
  .col-sm-3 { flex: 0 0 auto; width: 25%; }
  .col-sm-4 { flex: 0 0 auto; width: 33.3333333333%; }
  .col-sm-5 { flex: 0 0 auto; width: 41.6666666667%; }
  .col-sm-6 { flex: 0 0 auto; width: 50%; }
  .col-sm-7 { flex: 0 0 auto; width: 58.3333333333%; }
  .col-sm-8 { flex: 0 0 auto; width: 66.6666666667%; }
  .col-sm-9 { flex: 0 0 auto; width: 75%; }
  .col-sm-10 { flex: 0 0 auto; width: 83.3333333333%; }
  .col-sm-11 { flex: 0 0 auto; width: 91.6666666667%; }
  .col-sm-12 { flex: 0 0 auto; width: 100%; }
  
  /* ---- Floats ---- */
  .float-sm-left { float: left!important; }
  .float-sm-right { float: right!important; }
  .float-sm-none { float: none!important; }
  
  /* ---- Displays ---- */
  .d-sm-block { display: block!important; }
  .d-sm-inline { display: inline!important; }
  .d-sm-inline-block { display: inline-block!important; }
  .d-sm-flex { display: flex!important; }
  .d-sm-grid { display: grid!important; }
  .d-sm-none { display: none!important; }

/* -- Columns for medium sizes or larger -- */
@media (min-width: 768px) {
  .col-md { flex: 1 0 0%; }
  .col-md-auto { flex: 0 0 auto; width: auto; }
  .col-md-1 { flex: 0 0 auto; width: 8.3333333333%; }
  .col-md-2 { flex: 0 0 auto; width: 16.6666666667%; }
  .col-md-3 { flex: 0 0 auto; width: 25%; }
  .col-md-4 { flex: 0 0 auto; width: 33.3333333333%; }
  .col-md-5 { flex: 0 0 auto; width: 41.6666666667%; }
  .col-md-6 { flex: 0 0 auto; width: 50%; }
  .col-md-7 { flex: 0 0 auto; width: 58.3333333333%; }
  .col-md-8 { flex: 0 0 auto; width: 66.6666666667%; }
  .col-md-9 { flex: 0 0 auto; width: 75%; }
  .col-md-10 { flex: 0 0 auto; width: 83.3333333333%; }
  .col-md-11 { flex: 0 0 auto; width: 91.6666666667%; }
  .col-md-12 { flex: 0 0 auto; width: 100%; }
  
  /* ---- Floats ---- */
  .float-md-left { float: left !important; }
  .float-md-right { float: right !important; }
  .float-md-none { float: none !important; }
  
   /* ---- Displays ---- */
  .d-md-block { display: block!important; }
  .d-md-inline { display: inline!important; }
  .d-md-inline-block { display: inline-block!important; }
  .d-md-flex { display: flex!important; }
  .d-md-grid { display: grid!important; }
  .d-md-none { display: none!important; }
}

/* -- Columns for larger sizer -- */
@media (min-width: 992px) {
  .col-lg { flex: 1 0 0%; }
  .col-lg-auto { flex: 0 0 auto; width: auto; }
  .col-lg-1 { flex: 0 0 auto; width: 8.3333333333%; }
  .col-lg-2 { flex: 0 0 auto; width: 16.6666666667%; }
  .col-lg-3 { flex: 0 0 auto; width: 25%; }
  .col-lg-4 { flex: 0 0 auto; width: 33.3333333333%; }
  .col-lg-5 { flex: 0 0 auto; width: 41.6666666667%; }
  .col-lg-6 { flex: 0 0 auto; width: 50%; }
  .col-lg-7 { flex: 0 0 auto; width: 58.3333333333%; }
  .col-lg-8 { flex: 0 0 auto; width: 66.6666666667%; }
  .col-lg-9 { flex: 0 0 auto; width: 75%; }
  .col-lg-10 { flex: 0 0 auto; width: 83.3333333333%; }
  .col-lg-11 { flex: 0 0 auto; width: 91.6666666667%; }
  .col-lg-12 { flex: 0 0 auto; width: 100%; }
  
  /* ---- Floats ---- */
  .float-lg-left { float: left !important; }
  .float-lg-right { float: right !important; }
  .float-lg-none { float: none !important; }
  
   /* ---- Displays ---- */
  .d-lg-block { display: block!important; }
  .d-lg-inline { display: inline!important; }
  .d-lg-inline-block { display: inline-block!important; }
  .d-lg-flex { display: flex!important; }
  .d-lg-grid { display: grid!important; }
  .d-lg-none { display: none!important; }
}

/* AJAXPoll */
.ajaxpoll {
    width: auto;
    border: none;
    background: rgba(255,255,255,.5);
    border-radius: 10px;
}

.ajaxpoll .ajaxpoll-misc, .ajaxpoll .ajaxpoll-info {
    color: #000;
}

.ajaxpoll .ajaxpoll-id-info {
    display: none;
}

.ajaxpoll .ajaxpoll-answer-vote {
    border-color: #e4264a;
}

/* Userboxes */
#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%;
	}
}

/* this removes the license field on the file upload interface */
.mw-htmlform-field-Licenses,
.mw-upload-editlicenses {
    display: none;
}

/* hide potentially sensitive data on file pages */
#mw_metadata .exif-gpslatitude,
#mw_metadata .exif-gpslongitude,
#mw_metadata .exif-artist {
  display: none;
}