blob: 1353736aaab7a6da27f3c1455a96ccc79ae83f98 (
plain) (
blame)
| 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
 | <script lang="ts">
	let count = 0;
	function add() {
		count += 1;
	}
	function subtract() {
		count -= 1;
	}
</script>
<div class="counter">
	<button on:click={subtract}>-</button>
	<pre>{count}</pre>
	<button on:click={add}>+</button>
</div>
<div class="message">
	<slot />
</div>
<style>
	.counter {
		display: grid;
		font-size: 2em;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		margin-top: 2em;
		place-items: center;
	}
	.message {
		text-align: center;
	}
</style>
 |