diff --git a/resources/css/navbar.css b/resources/css/navbar.css index 896face..eca2933 100644 --- a/resources/css/navbar.css +++ b/resources/css/navbar.css @@ -58,3 +58,20 @@ display: inline-block; z-index: 1; } +.fa-bars { + display: none!important; +} +@media screen and (min-width:0px) and (max-width:1000px) { + .fa-bars { + margin: 10px 0 0 10px!important; + display: block!important; + } + .navigation li{ + display: none; + background-color: #101012; + } + .navigation .fa-bars:hover + ul li, .navigation ul:hover li { + display: block!important; + width: 100%; + } +} diff --git a/resources/js/insertNavbar.js b/resources/js/insertNavbar.js index 85027c4..d13bd5a 100644 --- a/resources/js/insertNavbar.js +++ b/resources/js/insertNavbar.js @@ -10,11 +10,16 @@ navbarList.className = "navbarList" navigation.appendChild(navbarList) document.body.appendChild(navigation) -// opacity +// Opacity var opacity = c("div") opacity.className = "opacityMenu lowerIndex menu" document.body.appendChild(opacity) +// Hamburger Menu +var hamburger = c("i") +hamburger.className = "fas fa-bars fa-2x" +navigation.prepend(hamburger) + // Search var search = c("input") search.className = "searchMove searchBar"