Add latest issue part on Subscribe page and Create component for Issue

This commit is contained in:
2022-08-14 23:01:56 +02:00
parent 57f1dca240
commit 1163ba61f5
4 changed files with 110 additions and 38 deletions

View File

@@ -0,0 +1,33 @@
<style lang="scss">
@import "../../style/molecules/issue";
</style>
<script lang="ts">
import dayjs from 'dayjs'
import Image from '$components/atoms/Image.svelte'
export let title: string
export let issue: number
export let date: string
export let link: string
export let thumbnail: { id: string }
export let size: string = undefined
</script>
<div class="issue" class:is-large={size === 'large'}>
<a href={link} target="_blank" rel="external noopener" tabindex="0">
<Image
id={thumbnail.id}
sizeKey="issue-thumbnail-small"
width={160} height={112}
alt="Issue {issue} thumbnail"
/>
<dl>
<dt>Issue #{issue}</dt>
<dd>
<p>{title}</p>
<time>{dayjs(date).format('DD/MM/YYYY')}</time>
</dd>
</dl>
</a>
</div>