Difference between revisions of "MediaWiki:Common.css"
Jump to navigation
Jump to search
m |
(Discord Card) |
||
Line 1: | Line 1: | ||
/* CSS placed here will be applied to all skins */ | /* CSS placed here will be applied to all skins */ | ||
+ | /** | ||
+ | Template for Infobox_Monster | ||
+ | **/ | ||
.infobox { | .infobox { | ||
background: #eee; | background: #eee; | ||
Line 52: | Line 55: | ||
.fullWidth-table { | .fullWidth-table { | ||
width: 100%; | width: 100%; | ||
+ | } | ||
+ | |||
+ | /** | ||
+ | Main Page | ||
+ | **/ | ||
+ | .mainpage-discord { | ||
+ | border: none; | ||
+ | box-shadow: 0 0.25rem 0.35rem -0.25rem rgba(0, 0, 0, 0.3); | ||
+ | } | ||
+ | |||
+ | .mainpage-discord .tile-top { | ||
+ | display: flex; | ||
+ | align-items: center; | ||
+ | background: #7289da; | ||
+ | padding: 1em 1.75em; | ||
+ | } | ||
+ | |||
+ | .mainpage-discord .tile-top a { | ||
+ | flex: 1; | ||
+ | position: relative; | ||
+ | text-decoration: none; | ||
+ | } | ||
+ | |||
+ | .mainpage-discord .tile-top a:hover .arrow { | ||
+ | transform: translateX(50%); | ||
+ | } | ||
+ | |||
+ | .mainpage-discord .tile-bottom { | ||
+ | background: #697ec4; | ||
+ | border: none; | ||
+ | padding: 1em 1.75em; | ||
+ | } | ||
+ | |||
+ | .mainpage-discord .tile-bottom p { | ||
+ | color: #ffffff; | ||
+ | font-weight: bold; | ||
+ | font-size: 0.9em; | ||
+ | text-align: center; | ||
+ | text-transform: uppercase; | ||
+ | letter-spacing: 0.03em; | ||
+ | margin: 0; | ||
+ | } | ||
+ | |||
+ | .mainpage-discord .discord-icon { | ||
+ | margin-right: 0.75em; | ||
+ | } | ||
+ | |||
+ | .mainpage-discord .server-name { | ||
+ | color: #ffffff; | ||
+ | font-weight: bold; | ||
+ | font-size: 1.25em; | ||
+ | margin: 0.5em 0 -0.15em; | ||
+ | } | ||
+ | |||
+ | .mainpage-discord .server-tagline { | ||
+ | color: rgba(255, 255, 255, 0.9); | ||
+ | margin-bottom: 0.5em; | ||
+ | } | ||
+ | |||
+ | .mainpage-discord .arrow { | ||
+ | position: absolute; | ||
+ | top: calc(50% - .5em); | ||
+ | right: 0; | ||
+ | height: 1em; | ||
+ | width: 0.7em; | ||
+ | background-size: 0.7em 1em; | ||
+ | transition: 0.3s ease-out; | ||
} | } |
Revision as of 09:38, 23 August 2020
/* CSS placed here will be applied to all skins */
/**
Template for Infobox_Monster
**/
.infobox {
background: #eee;
border: 1px solid #aaa;
float: right;
margin: 0.5em 0 1em 1em;
padding: 1em;
width: 300px;
word-break: break-word;
font-size: 0.85em;
}
.infobox-header {
font-size: 1.5em;
text-align: center;
line-height: 1.4em;
padding: 0.5em 0;
line-height: 2em;
background-color: #bebebe;
font-weight: bold;
}
.infobox-title {
font-size: 1.25em;
text-align: center;
line-height: 2em;
background-color: #bebebe;
font-weight: bold;
}
.infobox-image {
text-align: center;
}
.infobox-image img {
max-width: 300px;
height: auto;
padding: 1em;
}
.infobox-stats {
text-align: center;
padding: .25em;
}
.infobox-nested {
text-align: center;
}
.infobox th {
text-align: right;
}
.infobox td {
vertical-align: top;
padding: 0.25em 0.5em;
line-height: 1.6em;
}
.fullWidth-table {
width: 100%;
}
/**
Main Page
**/
.mainpage-discord {
border: none;
box-shadow: 0 0.25rem 0.35rem -0.25rem rgba(0, 0, 0, 0.3);
}
.mainpage-discord .tile-top {
display: flex;
align-items: center;
background: #7289da;
padding: 1em 1.75em;
}
.mainpage-discord .tile-top a {
flex: 1;
position: relative;
text-decoration: none;
}
.mainpage-discord .tile-top a:hover .arrow {
transform: translateX(50%);
}
.mainpage-discord .tile-bottom {
background: #697ec4;
border: none;
padding: 1em 1.75em;
}
.mainpage-discord .tile-bottom p {
color: #ffffff;
font-weight: bold;
font-size: 0.9em;
text-align: center;
text-transform: uppercase;
letter-spacing: 0.03em;
margin: 0;
}
.mainpage-discord .discord-icon {
margin-right: 0.75em;
}
.mainpage-discord .server-name {
color: #ffffff;
font-weight: bold;
font-size: 1.25em;
margin: 0.5em 0 -0.15em;
}
.mainpage-discord .server-tagline {
color: rgba(255, 255, 255, 0.9);
margin-bottom: 0.5em;
}
.mainpage-discord .arrow {
position: absolute;
top: calc(50% - .5em);
right: 0;
height: 1em;
width: 0.7em;
background-size: 0.7em 1em;
transition: 0.3s ease-out;
}