Mirrors/cobalt
1
0
Fork 0
mirror of https://github.com/wukko/cobalt.git synced 2024-11-15 04:39:58 +00:00
Code Issues Projects Releases Packages Wiki Activity

web/DialogButton: add "link" buttons

Browse source
This commit is contained in:
dumbmoron 2024-10-12 17:36:28 +00:00
parent fe1d17ba8d
commit 0b06299da0
No known key found for this signature in database
2 changed files with 31 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

43
web/src/components/dialog/DialogButton.svelte
View file

@ -23,21 +23,36 @@
onDestroy(() => clearInterval(interval)); onDestroy(() => clearInterval(interval));
} }
</script> </script>
{#if button.link}
<button <a
class="button elevated popup-button {button.color}" class="button elevated link-button"
class:color={button.color} class:color={button.color}
class:active={button.main} class:active={button.main}
{disabled} href={button.link}
on:click={async () => { >
await button.action(); {button.text}
closeFunc(); </a>
}} {:else}
> <button
{button.text}{seconds ? ` (${seconds})` : ""} class="button elevated popup-button {button.color}"
</button> class:color={button.color}
class:active={button.main}
{disabled}
on:click={async () => {
await button.action();
closeFunc();
}}
>
{button.text}{seconds ? ` (${seconds})` : ""}
</button>
{/if}
<style> <style>
.link-button {
text-decoration: none;
font-weight: 500;
width: 100%;
}
.popup-button { .popup-button {
width: 100%; width: 100%;
height: 40px; height: 40px;

3
web/src/lib/types/dialog.ts
View file

@ -6,7 +6,8 @@ export type DialogButton = {
color?: "red", color?: "red",
main: boolean, main: boolean,
timeout?: number, // milliseconds timeout?: number, // milliseconds
action: () => unknown | Promise<unknown> action: () => unknown | Promise<unknown>,
link?: string
} }
export type SmallDialogIcons = "warn-red"; export type SmallDialogIcons = "warn-red";