localhorst/msv-webcam-frontend
1
0
Fork 0
Code Issues 7 Pull Requests Packages Projects Releases Wiki Activity

fix view for mobile devices

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
www/css/custom.css
View File

@ -6,3 +6,16 @@ img:hover {
-webkit-transform:scale(1.5); -webkit-transform:scale(1.5);
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;
}

28
www/index.html
View File

@ -18,30 +18,30 @@
</style> </style>
</head> </head>
<body class="w3-animate-zoom"> <body class="w3-animate-zoom">
<div class="w3-container w3-content w3-center" style="margin-top:5%"> <div class="w3-container w3-content w3-center">
<h1 class="w3-text-white">MODELLSPORTVEREIN BÜHL-MOOS E.V.</h1> <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> <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"> <div class="w3-panel w3-card-4 w3-white w3-padding w3-center">
<h3 class="w3-container w3-left">Blick nach Norden</h3> <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 nach Norden"> <img src="data/msvcamN.avif" class="w3-center" style="width:100%;" alt="Bild der Webcam mit Blick auf die Piste">
</div> </div>
<div class="w3-panel w3-card-4 w3-white w3-padding w3-center"> <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"> <img src="data/msvcamS.avif" class="w3-center" style="width:100%;" alt="Bild der Webcam mit Blick nach Süden">
</div> </div>
</div>
<div class="w3-container w3-content w3-center" style="max-width:300px;"> <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-panel w3-card w3-dark-gray">
<div class="w3-center-align"> <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>
<a class="w3-hover" style="text-decoration: none" href="mailto:mail@hendrikschutter.com">
<h6>mail@hendrikschutter.com</h6></a>
</div>
</div>
</div>
<footer class="w3-container w3-center">Last update: 2023/07/05/<footer>
</body> </body>
</html> </html>