summaryrefslogtreecommitdiff
path: root/examples/framework-vue/src/components
diff options
context:
space:
mode:
authorGravatar Drew Powers <1369770+drwpow@users.noreply.github.com> 2021-11-22 13:38:53 -0700
committerGravatar GitHub <noreply@github.com> 2021-11-22 13:38:53 -0700
commitce8f8e06c0d79fbe44538a1d63c5bf3a79ba27ff (patch)
treecca0a8f06b680ceac2cbb347415d3ef88c4d4df8 /examples/framework-vue/src/components
parente49452325ce563ac7e46291d4654037075702316 (diff)
downloadastro-ce8f8e06c0d79fbe44538a1d63c5bf3a79ba27ff.tar.gz
astro-ce8f8e06c0d79fbe44538a1d63c5bf3a79ba27ff.tar.zst
astro-ce8f8e06c0d79fbe44538a1d63c5bf3a79ba27ff.zip
Clean up styling for framework-* examples (#1970)
Diffstat (limited to 'examples/framework-vue/src/components')
-rw-r--r--examples/framework-vue/src/components/Counter.vue15
1 files changed, 14 insertions, 1 deletions
diff --git a/examples/framework-vue/src/components/Counter.vue b/examples/framework-vue/src/components/Counter.vue
index 2703b8b9b..155717ea4 100644
--- a/examples/framework-vue/src/components/Counter.vue
+++ b/examples/framework-vue/src/components/Counter.vue
@@ -4,7 +4,7 @@
<pre>{{ count }}</pre>
<button @click="add()">+</button>
</div>
- <div class="children">
+ <div class="counter-message">
<slot />
</div>
</template>
@@ -25,3 +25,16 @@ export default {
},
};
</script>
+
+<style>
+.counter {
+ display: grid;
+ font-size: 2em;
+ grid-template-columns: repeat(3, minmax(0, 1fr));
+ margin-top: 2em;
+ place-items: center;
+}
+.counter-message {
+ text-align: center;
+}
+</style>