janishutz-website/old-website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

mobile optimisation

Browse Source
This commit is contained in:
janis
2023-01-06 15:42:44 +01:00
parent 2c0c829f8e
commit 16524c843f
5 changed files with 198 additions and 106 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
ui/menu.html
View File

@@ -8,6 +8,9 @@
<body>
<div class="Menu">
<a href="/"><img src="/assets/Logo.png" class="logo"></a>
<div class="toggle-wrapper">
<a class="listtoggle" onclick="togglelist()">&#9776</a>
</div>
<ul class="menu-container">
<li class="mainitems"><a class="menubutton" id="home" href="/">Home</a></li>
<li class="dropdown mainitems">
@@ -37,5 +40,22 @@
<li class="mainitems"><a class="menubutton" id="support" href="/support">Support</a></li>
</ul>
</div>
<h3 style="text-align: center;">Note: This page is not yet optimised for mobile devices / vertical aspect ratios! Also, the backend is not yet running, so you cannot visit any other pages!</h3>
<script>
let previous = 1;
function togglelist() {
$( '.menu-container' ).slideToggle(300);
$( '.listtoggle' ).toggleClass( 'active' );
}
window.addEventListener( 'resize', function( event ) {
if ( $(window).width() > 999 ) {
$( '.menu-container' ).slideDown();
previous = 1;
} else if ( $(window).width() < 999 && previous == 1 ) {
$( '.menu-container' ).slideUp();
$( '.listtoggle' ).removeClass( 'active' );
previous = 0;
};
}, true);
</script>
</body>