Fix Footer responsive

This commit is contained in:
2021-10-18 14:50:58 +02:00
parent d9648f7513
commit 63e8edcbe8

View File

@@ -4,7 +4,8 @@
background-color: $color-primary-darker; background-color: $color-primary-darker;
padding: 40px 0; padding: 40px 0;
@include bp (sm) { @include bp (md) {
padding: 0;
height: 120px; height: 120px;
} }
@@ -18,14 +19,13 @@
&__title { &__title {
grid-column: span var(--columns); grid-column: span var(--columns);
grid-row: 1; grid-row: 1;
display: block;
margin-bottom: 40px; margin-bottom: 40px;
text-decoration: none; text-decoration: none;
@include bp (sm) { @include bp (sm) {
grid-column: 2 / span 5; grid-column: 2 / span 5;
grid-row: 1; grid-row: 1;
margin: 0; margin: auto 0;
} }
} }
@@ -50,6 +50,9 @@
margin-bottom: 16px; margin-bottom: 16px;
@include bp (sm) { @include bp (sm) {
margin: 0 12px;
}
@include bp (md) {
margin: 0 16px; margin: 0 16px;
} }
@@ -61,27 +64,46 @@
display: block; display: block;
color: #fff; color: #fff;
text-decoration: none; text-decoration: none;
font-size: rem(16px); font-size: rem(14px);
line-height: 1.3; line-height: 1.3;
font-weight: 300; font-weight: 300;
@include bp (md) {
font-size: rem(16px);
}
} }
svg { svg {
margin-right: 12px;
@include bp (md) {
margin-right: 16px; margin-right: 16px;
} }
} }
}
// Cetrucflotte logo
&__ctf { &__ctf {
grid-column: span var(--columns); grid-column: span var(--columns);
grid-row: 2; grid-row: 2;
margin-left: auto; margin-left: auto;
margin-top: auto; margin-top: auto;
max-width: 120px;
@include bp (sm) { @include bp (sm) {
grid-column: 19 / span 5; grid-column: 19 / span 5;
grid-row: 1; grid-row: 1;
max-width: 112px;
margin-top: 0; margin-top: 0;
} }
@include bp (md) {
max-width: 140px;
}
img {
display: block;
width: 100%;
height: auto;
}
span { span {
font-size: rem(12px); font-size: rem(12px);
color: $color-lilas-bright; color: $color-lilas-bright;