This repository has been archived on 2024-08-06. You can view files and clone it, but you cannot make any changes to it's state, such as pushing and creating new issues, pull requests or comments.
chellaris-sign-up-site/src/lib/components/ModalExample.svelte

49 lines
No EOL
1 KiB
Svelte

<script lang="ts">
import Modal from "$lib/components/Modal.svelte";
export let showSettings: boolean;
const toggleSettings = () => {
showSettings = !showSettings;
}
const handleSubmit = () => {
console.log("submitted ", gameGroupSettings);
}
let gameGroupSettings: [] = [];
</script>
<Modal showModal={showSettings} on:click={toggleSettings}>
<h3>Settings</h3>
<div class="settings-modal">
<form on:submit|preventDefault={handleSubmit}>
<b>Show Game Groups:</b><br>
<input type="checkbox" bind:group={gameGroupSettings} value="a">Group A<br>
<input type="checkbox" bind:group={gameGroupSettings} value="b">Group B<br>
<input type="checkbox" bind:group={gameGroupSettings} value="-">Ungrouped<br>
<div class="settings-modal-save">
<button>Save</button>
</div>
</form>
</div>
</Modal>
<style>
.settings-modal {
text-align: left;
}
.settings-modal input {
margin-left: 1rem;
}
.settings-modal-save {
text-align: center;
}
</style>