Add acknowledgement part at end of page
Specifically for Australia or other location needing an acknowledgement
This commit is contained in:
@@ -15,6 +15,7 @@
|
|||||||
// Components
|
// Components
|
||||||
import Metas from '$components/Metas.svelte'
|
import Metas from '$components/Metas.svelte'
|
||||||
import PageTransition from '$components/PageTransition.svelte'
|
import PageTransition from '$components/PageTransition.svelte'
|
||||||
|
import Image from '$components/atoms/Image.svelte'
|
||||||
import Button from '$components/atoms/Button.svelte'
|
import Button from '$components/atoms/Button.svelte'
|
||||||
import IconEarth from '$components/atoms/IconEarth.svelte'
|
import IconEarth from '$components/atoms/IconEarth.svelte'
|
||||||
import House from '$components/molecules/House.svelte'
|
import House from '$components/molecules/House.svelte'
|
||||||
@@ -322,6 +323,19 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{/if}
|
{/if}
|
||||||
|
|
||||||
|
{#if location.acknowledgement}
|
||||||
|
<div class="acknowledgement">
|
||||||
|
<Image
|
||||||
|
class="flag"
|
||||||
|
id={location.country.flag.id}
|
||||||
|
sizeKey="square-small"
|
||||||
|
width={32} height={32}
|
||||||
|
alt="Flag of {location.country.name}"
|
||||||
|
/>
|
||||||
|
<p>{location.acknowledgement}</p>
|
||||||
|
</div>
|
||||||
|
{/if}
|
||||||
</section>
|
</section>
|
||||||
{:else}
|
{:else}
|
||||||
<div class="location-page__message">
|
<div class="location-page__message">
|
||||||
|
|||||||
@@ -44,8 +44,10 @@ export async function GET ({ params }: RequestEvent): Promise<RequestHandlerOutp
|
|||||||
country {
|
country {
|
||||||
name
|
name
|
||||||
slug
|
slug
|
||||||
|
flag { id }
|
||||||
}
|
}
|
||||||
has_poster
|
has_poster
|
||||||
|
acknowledgement
|
||||||
}
|
}
|
||||||
|
|
||||||
photos: photo (
|
photos: photo (
|
||||||
|
|||||||
@@ -235,6 +235,47 @@
|
|||||||
// Newsletter block
|
// Newsletter block
|
||||||
.grid-modules {
|
.grid-modules {
|
||||||
padding-bottom: 0;
|
padding-bottom: 0;
|
||||||
|
|
||||||
|
& + .acknowledgement {
|
||||||
|
margin-top: 48px;
|
||||||
|
|
||||||
|
@include bp (sm) {
|
||||||
|
margin-top: 72px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Acknowledgement
|
||||||
|
.acknowledgement {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
max-width: 720px;
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 0 20px;
|
||||||
|
text-align: left;
|
||||||
|
color: $color-text;
|
||||||
|
font-size: rem(10px);
|
||||||
|
line-height: 1.4;
|
||||||
|
|
||||||
|
@include bp (sm) {
|
||||||
|
padding: 0 24px;
|
||||||
|
font-size: rem(12px);
|
||||||
|
}
|
||||||
|
|
||||||
|
:global(.flag) {
|
||||||
|
flex-shrink: 0;
|
||||||
|
width: 32px;
|
||||||
|
height: 32px;
|
||||||
|
margin: 0 16px 0 0;
|
||||||
|
border-radius: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
:global(img) {
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user