33 lines
656 B
Svelte
33 lines
656 B
Svelte
|
<script lang="ts">
|
||
|
|
import {
|
||
|
|
Card,
|
||
|
|
CardBody,
|
||
|
|
CardText,
|
||
|
|
CardTitle,
|
||
|
|
} from "@sveltestrap/sveltestrap";
|
||
|
|
|
||
|
|
export let image: string;
|
||
|
|
export let alt: string;
|
||
|
|
export let title: string;
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<div class="col">
|
||
|
|
<Card>
|
||
|
|
<picture class="card-img-top">
|
||
|
|
<source
|
||
|
|
srcset="/previews/{image}-light.webp"
|
||
|
|
media="(prefers-color-scheme: light)"
|
||
|
|
/>
|
||
|
|
<source
|
||
|
|
srcset="/previews/{image}-dark.webp"
|
||
|
|
media="(prefers-color-scheme: dark)"
|
||
|
|
/>
|
||
|
|
<img class="card-img-top" src="/previews/{image}-light.webp" {alt} />
|
||
|
|
</picture>
|
||
|
|
<CardBody>
|
||
|
|
<CardTitle>{title}</CardTitle>
|
||
|
|
<CardText><slot /></CardText>
|
||
|
|
</CardBody>
|
||
|
|
</Card>
|
||
|
|
</div>
|