Hugging Face's logo

Spaces:
playingapi
/
cobalt
Sleeping

App Files Community
cobalt
File size: 1,556 Bytes 
43a06dc
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
 
<script lang="ts">
    import { onDestroy } from "svelte";
    import type { DialogButton } from "$lib/types/dialog";

    export let button: DialogButton;
    export let closeFunc: () => void;

    let disabled = false;
    let seconds = 0;

    if (button.timeout) {
        disabled = true;
        seconds = Math.round(button.timeout / 1000);

        let interval = setInterval(() => {
            seconds--;
            if (seconds <= 0) {
                clearInterval(interval);
                disabled = false;
            }
        }, 1000);

        onDestroy(() => clearInterval(interval));
    }
</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
        class="button elevated popup-button {button.color}"
        class:color={button.color}
        class:active={button.main}
        {disabled}
        on:click={async () => {
            await button.action();
            closeFunc();
        }}
    >
        {button.text}{seconds ? ` (${seconds})` : ""}
    </button>
{/if}
<style>
    .link-button {
        text-decoration: none;
        font-weight: 500;
        width: 100%;
    }

    .popup-button {
        width: 100%;
        height: 40px;
        transition: 0.2s opacity;
    }

    .popup-button.red {
        background-color: var(--red);
        color: var(--white);
    }

    .popup-button[disabled] {
        opacity: 0.6;
    }
</style>