39 lines
1014 B
Svelte
39 lines
1014 B
Svelte
<div class="container h-full mx-auto flex justify-center items-center flex-col">
|
|
<h1 class="my-3">Blackbird Chess</h1>
|
|
|
|
{#each alertsvar as alert, i}
|
|
<aside class="alert variant-filled-{alert.class}">
|
|
<!-- Icon -->
|
|
<div><i class="text-2xl icon icon-exclamation-triangle"></i></div>
|
|
<!-- Message -->
|
|
<p class="alert-message">{alert.text}</p>
|
|
<!-- Actions -->
|
|
<div class="alert-actions">
|
|
<i on:click={closeWarning} data-index={i} class="icon icon-close"></i>
|
|
</div>
|
|
</aside>
|
|
{/each}
|
|
|
|
<slot />
|
|
|
|
</div>
|
|
|
|
<style lang="scss">
|
|
|
|
</style>
|
|
|
|
<script lang="js">
|
|
import {alerts} from "$lib/stores.js";
|
|
|
|
let alertsvar;
|
|
function closeWarning(e) {
|
|
let index = e.target.dataset.index;
|
|
alerts.update(function (data) {
|
|
data.splice(index, 1)
|
|
return data;
|
|
})
|
|
}
|
|
alerts.subscribe((value) => {
|
|
alertsvar = value;
|
|
});
|
|
</script> |