Fix style and responsive issues

This commit is contained in:
2021-12-14 23:19:46 +01:00
parent 2f7082fd9d
commit ac03348349
10 changed files with 45 additions and 69 deletions

View File

@@ -10,15 +10,17 @@
}
.container {
align-items: center;
justify-content: center;
height: 100%;
@include bp (sm) {
align-items: center;
}
}
// Site title
&__title {
grid-column: span var(--columns);
grid-row: 1;
grid-column: 1 / span 4;
display: block;
margin-bottom: 40px;
text-decoration: none;
@@ -43,12 +45,14 @@
// Links
&__links {
grid-column: span var(--columns);
grid-row: 2;
grid-column: 5 / span 3;
margin-left: auto;
@include bp (sm) {
grid-column: 5 / span 16;
grid-column: 5 / span 19;
grid-row: 1;
margin-left: auto;
margin-top: 0.15em;
}
ul {
@@ -100,6 +104,8 @@
position: relative;
}
svg {
width: 1.2em;
height: auto;
transition: color 0.35s;
}
@@ -111,34 +117,4 @@
}
}
}
// Cetrucflotte logo
&__ctf {
grid-column: span var(--columns);
grid-row: 2;
margin-left: auto;
margin-top: auto;
max-width: 120px;
@include bp (sm) {
grid-column: 19 / span 5;
grid-row: 1;
max-width: 112px;
margin-top: 0;
}
@include bp (md) {
max-width: 140px;
}
img {
display: block;
width: 100%;
height: auto;
}
span {
font-size: rem(12px);
color: $color-lilas-bright;
margin-right: 24px;
}
}
}