nosotras page

components/CardCompany.vue

@@ -0,0 +1,46 @@
+<template>
+  <div
+    class="flex flex-col gap-4 rounded-3xl border-4 border-white min-h-64">
+    <div class="flex flex-col gap-4 p-8 items-center w-full">
+      <div v-if="image" class=" h-15 w-fit grayscale">
+        <img 
+          :src="`/img/${image.src}`"
+          :alt="image.alt"
+          class="w-full h-full object-cover"
+        />
+        <!-- <img v-else src="" alt="imagen-error"> -->
+        <!-- TODO: Add a fallback image -->
+      </div>
+      <div class="flex flex-col gap-4 items-center text-center">
+        <p class="text-center text-base" v-html="description"></p>
+          <NuxtLink v-if="link" :to="link.url">
+            <p class="text-button hover:text-button-hover">{{ link.label }}</p>
+          </NuxtLink>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+    description: {
+        type: String,
+        default: ''
+    },
+    image: {
+        type: Object,
+        default: null,
+    },
+    link: {
+        type: String,
+        default: null
+    },
+  },
+  computed: {
+    langcode() {
+      return this.$store.getters.langcode;
+    },
+  },
+}
+</script>