make index page dynamic

Signed-off-by: nurRiyad <asadnurriyad@gmail.com>

components/TopicCard.vue

@@ -1,5 +1,20 @@
+<script setup lang="ts">
+const props = defineProps({
+  title: String,
+});
+
+const router = useRouter();
+
+const onClick = () => {
+  router.push(`/tags/${props.title}`);
+};
+</script>
+
 <template>
-  <div>
-    <topic-btn v-for="n in 7" :key="n" />
-  </div>
+  <button
+    @click="onClick"
+    class="bg-[#a2d9ff] px-2 py-1 m-2 transition hover:scale-105 rounded-md"
+  >
+    {{ title }}
+  </button>
 </template>