Fix by Jonas for iOS devices

This commit is contained in:
Kumi 2022-01-11 13:56:43 +00:00
parent 78b0a161af
commit af7815e858

View file

@ -19,38 +19,65 @@ if ($baseurl[-1] != "/") $baseurl += "/";
?> ?>
<html> <html>
<head> <head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<style> <style>
ul { ul {
list-style-type: none; list-style-type: none;
height: 52px;
margin: 0; margin: 0;
padding: 0; padding: 0;
overflow: hidden; overflow: hidden;
background-color: #333; background-color: #333;
flex: 0 0 auto; flex: 0 0 auto;
pointer-events: none;
} }
li { li {
float: left;
height: auto; height: auto;
position: relative; position: absolute;
font-family: "sans-serif"; font-family: "sans-serif";
} box-sizing: border-box;
li.right {
float: right;
margin: 4px;
} }
li.logo { li.logo {
left: 0;
margin-left: 1em; margin-left: 1em;
margin-right: 1em; margin-right: 1em;
padding-top: 6px; padding-top: 6px;
padding-bottom: 6px; padding-bottom: 6px;
line-height: 52px;
height: 52px; height: 52px;
box-sizing: border-box; box-sizing: border-box;
} }
li.title {
position: relative;
width: 100%;
padding-left: 72px;
padding-right: 52px;
height: 52px;
}
li.title .container {
position:relative;
height:52px;
}
li.title .text {
position: absolute;
top: 50%;
transform: translateY(-50%);
margin-top: auto;
margin-bottom: auto;
}
li.right {
top: 0;
right: 0;
margin: 4px;
pointer-events: all;
}
li.logo img { li.logo img {
display: block; display: block;
height: 100%; height: 100%;
@ -58,12 +85,10 @@ li.logo img {
height: 40px; height: 40px;
} }
li a,span { li a,.text {
display: block; display: block;
color: white; color: white;
text-align: center;
text-decoration: none; text-decoration: none;
line-height: 52px;
font-family: sans-serif; font-family: sans-serif;
} }
@ -78,10 +103,17 @@ li a.hover:hover {
body { body {
display: flex; display: flex;
flex-flow: column; flex-flow: column;
height: 100%;
margin: 0; margin: 0;
} }
/* prevent overscroll */
html,body {
position: fixed;
overflow: hidden;
width: 100vw;
height: 100vh;
}
iframe { iframe {
flex: 1 1 auto; flex: 1 1 auto;
border: 0; border: 0;
@ -93,7 +125,7 @@ iframe {
<body> <body>
<ul> <ul>
<li class="logo"><img src="pix/icon.png"></li> <li class="logo"><img src="pix/icon.png"></li>
<li><span><?php echo($expcontent->name); ?></span></li> <li class="title"><div class="container"><div class="text"><?php echo($expcontent->name); ?></div></div></li>
<li class="right"><a class="hover" href="javascript:history.back();"><i class="fas fa-times"></i></a></li> <li class="right"><a class="hover" href="javascript:history.back();"><i class="fas fa-times"></i></a></li>
</ul> </ul>
<iframe src='<?php echo($baseurl . "view-content/" . $expcontent->contentid . "?autoplay=true"); ?>' allow="autoplay; fullscreen"></iframe> <iframe src='<?php echo($baseurl . "view-content/" . $expcontent->contentid . "?autoplay=true"); ?>' allow="autoplay; fullscreen"></iframe>