forked from MapComplete/MapComplete
More layout tweaks
This commit is contained in:
parent
8081f8da04
commit
6e276291f0
10 changed files with 55 additions and 15 deletions
|
@ -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>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue