opensource/astro
1
0
Fork 0
mirror of https://github.com/withastro/astro.git synced 2025-07-29 23:14:21 +08:00
Code Issues Packages Projects Releases Wiki Activity

Use accessible indentation (#2253)

Browse Source
This commit is contained in:
Jonathan Neal
2021-12-22 16:11:05 -05:00
committed by GitHub
parent 305ce4182f
commit 6ddd7678ff
440 changed files with 21261 additions and 20879 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
examples/framework-vue/src/components/Counter.vue
View File

@ -1,40 +1,40 @@
<template>
<div class="counter">
<button @click="subtract()">-</button>
<pre>{{ count }}</pre>
<button @click="add()">+</button>
</div>
<div class="counter-message">
<slot />
</div>
<div class="counter">
<button @click="subtract()">-</button>
<pre>{{ count }}</pre>
<button @click="add()">+</button>
</div>
<div class="counter-message">
<slot />
</div>
</template>
<script>
import { ref } from 'vue';
export default {
setup() {
const count = ref(0);
const add = () => (count.value = count.value + 1);
const subtract = () => (count.value = count.value - 1);
setup() {
const count = ref(0);
const add = () => (count.value = count.value + 1);
const subtract = () => (count.value = count.value - 1);
return {
count,
add,
subtract,
};
},
return {
count,
add,
subtract,
};
},
};
</script>
<style>
.counter {
display: grid;
font-size: 2em;
grid-template-columns: repeat(3, minmax(0, 1fr));
margin-top: 2em;
place-items: center;
display: grid;
font-size: 2em;
grid-template-columns: repeat(3, minmax(0, 1fr));
margin-top: 2em;
place-items: center;
}
.counter-message {
text-align: center;
text-align: center;
}
</style>