cobalt/web/src/components/settings/DataSettingsButton.svelte

33 lines
639 B
Svelte

<script lang="ts">
export let id: string;
export let click: () => void;
export let danger = false;
</script>
<button {id} class="button data-button" class:danger on:click={click}>
<slot></slot>
</button>
<style>
.data-button {
padding: 8px 14px;
width: max-content;
text-align: start;
}
.data-button :global(svg) {
stroke-width: 1.8px;
height: 21px;
width: 21px;
}
.data-button.danger {
background-color: var(--red);
color: var(--white);
}
.data-button.danger:hover {
background-color: var(--dark-red);
}
</style>