More actions
Content deleted Content added
Speedometer CSS |
No edit summary |
||
Line 80: | Line 80: | ||
.mapBtn .name { |
.mapBtn .name { |
||
position: fixed; |
position: fixed; |
||
font-weight: 700; |
font-weight: 700; |
||
Line 97: | Line 96: | ||
/*user-select: none;*/ |
/*user-select: none;*/ |
||
} |
} |
||
.speedometer { |
.speedometer { |
||
Line 110: | Line 108: | ||
.speedometerIcon { |
.speedometerIcon { |
||
position:fixed; |
position:fixed; |
||
top: 0; |
top: 0; |
||
Line 120: | Line 117: | ||
object-fit: fill; |
object-fit: fill; |
||
object-position: 0% 0%; |
object-position: 0% 0%; |
||
/* width: 100%; |
|||
height: 100%; */ |
|||
background-color: rgba(0, 0, 0, 0.531); |
background-color: rgba(0, 0, 0, 0.531); |
||
width: 24px; |
width: 24px; |
||
Line 131: | Line 126: | ||
.speedometer .speed { |
.speedometer .speed { |
||
position: absolute; |
position: absolute; |
||
font-weight: 750; |
font-weight: 750; |
||
Line 144: | Line 138: | ||
background: linear-gradient(180deg, #E6C058 0%, #E69817 100%); |
background: linear-gradient(180deg, #E6C058 0%, #E69817 100%); |
||
background-clip: border-box; |
background-clip: border-box; |
||
-webkit-background-clip: text; |
|||
-webkit-text-fill-color: transparent; |
|||
} |
} |
Revision as of 07:34, 25 February 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-style: solid;
}
.pi-title {
text-align: center;
}
.pi-secondary-font {
text-align: center;
}
.pi-header {
/*border-radius: 1rem;*/
}
.mapGradient {
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: 5;
}
.mapBtn {
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;
}
.mapBtn .mapImage {
border-radius: 7px;
width: 100%;
}
.mapImage .mw-halign-center .mw-file-description {
border-radius: 7px;
}
.mapImage figure a {
border-radius: 7.2px;
}
.mapBtn .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;*/
}
.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(./img/Speedometer.svg);
background-repeat: no-repeat;
background-position: center;
background-size: contain;
object-fit: fill;
object-position: 0% 0%;
background-color: rgba(0, 0, 0, 0.531);
width: 24px;
height: 100%;
display: block;
margin-left: auto;
border-radius: 3px 0 0 3px;
}
.speedometer .speed {
position: absolute;
font-weight: 750;
font-size: 20px;
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;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}