fix view for mobile devices

This commit is contained in:
Hendrik Schutter 2023-07-07 20:51:18 +02:00
parent ff1125eff2
commit 3a05dc4616
2 changed files with 26 additions and 13 deletions

View File

@ -5,4 +5,17 @@ img {
img:hover {
-webkit-transform:scale(1.5);
transform:scale(1.5);
}
}
.titletext {
font-size: calc(10px + 0.9vw);
}
.cameratext {
font-size: calc(10px + 0.9vw);
}
.infobox{
margin:0 !important;
padding:0 !important;
}

View File

@ -18,30 +18,30 @@
</style>
</head>
<body class="w3-animate-zoom">
<div class="w3-container w3-content w3-center" style="margin-top:5%">
<h1 class="w3-text-white">MODELLSPORTVEREIN BÜHL-MOOS E.V.</h1>
<div class="w3-container w3-content w3-center">
<h1 class="w3-text-white titletext">MODELLSPORTVEREIN BÜHL-MOOS E.V.</h1>
<p class="w3-text-white"><i>Live Webcam vom Flugplatz in Moos</i></p>
<div class="w3-panel w3-card-4 w3-white w3-padding w3-center">
<h3 class="w3-container w3-left">Blick nach Norden</h3>
<img src="data/msvcamN.avif" class="w3-center" style="width:100%;" alt="Bild der Webcam mit Blick nach Norden">
<h3 class="w3-container w3-left cameratext">Blick auf die Piste</h3>
<img src="data/msvcamN.avif" class="w3-center" style="width:100%;" alt="Bild der Webcam mit Blick auf die Piste">
</div>
<div class="w3-panel w3-card-4 w3-white w3-padding w3-center">
<h3 class="w3-container w3-left">Blick nach Süden</h3>
<h3 class="w3-container w3-left cameratext">Blick nach Süden</h3>
<img src="data/msvcamS.avif" class="w3-center" style="width:100%;" alt="Bild der Webcam mit Blick nach Süden">
</div>
</div>
<div class="w3-container w3-content w3-center" style="max-width:300px;">
<div class="w3-panel w3-card w3-dark-gray w3-padding">
<div class="w3-center-align">
<a class="w3-hover" style="text-decoration: none" href="mailto:mail@hendrikschutter.com">
<h6>mail@hendrikschutter.com</h6></a>
<div class="w3-panel w3-card w3-dark-gray">
<div class="w3-center-align w3-text-black infobox">
<a style="text-decoration: none" href="mailto:mail@hendrikschutter.com?subject=MSV%20Webcam"><h6>mail@hendrikschutter.com</h6></a>
<p>Last update: 2023/07/07<p>
<a style="text-decoration: none" href="https://git.mosad.xyz/localhorst/msv-webcam-frontend"><h6>View code in GIT</h6></a>
</div>
</div>
</div>
<footer class="w3-container w3-center">Last update: 2023/07/05/<footer>
</body>
</html>