flayks/housesof
2
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Fix Locations continents filters centering and sizing

Browse Source
This commit is contained in:
Félix Péault
2021-10-19 17:30:31 +02:00
parent a73c0e11a3
commit 8810dfb197
2 changed files with 14 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/style/molecules/_location.scss
View File

@@ -8,10 +8,10 @@
a {
display: flex;
align-items: center;
text-decoration: none;
@include bp (sm) {
align-items: center;
flex-direction: column;
justify-content: center;
padding: 24px;
@@ -55,11 +55,12 @@
&__flag {
img {
display: block;
margin: 0 auto;
margin: 2px auto 0;
border-radius: 100%;
margin-right: 24px;
@include bp (sm) {
margin-top: 0;
margin-right: 0;
}
}
@@ -78,6 +79,9 @@
@include bp (sm) {
margin: 20px 0 8px;
font-size: rem(40px);
}
@include bp (sd) {
font-size: rem(48px);
}
}

14
src/style/organisms/_locations.scss
View File

@@ -1,6 +1,5 @@
.browse {
margin: 96px 0;
text-align: center;
@include bp (sm) {
margin-bottom: 128px;
@@ -25,10 +24,9 @@
// Continents
&__continents {
display: inline-flex;
display: flex;
justify-content: center;
text-align: center;
margin: 0 auto;
pointer-events: none;
&:hover {
li {
@@ -38,6 +36,7 @@
li {
display: block;
margin: 0 8px;
pointer-events: auto;
transition: opacity 0.6s var(--ease-quart);
&:hover {
@@ -64,7 +63,7 @@
justify-content: center;
grid-gap: 24px 24px;
width: 85%;
padding: 0;
padding: 0 24px;
}
@include bp (sm) {
display: flex;
@@ -72,6 +71,9 @@
width: 100%;
margin-top: 104px;
}
@include bp (sd) {
padding: 0;
}
li {
display: block;
@@ -80,7 +82,7 @@
@include bp (mob-lg) {
margin-bottom: 0;
}
@include bp (sm) {
@include bp (sd) {
margin: 0 22px 56px;
}
}