Fix Error page styles and ListCTAs

This commit is contained in:
2022-06-24 11:55:39 +02:00
parent 9913c1d7d9
commit b46df04258
4 changed files with 43 additions and 26 deletions

View File

@@ -5,6 +5,10 @@
justify-content: center;
}
:global(li) {
display: block;
}
& > :global(*) {
margin: 20px auto 0;

View File

@@ -1,5 +1,5 @@
<style lang="scss">
@import "../style/pages/shop";
@import "../style/pages/error";
</style>
<script lang="ts">
@@ -43,24 +43,30 @@
/>
<ListCTAs>
<BoxCTA
url="{$page.url.pathname}#locations"
icon="globe"
label="Discover locations"
alt="Globe"
/>
<BoxCTA
url="/photos"
icon="photos"
label="Browse all photos"
alt="Photos"
/>
<BoxCTA
url="/shop"
icon="bag"
label="Shop our products"
alt="Shopping bag"
/>
<li>
<BoxCTA
url="{$page.url.pathname}#locations"
icon="globe"
label="Discover locations"
alt="Globe"
/>
</li>
<li>
<BoxCTA
url="/photos"
icon="photos"
label="Browse all photos"
alt="Photos"
/>
</li>
<li>
<BoxCTA
url="/shop"
icon="bag"
label="Shop our products"
alt="Shopping bag"
/>
</li>
</ListCTAs>
</div>

View File

@@ -8,7 +8,7 @@
}
// Heading
.heading {
:global(.heading) {
padding: 0 24px;
margin-bottom: 40px;
@@ -16,7 +16,7 @@
margin-bottom: 72px;
}
p {
:global(p) {
@include bp (sm, max) {
max-width: 480px;
}
@@ -24,3 +24,14 @@
}
}
}
:global(.page-error) {
// Globe
:global(.globe) {
margin-top: 96px;
@include bp (sm) {
margin-top: 156px;
}
}
}

View File

@@ -91,8 +91,8 @@
// CTAS
&__ctas {
text-align: center;
margin-bottom: 96px;
text-align: center;
@include bp (sm) {
margin-bottom: 160px;
@@ -106,10 +106,6 @@
margin-top: 72px;
}
}
li {
display: block;
}
}
// World title