Commit d1f61e1f authored by Jonas Heinrich's avatar Jonas Heinrich

added burger menu, switched media query logic

parent 6ba729e1
......@@ -9,14 +9,12 @@ body {
.container {
height:100vh;
display: grid;
grid-template-rows: 80px 85px 300px 1fr;
grid-template-columns: 100%;
grid-template-rows: 80px 1fr;
grid-template-columns: 50% 50%;
grid-row-gap: 0px;
grid-template-areas:
"logo"
"navigation"
"map"
"content"
"logo navigation"
"map content"
;
}
......@@ -28,37 +26,16 @@ navigation {
content {
background: #142736;
}
@media screen and (min-width: 44.001em) {
.container {
height:100vh;
display: grid;
grid-template-rows: 80px 1fr;
grid-template-columns: 50% 50%;
grid-row-gap: 0px;
grid-template-areas:
"logo navigation"
"map content"
;
}
navigation {
display: block;
}
content {
overflow-y: auto;
}
overflow-y: scroll;
}
logo {
background: white;
padding: 10px;
}
.logo {
padding: 10px;
.burger_menu {
display: none;
}
navigation ul li {
......@@ -98,3 +75,33 @@ h2 {
padding-top: 5px;
padding-bottom: 5px;
}
@media screen and (max-width: 44.001em) {
.container {
height:100vh;
display: grid;
grid-template-rows: 80px 85px 300px 1fr;
grid-template-columns: 100%;
grid-row-gap: 0px;
grid-template-areas:
"logo"
"navigation"
"map"
"content"
;
}
content {
overflow-y: inherit;
}
.burger_menu {
display: block;
float:right;
width: 30px;
height: 25px;
margin: 18px;
}
}
......@@ -14,6 +14,7 @@
<div class="container">
<logo>
<img class="logo" src=images/logo.png>
<img class="burger_menu" id="burger_menu" src=images/menu.png>
</logo>
<navigation>
<ul>
......
Markdown is supported
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