fix(Vue-trello): implement simple button with tailwind.css

sabertazimi · Sep 26, 2021 · 00caeb2 · 00caeb2
1 parent 6f4d515
commit 00caeb2
Showing 1 changed file with 8 additions and 2 deletions.
diff --git a/packages/vue-trello/src/components/HelloWorld.vue b/packages/vue-trello/src/components/HelloWorld.vue
@@ -6,8 +6,14 @@ const count = ref(0);
 </script>
 
 <template>
-  <h1>{{ msg }}</h1>
-  <button type="button" @click="count++">count is: {{ count }}</button>
+  <h1 class="text-5xl font-bold">{{ msg }}</h1>
+  <button
+    class="m-3 px-5 py-3 bg-green-500 text-white rounded-3xl hover:bg-green-400"
+    type="button"
+    @click="count++"
+  >
+    count is: {{ count }}
+  </button>
   <p>
     Edit<code>components/HelloWorld.vue</code> to test hot module replacement.
   </p>