diff --git a/index-logged-in.html b/index-logged-in.html index 0d22705..8658b34 100644 --- a/index-logged-in.html +++ b/index-logged-in.html @@ -1,6 +1,7 @@ + LUGA — Linux User Group Austria diff --git a/index.html b/index.html index 94a988b..125ee8c 100644 --- a/index.html +++ b/index.html @@ -1,7 +1,7 @@ - + LUGA — Linux User Group Austria diff --git a/luga.css b/luga.css index 959c953..a033be6 100644 --- a/luga.css +++ b/luga.css @@ -47,11 +47,11 @@ header { } -@media only screen and (max-width: 65rem) { +@media only screen and (min-width: 40rem) and (max-width: 65rem) { body { display: grid; grid-template-columns: 13rem auto; - grid-template-rows: 3rem auto auto auto auto; + grid-template-rows: auto auto auto auto auto; } #logo { @@ -82,6 +82,48 @@ header { } +@media only screen and (max-width: 40rem) { + body { + display: grid; + grid-template-columns: 3rem auto; + grid-template-rows: auto auto auto auto auto; + } + + #logo { + grid-column: 1; + grid-row: 1 / span 2; + height: 3rem; + } + + header { + grid-column: 2; + grid-row: 1; + } + + nav { + grid-column: 1; + grid-row: 3; + overflow: hidden; + } + + nav:hover { + overflow: visible; + z-index: 1; + } + + main { + grid-column: 2; + grid-row: 2 / span 3; + } + + footer { + grid-column: 1 / span 2; + grid-row: 5; + text-align: left; + } + +} + nav a { color: #008; text-decoration: none; @@ -152,6 +194,7 @@ nav { nav ul { list-style-type: none; padding-left: 0.7em; + background-color: var(--yellow-light); } footer ul { diff --git a/veranstaltungen.html b/veranstaltungen.html index e1ed8a2..a91ddfc 100644 --- a/veranstaltungen.html +++ b/veranstaltungen.html @@ -1,7 +1,7 @@ - + LUGA — Veranstaltungen