You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
triangles.fun/src/Components/LevelButton.svelte

27 lines
579 B

<script>
import { completed } from "../store.js"
export let i
export let level
</script>
<style>
.completed {
@apply text-blue-darker;
}
.active {
@apply bg-blue-lighter text-blue-darker border-blue;
}
.active:not(.completed) {
@apply text-gray-lighter;
}
</style>
<button
class="block py-2 rounded border-0 border-b-2 border-gray-darker bg-gray-lighter flex-1 text-center text-gray active:text-blue-lighter active:bg-gray-darker"
on:click
value={i}
class:completed={$completed.includes(i)}
class:active={level == i}>{i + 1}</button>