More actions
Content added Content deleted
mNo edit summary |
mNo edit summary |
||
Line 153: | Line 153: | ||
} |
} |
||
.gamemode.gamemodeImg { |
|||
height: 100%; |
|||
} |
|||
.speedometer .speed { |
.speedometer .speed { |
Revision as of 11:39, 2 June 2024
/* CSS placed here will be applied to all skins */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
body {
font-family: "Montserrat", sans-serif;
font-weight: 400;
}
.mw-body h1,
.mw-body-content h1,
.mw-body-content h2 {
font-family: "Montserrat", sans-serif;
font-weight: 600;
}
/**Custom Infobox**/
.portable-infobox {
/*width: 300px; */
border-radius: 1rem;
border-width: 1.5px;
/*border-color: #52555b;*/
border-color: var(--pi-border-color);
border-style: solid;
}
.pi-title {
text-align: center;
}
.pi-secondary-font {
text-align: center;
}
.gradient {
background: rgb(255,255,255);
background: linear-gradient(180deg, rgba(0, 0, 0, 0) 60%, rgba(0, 0, 0, 0.598) 100%);
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
border-radius: 7px;
opacity: 0.9;
pointer-events: none;
z-index: 2;
transition: .10s;
transition-timing-function: ease-out;
}
.shortBox:hover > .gradient {
height: 174%;
transition: .10s;
transition-timing-function: ease-in;
opacity: 1;
}
.shortBox {
background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); /* Chrome10+,Safari5.1+ */
background-color: rgba(255, 255, 255, 0.209);
padding: .1rem;
width: 150px;
height: 112.5px;
display:inline-block;
border-radius: 8px;
filter: drop-shadow(0px 0px 2px rgba(0, 0, 0, 0.294));
margin: -1px 0;
position: relative;
overflow:hidden;
}
.shortBox .boxImg {
border-radius: 7px;
width: 100%;
}
.boxImg .mw-halign-center .mw-file-description {
border-radius: 7px;
}
.boxImg figure a {
border-radius: 7.2px;
}
.shortBox .icon {
position:fixed;
top: 0;
right: 0;
background-color: rgba(0, 0, 0, 0);
width: 20px;
height: 20px;
margin: 2px 5px;
filter: drop-shadow(0px 0px .85px rgba(0, 0, 0, 0.633));
transition: .10s;
transition-timing-function: ease-out;
opacity: 1;
z-index: 100;
}
.shortBox:hover > .icon {
position:fixed;
top: 0;
right: 0;
background-color: rgba(0, 0, 0, 0);
margin: -20px 5px;
filter: drop-shadow(0px 0px .85px rgba(0, 0, 0, 0.633));
transition: .10s;
transition-timing-function: ease-in;
opacity: 0;
}
.shortBox .name {
position: fixed;
font-weight: 700;
font-size: 20px;
z-index: 99;
color: rgb(255, 255, 255);
filter: drop-shadow(0px 0px .85px rgb(0, 0, 0));
bottom: 0;
left: 0%;
margin: 0 2px 5px 6px;
line-height: 1.05rem;
overflow-wrap: break-word;
pointer-events: none;
/*-webkit-user-select: none;*/
/*-ms-user-select: none;*/
/*user-select: none;*/
transition: .10s;
transition-timing-function: ease-out;
}
.shortBox:hover > .name {
color: rgba(255, 255, 255, 0);
bottom: 0;
left: 0%;
margin: 0 2px -20px 6px;
transition: .10s;
transition-timing-function: ease-in;
}
.gamemode {
width: 100px;
height: 100px;
border-radius: 1rem;
border-width: 1.5px;
border-color: var(--pi-border-color);
background-color: var(--pi-background);
border-style: solid;
float: left;
}
.gamemode.gamemodeImg {
height: 100%;
}
.speedometer .speed {
position: absolute;
font-family: "Montserrat", sans-serif;
font-weight: 700;
font-size: 200px;
z-index: 1;
color: rgb(255, 255, 255);
filter: drop-shadow(0px 0px .85px rgba(0, 0, 0, 0.331));
bottom: 3.5px;
left: 31px;
line-height: 1.05rem;
margin: 0 auto;
background: linear-gradient(180deg, #E6C058 0%, #E69817 100%);
background-clip: border-box;
}
.speedometer {
background-color: rgba(0, 0, 0, 0.531);
width: 76px;
height: 24px;
display: inline-block;
border-radius: 3px;
filter: drop-shadow(0px 0px 2px rgba(0, 0, 0, 0.294));
position: relative;
}
.speedometerIcon {
position:fixed;
top: 0;
left: 0;
background-image: url(https://static.miraheze.org/evadewiki/f/f7/Speedometer.svg);
background-repeat: no-repeat;
background-position: center;
background-size: contain;
background-color: rgba(0, 0, 0, 0.531);
width: 24px;
height: 100%;
display: block;
margin-left: auto;
border-radius: 3px 0 0 3px;
}
.wikitable tr:nth-child(odd) {
background-color: rgba(0, 0, 0, 0.06);
}