feat(i18n): deprecate Spanish language support in the frontend

frontend/src/views/creators/CreatorLogo.vue

@@ -1,78 +1,92 @@
 <template>
-  <div class="relative" @mouseenter="showTint = isCurrentCreator" @mouseleave="showTint = false"
-    @click="isCurrentCreator && openBannerEditor()">
+    <div
+        class="relative"
+        @click="isCurrentCreator && openBannerEditor()"
+        @mouseenter="showTint = isCurrentCreator"
+        @mouseleave="showTint = false"
+    >
+        <div class="size-[110px] rounded-full border-4 border-hPrimary">
+            <img
+                :alt="t('logoAlt')"
+                :src="brandingStore.value?.portraitUrl ?? '/images/placeholders/profile.png'"
+                class="rounded-full"
+                height="110px"
+                width="110px"
+            />
+        </div>
 
-    <div class="size-[110px] rounded-full border-4 border-hPrimary">
-      <img :src="brandingStore.value?.portraitUrl ?? '/images/placeholders/profile.png'" :alt="t('logoAlt')"
-        width="110px" height="110px" class="rounded-full" />
+        <!-- Tint Effect -->
+        <div
+            v-if="showTint"
+            :title="t('editLogo')"
+            class="absolute inset-0 cursor-pointer rounded-full bg-black/25"
+        >
+            <!-- Top-right Icon -->
+            <div
+                class="absolute right-0 top-0 flex size-12 items-center justify-center rounded-full bg-hutopyPrimary shadow-lg"
+            >
+                <v-icon
+                    :icon="mdiPencil"
+                    large
+                />
+            </div>
+        </div>
     </div>
 
-    <!-- Tint Effect -->
-    <div v-if="showTint" class="absolute inset-0 cursor-pointer rounded-full bg-black/25" :title="t('editLogo')">
-      <!-- Top-right Icon -->
-      <div
-        class="absolute right-0 top-0 flex size-12 items-center justify-center rounded-full bg-hutopyPrimary shadow-lg">
-        <v-icon large :icon="mdiPencil" />
-      </div>
-    </div>
-
-  </div>
-
-  <v-dialog v-model="isDialogOpen" max-width="800px">
-    <template #default="{ close }">
-      <creator-logo-editor :creator="brandingStore?.value"
-        @closeRequested="() => isDialogOpen = false"></creator-logo-editor>
-    </template>
-  </v-dialog>
-
+    <v-dialog
+        v-model="isDialogOpen"
+        max-width="800px"
+    >
+        <template #default="{ close }">
+            <creator-logo-editor
+                :creator="brandingStore?.value"
+                @closeRequested="() => (isDialogOpen = false)"
+            ></creator-logo-editor>
+        </template>
+    </v-dialog>
 </template>
 
 <script setup>
-import { useAuthStore } from "@/stores/authStore.js";
-import { useBrandingStore } from "@/stores/brandingStore.js";
-import CreatorLogoEditor from "@/views/creators/CreatorLogoEditor.vue";
-import { computed, ref } from "vue";
-import { useI18n } from 'vue-i18n'
-import { mdiPencil } from '@mdi/js';
+    import { useAuthStore } from '@/stores/authStore.js';
+    import { useBrandingStore } from '@/stores/brandingStore.js';
+    import CreatorLogoEditor from '@/views/creators/CreatorLogoEditor.vue';
+    import { computed, ref } from 'vue';
+    import { useI18n } from 'vue-i18n';
+    import { mdiPencil } from '@mdi/js';
 
-const authStore = useAuthStore();
-const brandingStore = useBrandingStore();
-const { t } = useI18n();
+    const authStore = useAuthStore();
+    const brandingStore = useBrandingStore();
+    const { t } = useI18n();
 
-// State
-const showTint = ref(false);
-const isDialogOpen = ref(false);
+    // State
+    const showTint = ref(false);
+    const isDialogOpen = ref(false);
 
-// Methods
-const openBannerEditor = () => {
-  isDialogOpen.value = true;
-};
-
-const isCurrentCreator = computed(() => {
-  return authStore.userId === brandingStore.value.id;
-});
+    // Methods
+    const openBannerEditor = () => {
+        isDialogOpen.value = true;
+    };
 
+    const isCurrentCreator = computed(() => {
+        return authStore.userId === brandingStore.value.id;
+    });
 </script>
 
 <style scoped>
-.logo-image {
-  @apply border-4 border-solid border-hTertiary;
-}
+    .logo-image {
+        @apply border-4 border-solid border-hTertiary;
+    }
 </style>
 
 <i18n>
 {
-  "en": {
-    "logoAlt": "Creator logo",
-    "editLogo": "Edit logo"
-  },
-  "fr": {
-    "logoAlt": "Logo du créateur",
-    "editLogo": "Modifier le logo"
-  },
-  "es": {
-    "logoAlt": "Logo del creador",
-    "editLogo": "Editar logo"
-  }
+    "en": {
+        "logoAlt": "Creator logo",
+        "editLogo": "Edit logo"
+    },
+    "fr": {
+        "logoAlt": "Logo du créateur",
+        "editLogo": "Modifier le logo"
+    }
 }
 </i18n>