pixeldrain/fnx_web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix scrolling issues

Browse Source
This commit is contained in:
Wim Brand
2019-09-19 09:35:09 +02:00
parent 59ef838581
commit c8b9e3bb75
2 changed files with 47 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
res/static/style/layout.css
View File

@@ -51,9 +51,7 @@
}
/* Page rendering configuration */
html, body {
overflow: hidden;
}
body{
background-color: #0d0d0d; /* Fallback */
background-color: var(--body_color);
@@ -76,7 +74,8 @@ body{
}
.button_toggle_navigation {
position: absolute;
position: fixed;
backface-visibility: hidden;
z-index: 300;
top: 0;
left: 0;
@@ -89,7 +88,8 @@ body{
box-shadow: 2px 2px 8px -3px var(--shadow_color);
}
.page_navigation {
position: absolute;
position: fixed;
backface-visibility: hidden;
z-index: 100;
width: 250px;
height: 100%;
@@ -107,9 +107,8 @@ body{
.page_body {
position: absolute;
z-index: 200;
top: 0;
right: 0;
bottom: 0;
height: auto;
left: 250px;
min-width: 300px;
display: inline-block;

82
res/template/fragments/page_wrap.html
View File

@@ -1,52 +1,52 @@
{{define "page_top"}}
<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">
<!-- <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><!-- end page_wrapper -->
<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");
var nav = document.getElementById("page_navigation");
var body = document.getElementById("page_body");
function toggleMenu() {
if (nav.offsetLeft === 0) {
// Menu is visible
function toggleMenu() {
if (nav.offsetLeft === 0) {
// Menu is visible
nav.style.left = -nav.offsetWidth + "px";
body.style.left = "0";
} else {
// Menu is hidden
nav.style.left = -nav.offsetWidth + "px";
body.style.left = "0";
} else {
// Menu is hidden
nav.style.left = "0";
body.style.left = nav.offsetWidth + "px";
nav.style.left = "0";
body.style.left = nav.offsetWidth + "px";
}
}
}
</script>
{{end}}