diff --git a/scripts/homepage.js b/scripts/homepage.js index 228feee..9f6b5f5 100644 --- a/scripts/homepage.js +++ b/scripts/homepage.js @@ -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'); }); diff --git a/styles/global.css b/styles/global.css index b731dd6..fd694fd 100644 --- a/styles/global.css +++ b/styles/global.css @@ -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 { @@ -321,4 +318,16 @@ em { #name { font-size: 3em; } +} + +@media (pointer: fine) and (hover: hover) { + body { + font-size: 16px; + } +} + +@media (pointer: coarse) and (hover: none) { + body { + font-size: 30px; + } } \ No newline at end of file