Fix for scrolling past content on mobile devices

This commit is contained in:
2019-09-18 23:17:12 +02:00
parent c2db60746c
commit 59ef838581
3 changed files with 41 additions and 36 deletions

View File

@@ -51,9 +51,9 @@
}
/* Page rendering configuration */
html{height: 100%;}
html, body {
overflow: hidden;
}
body{
background-color: #0d0d0d; /* Fallback */
background-color: var(--body_color);
@@ -61,14 +61,19 @@ body{
font-family: 'Ubuntu';
margin: 0;
line-height: 1.5em;
overflow-x: hidden;
color: #bfbfbf; /* Fallback */
color: var(--text_color);
box-sizing: border-box;
padding: 0;
}
/* Page layout elements */
.page_wrapper {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
}
.button_toggle_navigation {
position: absolute;
@@ -87,8 +92,7 @@ body{
position: absolute;
z-index: 100;
width: 250px;
top: 0;
bottom: 0;
height: 100%;
left: 0;
float: left;
background-color: var(--layer_1_color);

View File

@@ -1,7 +1,7 @@
{{define "meta_tags"}}
<title>{{.}} ~ PixelDrain</title>
<meta charset="UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1"/>
<link rel="stylesheet" href="/res/style/layout.css?v2"/>
<link rel="shortcut icon" href="/res/img/tray32.png"/>
<meta name="theme-color" content="#75AD38"/>

View File

@@ -1,35 +1,36 @@
{{define "page_top"}}
<button id="button_toggle_navigation" class="button_toggle_navigation" onclick="toggleMenu();"></button>
<div id="page_navigation" class="page_navigation">
<a href="/">Home</a>
<hr/>
{{if .Authenticated}}<a href="/user">{{.Username}}</a>
<a href="/user/files">My Files</a>
<a href="/user/lists">My Lists</a>
<a href="/logout">Log out</a>
{{else}}
<a href="/login">Login</a>
<a href="/register">Register</a>
<a href="/history">Upload History</a>
{{end}}
<hr/>
<a href="/about">About</a>
<!--<a href="/technology">Technology</a>-->
<a href="/api">API</a>
<a href="/appearance">Appearance</a>
</div>
<div id="page_body" class="page_body">
<div id="page_wrapper">
<button id="button_toggle_navigation" class="button_toggle_navigation" onclick="toggleMenu();"></button>
<div id="page_navigation" class="page_navigation">
<a href="/">Home</a>
<hr/>
{{if .Authenticated}}<a href="/user">{{.Username}}</a>
<a href="/user/files">My Files</a>
<a href="/user/lists">My Lists</a>
<a href="/logout">Log out</a>
{{else}}
<a href="/login">Login</a>
<a href="/register">Register</a>
<a href="/history">Upload History</a>
{{end}}
<hr/>
<a href="/about">About</a>
<!--<a href="/technology">Technology</a>-->
<a href="/api">API</a>
<a href="/appearance">Appearance</a>
</div>
<div id="page_body" class="page_body">
{{end}}
{{define "page_bottom"}}
<div class="highlight_dark">
Pixeldrain is a product by <a href="//fornaxian.com" target="_blank">Fornaxian Technologies</a> |
Twitter:&nbsp;<a href="https://twitter.com/Fornax96" target="_blank">@Fornax96</a>
Reddit:&nbsp;<a href="https://reddit.com/r/pixeldrain" target="_blank">/r/pixeldrain</a>
Medium:&nbsp;<a href="https://medium.com/pixeldrain" target="_blank">Pixeldrain</a>
</div>
</div><!-- end page_body -->
<div class="highlight_dark">
Pixeldrain is a product by <a href="//fornaxian.com" target="_blank">Fornaxian Technologies</a> |
Twitter:&nbsp;<a href="https://twitter.com/Fornax96" target="_blank">@Fornax96</a>
Reddit:&nbsp;<a href="https://reddit.com/r/pixeldrain" target="_blank">/r/pixeldrain</a>
Medium:&nbsp;<a href="https://medium.com/pixeldrain" target="_blank">Pixeldrain</a>
</div>
</div><!-- end page_body -->
</div><!-- end page_wrapper -->
<script>
var nav = document.getElementById("page_navigation");
var body = document.getElementById("page_body");