Support icons for buttons

This commit is contained in:
Alessandro Pignotti 2024-10-18 12:12:14 +02:00
parent 51b63329ab
commit aa1935e389

View File

@ -6,11 +6,14 @@
export let bgColor = "bg-neutral-700"; export let bgColor = "bg-neutral-700";
export let hoverColor = "hover:bg-neutral-500" export let hoverColor = "hover:bg-neutral-500"
export let buttonImage = null; export let buttonImage = null;
export let buttonIcon = null;
export let buttonText; export let buttonText;
</script> </script>
<a href={clickUrl} target="_blank" on:click={clickHandler} on:contextmenu={rightClickHandler}><p class="flex flex-row items-center {bgColor} p-2 rounded-md shadow-md shadow-neutral-900 {(clickUrl != null || clickHandler != null) ? `${hoverColor} cursor-pointer` : ""}" title={buttonTooltip}> <a href={clickUrl} target="_blank" on:click={clickHandler} on:contextmenu={rightClickHandler}><p class="flex flex-row items-center {bgColor} p-2 rounded-md shadow-md shadow-neutral-900 {(clickUrl != null || clickHandler != null) ? `${hoverColor} cursor-pointer` : ""}" title={buttonTooltip}>
{#if buttonImage} {#if buttonImage}
<img src={buttonImage} class="inline w-8 h-8"/> <img src={buttonImage} class="inline w-8 h-8"/>
{:else if buttonIcon}
<i class="w-8 {buttonIcon} text-center" style="font-size: 2em;"></i>
{/if} {/if}
<span class="ml-1">{buttonText}</span><slot></slot></p></a> <span class="ml-1">{buttonText}</span><slot></slot></p></a>