Switch to AddLarge; blur button on click

main
kts of kettek 2024-02-22 00:53:45 -08:00
parent 48bf5299c1
commit f7bde185a4
1 changed files with 4 additions and 2 deletions

View File

@ -1,6 +1,6 @@
<script lang='ts'>
import { Button } from "carbon-components-svelte";
import { Add, ColorSwitch } from "carbon-icons-svelte";
import { AddLarge, ColorSwitch } from "carbon-icons-svelte";
import { ReplaceSwatchUndoable, type LoadedFile, AddSwatchUndoable } from "../types/file";
import { createEventDispatcher } from "svelte";
@ -22,11 +22,13 @@
function addSwatch() {
file.push(new AddSwatchUndoable(red, green, blue, alpha))
dispatch('refresh', {})
;(document.activeElement as HTMLElement).blur()
}
function replaceSwatch() {
file.push(new ReplaceSwatchUndoable(index, red, green, blue, alpha))
dispatch('refresh', {})
;(document.activeElement as HTMLElement).blur()
}
</script>
@ -35,7 +37,7 @@
<div class="label" style="color: rgb({255-red}, {255-green}, {255-blue})">{index}</div>
</div>
<Button kind="ghost" size="small" disabled={swatchExists} iconDescription="replace swatch" tooltipPosition="top" icon={ColorSwitch} on:click={replaceSwatch}></Button>
<Button kind="ghost" size="small" disabled={swatchExists} iconDescription="add swatch" tooltipPosition="top" icon={Add} on:click={addSwatch}></Button>
<Button kind="ghost" size="small" disabled={swatchExists} iconDescription="add swatch" tooltipPosition="top" icon={AddLarge} on:click={addSwatch}></Button>
</main>
<style>