27 lines
723 B
Svelte
27 lines
723 B
Svelte
<script lang="ts">
|
|
import { Avatar } from "@skeletonlabs/skeleton";
|
|
export let name: string;
|
|
export let icon: string;
|
|
export let link: string;
|
|
</script>
|
|
|
|
<div class="grid grid-cols-1 sm:grid-cols-2 card p-4 bg-card-alt">
|
|
<Avatar class="w-fit md:w-24" alt="{name} Icon" src="{icon}" />
|
|
<p class="my-auto mx-auto p-2 fit-text-in-div font-bold text-center text-white">
|
|
<a href="{link}">{name}</a>
|
|
</p>
|
|
</div>
|
|
|
|
<style lang="postcss">
|
|
.bg-card-alt {
|
|
background-color: #1a202c;
|
|
}
|
|
|
|
.fit-text-in-div {
|
|
padding: 0;
|
|
font-size: 125%;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
</style> |