feat(RecipeCard): creado componente para la presentación de recetas

src/components/RecipeCard.vue

+<template>
+    <div class="card h-100 card-custom" style="max-width: 600px; flex-grow: 1;">
+        <div class="row g-0 h-100">
+            <div class="col-md-5 d-flex align-items-stretch">
+                <img 
+                src="/src/assets/default recipe.jpg"
+                class="img-fluid w-100 h-100 rounded-start"
+                style="object-fit: cover;"
+                alt="Imagen receta"
+                >
+            </div>
+            <div class="col-md-7 d-flex flex-column">
+                <div class="card-body flex-grow-1 d-flex flex-column">
+                    <div class="text-start">
+                        <h5 class="fw-bolder mb-2">Nombre de la receta</h5>
+                        <div class="d-flex small text-warning mb-2">
+                            <div class="bi-star-fill me-1"></div>
+                            <div class="bi-star-fill me-1"></div>
+                            <div class="bi-star-fill me-1"></div>
+                            <div class="bi-star-fill me-1"></div>
+                            <div class="bi-star-fill"></div>
+                        </div>
+                        <p class="fs-8">
+                            Auto-layout for flexbox grid columns also means you can set the width of one
+                            column and have the sibling columns automatically resize around it. You may use predefined grid classes.
+                        </p>
+                    </div>
+                </div>
+                <div class="card-footer border-top-0 bg-transparent">
+                    <a class="btn btn-more mt-auto me-2" href="#">Ver completa</a>
+                    <a class="btn btn-more mt-auto" title="Añadir a favoritos" href="#"><i class="bi bi-star"></i></a>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+
+<style scoped>
+.card-custom {
+    border-color: #793E6C;
+    box-shadow: 0 0 0 0.25rem rgba(121, 62, 108, 0.25); 
+}
+
+.btn-more {
+    border-color: #793E6C;
+    color: #793E6C;
+}
+
+.btn-more:hover {
+    background-color: #793E6C;
+    color: white;
+}
+</style>
\ No newline at end of file