feat: debut d'un front vue.js + ajout de cursorrules

assets/vue/app/domain/manga/presentation/components/MangaCard.vue

@@ -0,0 +1,49 @@
+<template>
+  <div 
+    class="bg-white rounded-lg shadow-md overflow-hidden cursor-pointer transition-transform hover:scale-105"
+    @click="handleClick"
+  >
+    <div class="relative pb-[150%]">
+      <img
+        :src="manga.imageUrl || 'https://via.placeholder.com/300x400'"
+        :alt="manga.title"
+        class="absolute inset-0 w-full h-full object-contain bg-gray-100"
+      />
+    </div>
+    <div class="p-2">
+      <h3 class="text-lg font-semibold text-gray-800 mb-1">{{ manga.title }}</h3>
+      <div class="flex items-center">
+        <span class="text-sm text-gray-500">{{ manga.publicationYear }}</span>
+      </div>
+      <div class="mt-1 text-sm text-gray-500">
+        Added: {{ formatDate(manga.createdAt) }}
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { useRouter } from 'vue-router';
+
+const router = useRouter();
+
+const props = defineProps({
+  manga: {
+    type: Object,
+    required: true
+  }
+});
+
+const handleClick = () => {
+  router.push(`/manga/${props.manga.slug}`);
+};
+
+const formatDate = (dateString) => {
+  const date = new Date(dateString);
+  return date.toLocaleDateString('en-US', {
+    month: 'short',
+    day: 'numeric',
+    year: 'numeric'
+  });
+};
+</script>