mirror of
https://github.com/wukko/cobalt.git
synced 2024-11-15 12:50:01 +00:00
web/DialogButton: add "link" buttons
This commit is contained in:
parent
fe1d17ba8d
commit
0b06299da0
2 changed files with 31 additions and 15 deletions
|
@ -23,7 +23,16 @@
|
||||||
onDestroy(() => clearInterval(interval));
|
onDestroy(() => clearInterval(interval));
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
{#if button.link}
|
||||||
|
<a
|
||||||
|
class="button elevated link-button"
|
||||||
|
class:color={button.color}
|
||||||
|
class:active={button.main}
|
||||||
|
href={button.link}
|
||||||
|
>
|
||||||
|
{button.text}
|
||||||
|
</a>
|
||||||
|
{:else}
|
||||||
<button
|
<button
|
||||||
class="button elevated popup-button {button.color}"
|
class="button elevated popup-button {button.color}"
|
||||||
class:color={button.color}
|
class:color={button.color}
|
||||||
|
@ -36,8 +45,14 @@
|
||||||
>
|
>
|
||||||
{button.text}{seconds ? ` (${seconds})` : ""}
|
{button.text}{seconds ? ` (${seconds})` : ""}
|
||||||
</button>
|
</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;
|
||||||
|
|
|
@ -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";
|
||||||
|
|
Loading…
Reference in a new issue