More layout tweaks

This commit is contained in:
Pieter Vander Vennet 2024-06-18 17:55:47 +02:00
parent 8081f8da04
commit 6e276291f0
10 changed files with 55 additions and 15 deletions

View file

@ -1,17 +1,23 @@
<script lang="ts">
import Icon from "./Icon.svelte"
import { twMerge } from "tailwind-merge"
/**
* Renders a 'marker', which consists of multiple 'icons'
*/
export let icons: { icon: string; color: string }[]
/**
* Class which is applied onto the individual icons
*/
export let clss = ""
export let size = "w-full h-full"
</script>
{#if icons !== undefined && icons.length > 0}
<div class="relative h-full w-full">
<div class={twMerge("relative", size)}>
{#each icons as icon}
<div class="absolute top-0 left-0 h-full w-full">
<Icon icon={icon.icon} color={icon.color} />
<Icon icon={icon.icon} color={icon.color} {clss} />
</div>
{/each}
</div>