fix: prevent fixed footer on mobile landscape view

This commit is contained in:
Sebin Nyshkim 2022-01-11 23:17:25 +01:00
parent bdb5aae137
commit ca184b9e9f

View file

@ -9,7 +9,9 @@
<navigation :routes="routes" /> <navigation :routes="routes" />
</header> </header>
<router-view /> <main>
<router-view />
</main>
<footer class="footer"> <footer class="footer">
<div class="footer__copyright"> <div class="footer__copyright">
@ -74,7 +76,7 @@ export default {
@import "~normalize.css"; @import "~normalize.css";
#app { #app {
padding: 5em 0 7em 0; padding: 5em 0 0 0;
color: $copy-color; color: $copy-color;
font-size: 1.125em; font-size: 1.125em;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
@ -85,6 +87,10 @@ export default {
font-size: 1.25em; font-size: 1.25em;
} }
@media (min-width: 60em) {
padding: 5em 0 7em 0;
}
@include mq-bigscreen { @include mq-bigscreen {
font-size: 1.5em; font-size: 1.5em;
} }
@ -126,10 +132,6 @@ header {
} }
.footer { .footer {
position: fixed;
bottom: 0;
left: 0;
right: 0;
padding: 0.75em 0; padding: 0.75em 0;
background-color: $bg-color-light; background-color: $bg-color-light;
text-align: center; text-align: center;
@ -142,6 +144,13 @@ header {
padding: 0.75em 0; padding: 0.75em 0;
} }
@media (min-width: 60em) {
position: fixed;
bottom: 0;
left: 0;
right: 0;
}
&__copyright { &__copyright {
margin: 0; margin: 0;
} }