Skip to content
Snippets Groups Projects
Commit ce10331b authored by AustinPardosi's avatar AustinPardosi
Browse files

fix: reponsive navbar

parent 77370c8c
No related merge requests found
......@@ -100,6 +100,8 @@ li {
.navbar {
background-color: black;
overflow: hidden;
position: sticky;
top: 0;
display: flex;
justify-content: space-between;
align-items: center;
......@@ -143,32 +145,44 @@ li {
}
@media screen and (max-width: 800px) {
.mobile-view {
.navbar {
display: flex;
padding-top: 0.05rem;
padding-bottom: 0.05rem;
width: 100vw;
}
.nav-links a {
.logo {
padding-top: 5px;
padding-bottom: 5px;
}
.logo img {
display: none;
}
.hamburger-menu {
display: block;
cursor: pointer;
.logo h1 {
font-size: large;
}
.menu {
gap: 1rem;
}
.mobile-menu ul {
list-style: none;
.menu-item {
display: flex;
align-items: center;
}
.mobile-menu li {
margin: 10px 0px;
.menu-item a {
font-size: medium;
align-items: center;
}
.mobile-menu a {
text-decoration: none;
.menu-item#home {
display: none;
}
.mobile-menu.active .menu-item a {
display: block;
.reg-button {
font-size: medium;
padding: 3px 5px;
}
}
......@@ -28,7 +28,7 @@
</div>
<ul class='nav-links'>
<div class='menu'>
<li class='menu-item'><a href='/'>Home</a></li>
<li class='menu-item' id='home'><a href='/'>Home</a></li>
<li class='menu-item'><a href='/films'>Films</a></li>
<?php
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment