Jump to content

We are doing some maintenance on the Timeless Skin, Please do not mind any changes to pages or CSS! Today is Tuesday June 23, 2026!

MediaWiki:Common.css

From Zee Bawx Wiki
Revision as of 17:43, 20 February 2025 by Dragonteam1708 (talk | contribs)

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.


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

@media screen and (prefers-color-scheme: dark) {

.skin-theme-clientpref-night .infobox {
    background: #333 !important;
    border: 1px solid #aaa;
}


.skin-theme-clientpref-night .tabs-label {
   background: #959595 !important;
}

}


.infobox td, th {
     font-size: 0.75rem;
}

.infobox {
    background: #eee;
    border: 1px solid #aaa;
    float: right;
    margin: 0 0 .5em .5em;
    padding: 1em;
    width: 15rem;
}
.infobox-title {
    font-size: 1.5em;
    text-align: center;
}
.infobox-image {
    text-align: center;
}

.infobox-image img {
   max-width: 100%;
   height: auto;
}

.infobox-table th {
    text-align: left;
    vertical-align: top;
    width: 1rem;
}
.infobox-table td {
    vertical-align: top;
}

body {
background-image:url(https://www.wiki.zeebawx.com/images/b/bf/ZBWikiBG.png);
background-color:black;
background-repeat: no-repeat;
background-size: cover;
background-attachment: fixed;
background-position: top;
}
img
{
background-color: transparent !important;
}

.mw-category-Corrupted_Characters {
background-image:url(https://www.wiki.zeebawx.com/images/1/14/VoidBackground.png);
background-color:black;
background-repeat: no-repeat;
background-size: cover;
background-attachment: fixed;
background-position: top;
}
img
{
background-color: transparent !important;
}

.mbox-w {
    /*
    * ||| Mbox 
    * The base styling of mbox
    */
    --pre: #f2f2f29a;
    
    --mbox-w-basic-border: #36c;
    --mbox-w-background: #ffffff1a;
    --mbox-w-background--speedy: #fee7e6;
    --mbox-w-border--speedy: #b32424;
    
    --mbox-w-border--delete: #b32424;
    
    --mbox-w-border--content: #f28500;
    
    --mbox-w-border--style: #fc3;
    
    --mbox-w-border--move: #93c;
    
    --mbox-w-border--protection: #a2a9b1;
    
    --mbox-w-border--license: #88a;
    
    --mbox-w-border--featured: #cba135;
    
    /* 
    *  Ambox
    * Article Message BOX
    */
    --ambox-w-border: #a2a9b1;
    --ambox-w-border-left: #36c;
    
    --ambox-w-border-left--speedy: #b32424;
    
    --ambox-w-border-left--delete: #b32424;
    
    --ambox-w-border-left--content: #f28500;
    
    --ambox-w-border-left--style: #fc3;
    
    --ambox-w-border-left--notice: #36c;
    
    --ambox-w-border-left--move: #93c;
    
    --ambox-w-border-left--protection: #a2a9b1;
    
    /* Featured Mbox */
    --ambox-w-border-left--featured: #cba135;
    
    /* 
    * ||| Cmbox
    * Category Message BOX
    */
    --cmbox-w-border: #a2a9b1;
    --cmbox-w-background: #dfe8ff;
    
    /* No speedy, default mbox speedy */
    
    --cmbox-w-background--delete: #fee7e6;
    
    --cmbox-w-background--content: #ffe7ce;
    
    --cmbox-w-background--style:  #fff9db;
    
    --cmbox-w-background--notice: #d8e8ff;
    
    --cmbox-w-background--move: #e4d8ff;
    
    --cmbox-w-background--protection: #efefe1;
    
    /* */
    --tmbox-w-background: #f8eaba;
    
    /*
    * ||| Other mboxes
    * Uses the default styling
    */
}

/* 
* ||- CSS Vars (dark)
*/
.theme-fandomdesktop-dark .mbox-w {
    /*
    * ||| Mbox 
    * The base styling of mbox
    */
    --pre: #585858b5;
    
    --mbox-w-basic-border: #183266;
    --mbox-w-background--speedy: #231515;
    --mbox-w-border--speedy: #661414;
    
    --mbox-w-border--delete: #661414;
    
    --mbox-w-border--content: #ab6005;
    
    --mbox-w-border--style: #ba9422;
    
    --mbox-w-border--notice: #183266;
    --mbox-w-border--move: #6a248c;
    
    --mbox-w-border--protection: #5e6369;
    
    --mbox-w-border--license: #505063;
    
    --mbox-w-border--featured: #9c7b27;
    
    /* 
    *  Ambox
    * Article Message BOX
    */
    --ambox-w-border: #474e57;
    --ambox-w-border-left: #21448a;
    
    --ambox-w-border-left--speedy: #661414;
    
    --ambox-w-border-left--delete: #661414;
    
    --ambox-w-border-left--content: #ab6005;
    
    --ambox-w-border-left--style: #ba9422;
    
    --ambox-w-border-left--notice: #21448a;
    
    --ambox-w-border-left--move: #6a248c;
    
    --ambox-w-border-left--protection: #474e57;
    
    /* Featured Mbox */
    --ambox-w-border-left--featured: #cba135;
    
    /* 
    * ||| Cmbox
    * Category Message BOX
    */
    --cmbox-w-border: #474e57;
    --cmbox-w-background: #363228;
    
    /* No speedy, default mbox speedy */
    
    --cmbox-w-background--delete: #422d2c;
    
    --cmbox-w-background--content: #4f4336;
    
    --cmbox-w-background--style:  #4a4630;
    
    --cmbox-w-background--notice: #252f3d;
    
    --cmbox-w-background--move: #392f4f;
    
    --cmbox-w-background--protection: #3d3d23;
    
    /* |||Tmbox */
    --tmbox-w-background: #3d3003;
    
    /*
    * ||| Other mboxes
    * Uses the default styling
    */
}

/* 
* ||- Main mbox styling
*
*/
.mbox-w {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    height: auto;
    box-sizing: border-box;
    margin: 4px 5%;
    border-width: 1px;
    border-style: solid;
    background: transparent;
    padding: 0.25em;
    font-size: 95%;
}
 
.mbox-w-small {
    clear: right;
    float: right;
    margin: 4px 0 2px 1em;
    box-sizing: border-box;
    width: 238px;
    font-size: 88%;
    line-height: 1.25em;
}
 
.mbox-w-small.ambox-w {
    clear: left;
    float: left;
    margin: 4px 1em 2px 0;
}
 
.mbox-w pre {
    background-color: var(--pre);
}
 
.mbox-w div.mbox-w-message {
    flex-basis: 100%;
    padding: 0.25em;
    text-align: left;
}
 
.mbox-w .mbox-w-date,
.mbox-w .mbox-w-info {
    font-size:85%;
}
 
.mbox-w div.mbox-w-image {
    padding: 0.25em;
}
 
.ambox-w {
    margin: 0 5%;
    border-color: var(--ambox-w-border);
    border-left: 10px solid var(--ambox-w-border-left);
    background-color: var(--mbox-w-background);
}
 
.cmbox-w {
    border-color: var(--cmbox-w-border);
    background-color: var(--cmbox-w-border);
}
 
.imbox-w {
    border-width: 3px;
    border-color: var(--mbox-w-basic-border);
    background-color: var(--mbox-w-background);
}
 
.xmbox-w {
    border-width: 2px;
    border-color: var(--mbox-w-basic-border);
    border-style: dotted;
    background-color: var(--mbox-w-background);
}
 
.tmbox-w {
    border-width: 2px;
    border-color: var(--mbox-w-basic-border);
    background: var(--tmbox-w-background);
}
 
.ombox-w {
    border-color: var(--mbox-w-basic-border);
    background-color: var(--mbox-w-background);
}
 
.fmbox-w {
    margin: 4px 0;
    background-color: var(--mbox-w-background);
}
 
.mbox-w-small.imbox-w,
.mbox-w-small.xmbox-w,
.mbox-w-small.tmbox-w {
    border-width: 1px;
}
 
.mbox-w-speedy,
.mbox-w-warning {
    border-color: var(--mbox-w-border--speedy);
}
 
.ambox-w.mbox-w-speedy {
    border-color: var(--ambox-w-border);
    border-left-color: var(--ambox-w-border-left--speedy);
}
 
.cmbox-w.mbox-w-speedy,
.xmbox-w.mbox-w-speedy,
.xmbox-w.mbox-w-delete,
.ombox-w.mbox-w-speedy,
.ombox-w.mbox-w-delete {
    border-width: 3px;
}
 
.mbox-w-delete {
    border-color: var(--mbox-w-border--delete);
}
 
.ambox-w.mbox-w-delete {
    border-color: var(--ambox-w-border);
    border-left-color: var(--ambox-w-border-left--delete);
}
 
.cmbox-w.mbox-w-delete {
    border-color: var(--cmbox-w-border);
    background: var(--cmbox-w-background--delete);
}
 
.mbox-w-content {
    border-color: var(--mbox-w-border--content);
}
 
.ambox-w.mbox-w-content {
    border-color: var(--ambox-w-border);
    border-left-color: var(--ambox-w-border-left--content);
}
 
.cmbox-w.mbox-w-content {
    border-color: var(--cmbox-w-border);
    background: var(--cmbox-w-background--content);
}
 
.mbox-w-style {
    border-color: var(--mbox-w-border--style);
}
 
.ambox-w.mbox-w-style {
    border-color: var(--ambox-w-border);
    border-left-color: var(--ambox-w-border-left--style);
}
 
.cmbox-w.mbox-w-style {
    border-color: var(--cmbox-w-border);
    background: var(--cmbox-w-background--style);
}
 
.mbox-w-notice {
    border-color: var(--mbox-w-border--notice);
}
 
.ambox-w.mbox-w-notice {
    border-color: var(--ambox-w-border);
    border-left-color: var(--ambox-w-border-left--notice);
}
 
.cmbox-w.mbox-w-notice {
    border-color: var(--cmbox-w-border);
    background: var(--cmbox-w-background--notice);
}
 
.mbox-w-move {
    border-color: var(--mbox-w-border--move);
}
 
.ambox-w.mbox-w-move {
    border-color: var(--ambox-w-border);
    border-left-color: var(--ambox-w-border-left--move);
}
 
.cmbox-w.mbox-w-move {
    border-color: var(--cmbox-w-border);
    background: var(--cmbox-w-background--move);
}
 
.mbox-w-protection {
    border-color: var(--mbox-w-border--protection);
}
 
.ambox-w.mbox-w-protection {
    border-color: var(--ambox-w-border);
    border-left-color: var(--ambox-w-border-left--protection);
}
 
.cmbox-w.mbox-w-protection {
    border-color: var(--cmbox-w-border);
    background: var(--cmbox-w-background--protection);
}
 
.mbox-w-license {
    border-color: var(--mbox-w-border--license);
}
 
.mbox-w-featured {
    border-color: var(--mbox-w-border--featured);
}
 
.ambox-w.mbox-w-featured {
    border-color: var(--ambox-w-border);
    border-left-color: var(--ambox-w-border-color--featured);
}
 
.ambox-w + .ambox-w {
    margin-top: -1px;
}

@media print {
    .mbox-w { 
        display: none;
    }
} /* no mbox when printing */