From Brotato Wiki
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)
- Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
- Opera: Press Ctrl-F5.
/* CSS placed here will be applied to all skins */
/*
https://brotato.wiki.spellsandguns.com/MediaWiki:Common.css
*/
.infobox {
background: #eee;
border: 1px solid #aaa;
float: right;
margin: 0 0 1em 1em;
padding: 1em;
width: 400px;
}
.infobox-title {
font-size: 2em;
text-align: center;
}
.infobox-image {
text-align: center;
}
.infobox th {
text-align: right;
vertical-align: top;
width: 120px;
}
.infobox td {
vertical-align: top;
}
.wikitable {
font-size: min(max(1vw,10px), 16px);
}
.box-content h3 {
font-size: 18px;
}
.box-content h4 {
font-size: 16px;
font-weight: bold;
}
/* Template docs: separate the auto-generated content off from the custom content */
.mw-templatedata-doc-wrap {
margin-top: 40px;
border-top: 1px dashed #333;
padding-top: 5px;
}
/* fixed collapsed tables having squashed captions */
table.mw-collapsed {
min-width: 200px;
}
/* Add a small top margin above TOCs if they're directly below a margin */
/* (without this the spacing looks too cramped) */
p + #toc {
margin-top: 30px;
}
/*=============================================================
Colors (Dark)
==============================================================*/
.danger4 {
border: 1px solid rgb(var(--danger-4),.5);
background: linear-gradient(360deg,rgb(var(--danger-4),.5),rgba(0,0,0,0.5));
}
.danger5 {
border: 1px solid rgb(var(--danger-5),.5);
background: linear-gradient(360deg,rgb(var(--danger-5),.5),rgba(0,0,0,0.5));
}
.rarity0dark {
background: rgb(var(--rarity-0-dark));
}
.rarity1dark {
background: rgb(var(--rarity-1-dark));
}
.rarity2dark {
background: rgb(var(--rarity-2-dark));
}
.rarity3dark {
background: rgb(var(--rarity-3-dark));
}
.rarity4dark {
background: rgb(var(--rarity-4-dark));
}
.rarity5dark {
background: rgb(var(--rarity-5-dark));
}
.danger4dark {
background: rgb(var(--danger-4-dark));
}
.danger5dark {
background: rgb(var(--danger-5-dark));
}
/*=============================================================
Comments
==============================================================*/
#comments-body {
background: rgba(38, 38, 38, 0.5);
content: 'Comments';
display: inline-block;
margin-bottom: 20px;
margin-top: 20px;
padding: 10px 10px 10px 10px;
}
#comments-body:before {
content: 'Comments';
padding: 10px 20px 0;
display: inline-block;
font-size: 18px;
font-weight: bold;
}
#comments-body .c-order {
border-bottom: 1px solid grey;
margin-bottom: 10px;
padding: 20px;
}
#comments-body .c-avatar {
display: none; /* avatars aren't used anyway */
}
#comments-body .c-container {
margin-left: 20px;
}
#comments-body .c-item {
border-color: #666;
padding-bottom: 10px;
}
#comments-body .c-delete a {
color: #9f3232 !important;
}
#comments-body .c-form-title {
color: white;
}
#comments-body textarea#comment {
background-color: #222222;
color: white;
padding: 10px;
width: 100%;
}
#comments-body > form {
padding: 0 20px 20px;
}
/*=============================================================
Templates
==============================================================*/
/* Template:MiniIconbox */
.iconbox--inline {
margin: 0;
vertical-align: baseline;
}
/* Template:NavBoxCharacters */
.navbox-characters {
font-size: 11px;
max-width: 750px;
}
/* Template:NavBoxStats */
.navbox-stats {
margin: 0 auto 30px;
}
.navbox-stats--topmargin {
margin-top: 40px !important;
}
.navbox-stats td {
width: 160px;
}
/*=============================================================
Item Box (Template:Itembox)
==============================================================*/
.ibox {
width: 200px;
padding: 10px;
transition: 0.1s;
opacity: 1;
}
.ibox__top {
display: flex;
margin-bottom: 10px;
}
.ibox__icon {
background-color: rgba(255,255,255, 0.1);
margin-right: 10px;
width: 60px;
height: 60px;
padding: 3px;
flex-shrink: 0;
}
.ibox__icon p {
margin: 0;
}
.ibox__name {
font-weight: bold;
}
.ibox__stats {
font-size: 15px;
line-height: 1.2;
}
.ibox__stats ul {
margin: 0;
}
.ibox__stats li {
list-style: none;
margin-bottom: 3px;
}
.ibox--hidden {
display: none;
}
/*=============================================================
StatsCard Grid
==============================================================*/
.statscard-grid {
margin: 0 auto;
max-width: 1230px;
}
.statscard-grid--fullheight {
min-height: calc(80vh + 60px);
}
.statscard-grid__main {
display: flex;
flex-wrap: wrap;
max-height: 80vh;
overflow: auto;
}
.statscard-grid__item {
flex: 0 0 auto;
/* margin-left: -20px; */
/* padding: 0 20px 20px; */
}
.statscard-grid__main .ibox {
height: calc(100% - 40px); /*makes all items equal height*/
margin: 0 20px 20px 0;
}
/*=============================================================
StatsCard Grid: Options
==============================================================*/
/* 👁️ Filtered items become transparent, instead of being fully hidden */
.statscard-grid__main--transparent-hidden-items .ibox--hidden {
display: block;
opacity: 0.2;
}
/* 📦 Only show icons */
.statscard-grid__main--only-show-icons .ibox {
height: auto;
margin: 0 5px 5px 0;
padding: 0;
width: auto;
}
.statscard-grid__main--only-show-icons .ibox__top {
margin-bottom: 0;
}
.statscard-grid__main--only-show-icons .ibox__icon {
margin-right: 0;
}
.statscard-grid__main--only-show-icons .ibox__top-right,
.statscard-grid__main--only-show-icons .ibox__stats {
display: none;
}
/*=============================================================
Tabs (Template:StatsCardWeaponTabs)
==============================================================*/
/* See also: MediaWiki:Common.js */
.cardtabs__panel {
position: relative;
z-index: 1;
}
.cardtabs__panel--js-hidden {
display: none;
}
.cardtabs__button {
border-radius: 0 0 5px 5px;
display: inline-block;
font-size: 13px;
line-height: 1.5;
margin-left: 8px;
padding: 2px 3px 1px;
position: relative;
top: -2px;
}
.cardtabs__button:not(.cardtabs__button--disabled):hover {
cursor: url('/skins/ScratchWikiSkin2/resources/custom-cursorlink.png?bccaa') 4 4, auto;
}
.cardtabs__button--active {
border-top: 0;
z-index: 1;
}
.cardtabs__button--disabled {
opacity: 0.2;
}
/* Info/Unlock panels */
.cardtabs__button--icon-info img {
position: relative;
top: -2px;
}
.cardtabs__button--icon-unlock img {
position: relative;
top: -1px;
}
.cardtabs__button--icon-unlock {
padding-bottom: 0;
}
/*=============================================================
Toggle Buttons (Template:ToggleStart + Template:ToggleButton)
==============================================================*/
.btn {
background: rgba(255,255,255,0.05);
border-radius: 3px;
border: 1px solid white;
display: inline-block;
font-size: 0.85rem;
font-weight: bold;
padding: 6px 10px;
}
.btn:hover {
background: rgba(255,255,255,0.1);
}
.btn--link {
padding: 0;
}
.btn--link > a {
padding: 6px 15px 6px 10px;
padding-right: 15px !important; /* override needed due to exteral link bg image icon */
display: inline-block;
}
.btn--active {
border-color: #366436;
}
.btn--inactive {
border-color: #643636;
}
/*=============================================================
Special Classes
==============================================================*/
/* Character's "Starting Weapons" table */
.starting-weapons-table {
margin: 0.4em 0 0.5em 0;
}
.starting-weapons-table td {
text-align: center;
vertical-align: top;
width: 85px;
}
@media only screen and (max-width: 640px) {
.starting-weapons-table td {
font-size: 12px;
}
}
/* Use on lists (ul), ideal for lists inside tables (eg Mod:Extatonion) */
ul.list-remove-left-margin,
ol.list-remove-left-margin {
margin-left: 25px;
}
/* Weird table hack that makes ibox items (Template:Itembox) equal height */
/* needs to be in a table with the class .itembox-table */
table.itembox-table td .ibox {
height: calc(100% - 20px);
}
table.itembox-table td {
height: 100%;
}
table.itembox-table {
height: 1px;
}