diff --git a/web/src/components/save/buttons/ClearButton.svelte b/web/src/components/save/buttons/ClearButton.svelte index 9962aa1b..4847a95a 100644 --- a/web/src/components/save/buttons/ClearButton.svelte +++ b/web/src/components/save/buttons/ClearButton.svelte @@ -1,12 +1,16 @@ <script> import { t } from "$lib/i18n/translations"; - import IconX from '@tabler/icons-svelte/IconX.svelte'; + import IconX from "@tabler/icons-svelte/IconX.svelte"; export let click; </script> -<button id="clear-button" on:click={click} aria-label={$t("a11y.save.clearInput")}> - <IconX color="var(--secondary)" size="16px"/> +<button + id="clear-button" + on:click={click} + aria-label={$t("a11y.save.clearInput")} +> + <IconX /> </button> <style> @@ -14,4 +18,12 @@ padding: 3px; border-radius: 100%; } + + #clear-button :global(svg) { + width: 16px; + height: 16px; + stroke-width: 2px; + stroke: var(--secondary); + will-change: transform; + } </style>