Fixed mobile vs desktop styling

This commit is contained in:
Notoric 2024-05-23 04:02:22 +01:00
parent 885b7087ff
commit c25e443c4d
2 changed files with 19 additions and 10 deletions

View File

@ -1,8 +1,8 @@
const menu = document.getElementById('menu');
const navbtn = document.getElementById('nav-btn');
menu.addEventListener('click', () => {
const header = document.getElementById('header');
header.classList.toggle('expanded');
menu.classList.toggle('expanded');
navbtn.addEventListener('click', () => {
const navbar = document.getElementById('navbar');
navbar.classList.toggle('expanded');
navbtn.classList.toggle('expanded');
});

View File

@ -207,10 +207,6 @@ em {
display: none;
}
body {
font-size: 30px;
}
#nav-btn {
content: "";
display: block;
@ -226,6 +222,7 @@ em {
width: 0.6em;
padding: 0px;
transition: transform 0.5s ease;
cursor: pointer;
}
body::before {
@ -306,7 +303,7 @@ em {
#homepage-text {
text-align: center;
max-width: 550px;
max-width: 20em;
}
#homepage-img {
@ -322,3 +319,15 @@ em {
font-size: 3em;
}
}
@media (pointer: fine) and (hover: hover) {
body {
font-size: 16px;
}
}
@media (pointer: coarse) and (hover: none) {
body {
font-size: 30px;
}
}