MediaWiki:Common.less/templates.less
Jump to navigation
Jump to search
/* ==================
TEMPLATES
==================*/
:root {
--keypress-background: @gallery;
--keypress-border: @silver;
--keypress-color: @mineshaft;
}
@variant-common: #46A685;
@variant-uncommon: #3566B7;
@variant-rare: #8A439C;
@variant-epic: #D58635;
// TOC
.toc {
border: none;
.toctitle {
border: 1px solid var(--body-darker);
> * {
color: @white;
.toctogglelabel {
color: var(--table-header-link);
}
}
}
> ul {
border: 1px solid var(--wikitable-border);
border-top: none;
}
}
// NAVBOX
.navbox {
.navbox-title {
color: @white;
a {
color: var(--table-header-link);
}
.mw-collapsible-toggle-collapsed,
.mw-collapsible-toggle-expanded {
&::before,
&::after {
color: white;
}
}
}
}
// Template:Archive list
.archivelist {
background-color: @infobox-background;
border: solid 1px @infobox-border-color;
box-shadow: @box-shadow;
float: right;
margin: 5px;
padding: 5px;
text-align: center;
width: 120px;
}
// Template:Shortcut
.shortcut {
border: 1px solid @infobox-border-color;
background: @infobox-background;
float: right;
font-size: .8em;
margin: 0.5em 0em 0.5em 1em;
padding: 0.5em;
text-align: center;
}
// Hatnotes: [[Module:Hatnote]]
.hatnote,
.seealso {
font-style: italic;
i {
font-style: normal;
}
}
// two classes - hatnote gets much customisation in minerva but seealso doesnt
div.hatnote,
div.seealso {
// 0.5em is <p>'s top and bottom margin
// 1.6em to match <dd>/<ul> indent
margin: .5em 1.6em;
& + & {
margin-top: -0.5em;
}
}
// Template:Key press
.keypress {
background: var(--keypress-background);
color: var(--keypress-color);
font-family: inherit;
border: 1px solid var(--keypress-border);
border-radius: @border-radius;
font-size: 0.9em;
margin: 0 0.1em;
padding: 0.1em 0.4em;
white-space: nowrap;
}
//Template:Infobox equipment & Template:Infobox weapon
.infobox-equipment,
.infobox-weapon {
background: var(--body-dark);
padding: 4px;
color: var(--body-main);
border-radius: @infobox-outer-radius;
box-shadow: inset 0 2px 2px rgba(255, 255, 255, 0.4), inset 0 -2px 2px rgba(0, 0, 0 ,0.1);
max-width: 150px;
p {
margin: 0;
font-weight: bold;
}
&.common {
background-color: @variant-common;
.dmg-types-wrapper {
background-color: desaturate(darken(@variant-common, 30%), 20%);
}
}
&.uncommon {
background-color: @variant-uncommon;
.dmg-types-wrapper {
background-color: desaturate(darken(@variant-uncommon, 30%), 20%);
}
}
&.rare {
background-color: @variant-rare;
.dmg-types-wrapper {
background-color: desaturate(darken(@variant-rare, 30%), 20%);
}
}
&.epic {
background-color: @variant-epic;
.dmg-types-wrapper {
background-color: desaturate(darken(@variant-epic, 30%), 20%);
}
}
.rarity-wrapper {
text-align: center;
padding-bottom: 4px;
}
.dmg-types-wrapper {
display: flex;
flex-flow: column;
grid-gap: 4px;
background-color: var(--body-darker);
border-radius: 1.2em;
padding: 5px 0;
box-shadow: @infobox-card-shadow;
overflow: hidden;
.dmg-type-row {
display: flex;
flex-flow: row;
grid-gap: 4px;
align-items: center;
p {
text-align: center;
width: calc(150px - 60px - 4px - 5px);
}
.dmg-type-cell {
display: flex;
justify-content: flex-end;
width: 60px;
border-radius: 0 @infobox-inner-radius @infobox-inner-radius 0;
box-shadow: inset 5px 0 5px -5px rgba(0, 0, 0, 0.6);
min-height: 29px;
background-color: rgba(255, 255, 255, 0.1);
/* equipment */
&.impact {
background-color: #fff;
}
&.cryonae {
background-color: @mantuban;
}
&.arborae {
background-color: @hopeforest;
}
&.tempestae {
background-color: @hopeport;
}
&.infernae {
background-color: #DC7E31;
}
&.necromae {
background-color: #0A0A0A;
}
/* weapon */
&.damage {
background-color: #fff;
}
&.element {
background-color: #0A0A0A;
}
&.range {
background-color: #8C8AC2;
}
&.one-hand {
background-color: #778B56;
}
&.two-hand {
background-color: #B7DB27;
}
img {
height: 25px;
width: auto;
padding: 2px;
}
}
}
}
}