+ Better mobile support

meow
Dominika 2022-01-13 15:46:24 +01:00
parent 8912e0f850
commit 6f99174c5b
2 changed files with 24 additions and 5 deletions

View File

@ -18,7 +18,7 @@
.load {
height: 100%;
width: 100%;
z-index: 9999;
z-index: 10000;
display: none;
position: fixed;
background-color: #333;
@ -64,8 +64,9 @@
right: 10px;
top: 10px;
width: 256px;
height: 128px;
height: 64px;
background-color: #444;
z-index: 9999;
}
.ipa, .whois, .traceroute {
word-wrap : break-word;
@ -78,6 +79,21 @@
a, a:visited, a:hover {
color: #3c3;
}
@media (max-width: 768px) {
#map, .container, .result-container, .data, .traceroute, .ipa {
width: 100%;
}
#map {
margin-top: 64px;
}
.scoring {
width: 100%;
left: 0;
top: 0;
right: unset;
background-color: #333;
}
}
</style>
</head>
<body>

View File

@ -14,6 +14,10 @@ L.tileLayer('https://tile.thunderforest.com/landscape/{z}/{x}/{y}.png?apikey=60d
noWrap: true
}).addTo(map);
document.querySelector(".scoring").innerText = `This round: make a guess ;)
Score total: ${score}
Round: ${round}`
async function main() {
function getDistance(from, to) {
@ -40,12 +44,11 @@ async function main() {
const points = Math.floor((1.2**(-distance/100))*5000) // best I could do XD
score += points;
round++;
document.querySelector(".scoring").innerText = `This round: ${points}
Score total: ${score}
Round: ${round}`
round++;
marker.setOpacity(1);
document.querySelector(".result").innerText = `You were ${distance} km away from your target! This has earned you ${points} points.`