Traduction and ui modifications

2024-12-27 00:27:38 -05:00
parent 25955c9701
commit 4a76ba1e2c
7 changed files with 60 additions and 80 deletions
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -1,5 +1,5 @@
 {
-  "language":{
+  "language": {
    "language": "En"
  },
  "general": {
@@ -10,7 +10,14 @@
    "subscription": "Subscriptions"
  },
  "footer": {
-    "allRightsReserved": "All rights reserved"
+    "allRightsReserved": "All rights reserved",
+    "helpandcontact": "Help and contact",
+    "faq": "FAQ",
+    "creatorguide": "Creator guide",
+    "termsandconditions": "Terms and conditions",
+    "contentpolicy": "Content policy",
+    "about": "About",
+    "pricing": "Pricing"
  },
  "sidebar": {
    "subscriptionTitle": "Subscription",
@@ -111,6 +118,11 @@
    "password": "Password",
    "recoverybyemail": "Recovery by Email",
    "recoverybymobile": "Recovery by Mobile"
+  },
+  "isupportbtn": {
+    "isupport": "I support",
+    "amount": "amount",
+    "message": "Message (optional)",
+    "send": "send"
  }
-
 }
--- a/src/locales/fr.json
+++ b/src/locales/fr.json
@@ -1,8 +1,7 @@
 {
- "language":{
-   "language": "Fr"
- }, 
-  
+  "language": {
+    "language": "Fr"
+  },
  "general": {
    "yes": "oui",
    "no": "non"
@@ -11,7 +10,14 @@
    "subscription": "Abonnés"
  },
  "footer": {
-    "allRightsReserved": "Tout droits réservés"
+    "allRightsReserved": "Tout droits réservés",
+    "helpandcontact": "Aide & Contact",
+    "faq": "FAQ",
+    "creatorguide": "Guide pour les créateurs",
+    "termsandconditions": "Termes et conditions",
+    "contentpolicy": "Politique de contenu",
+    "about": "À propos",
+    "pricing": "Frais"
  },
  "sidebar": {
    "subscriptionTitle": "Abonnements",
@@ -100,7 +106,7 @@
    "socialnetwork": "Réseaux sociaux"
  },
  "accountmanagement": {
-    "accounts" : "comptes",
+    "accounts": "comptes",
    "accountmanagement": "Gestion des comptes",
    "pageid": "ID de la page",
    "addaccount": "Ajouter un compte",
@@ -112,7 +118,11 @@
    "password": "Mot de passe",
    "recoverybyemail": "Récupération par email",
    "recoverybymobile": "Récupération par mobile"
+  },
+  "isupportbtn": {
+    "isupport": "Je soutiens",
+    "amount": "Montant",
+    "message": "Message (facultatif)",
+    "send": "Envoyez"
  }
-
-
 }
--- a/src/views/creators/DonationButton.vue
+++ b/src/views/creators/DonationButton.vue
@@ -1,4 +1,4 @@
-<template>
+<template> 
  <v-btn class="hover:scale-125" variant="text" icon @click="openDonationDialog()">
    <v-icon :class="['text-2xl', iconColorClass]">mdi-gift-outline</v-icon>
  </v-btn>
--- a/src/views/creators/DonationButtonBanner.vue
+++ b/src/views/creators/DonationButtonBanner.vue
@@ -5,7 +5,7 @@
    block
    @click="openDonationDialog()"
  >
-    Je Soutiens
+    {{ $t('isupportbtn.isupport') }}
  </v-btn>

  <v-dialog v-model="donationModal" max-width="500">
@@ -14,7 +14,7 @@
        class="text-center rounded-xl"
        :style="{ border: `3px solid ${brandingStore.colors.primary}` }"
      >
-        <div class="py-4 text-2xl font-bold border-b mb-2">Je Soutiens</div>
+        <div class="py-4 text-2xl font-bold border-b mb-2"> {{ $t('isupportbtn.isupport') }}</div>

        <div class="flex flex-row align-center px-3">
          <img
@@ -46,7 +46,7 @@
            placeholder="0"
            :min="0"
            class="p-2"
-            label="Montant"
+            :label="`${$t('isupportbtn.amount')}`"
            density="comfortable"
            variant="outlined"
            hide-details
@@ -58,7 +58,7 @@

          <v-textarea
            v-model="tipMessage"
-            label="Message (facultatif)"
+            :label="`${$t('isupportbtn.message')}`"
            class="p-2"
            density="comfortable"
            variant="outlined"
@@ -76,7 +76,7 @@
            @click="goPay()"
            class="w-full mt-5"
          >
-            Envoyez
+            {{ $t('isupportbtn.send') }}
          </v-btn>
        </v-card-text>
      </v-card>
--- a/src/views/main/Footer.vue
+++ b/src/views/main/Footer.vue
@@ -29,25 +29,25 @@ const brandingStore = useBrandingStore()

    <div class="flex flex-row flex-wrap justify-center gap-4 px-4 "  >
      <router-link to="/documents/helpandcontact"  :style="{color: brandingStore.colors.onBackground}">
-        Aide & Contact
+        {{ $t('footer.helpandcontact') }}
      </router-link>
      <router-link to="/documents/faq"  :style="{color: brandingStore.colors.onBackground}">
-        FAQ
+        {{ $t('footer.faq') }}
      </router-link>
      <router-link to="/documents/guideforcreators"  :style="{color: brandingStore.colors.onBackground}">
-        Guide pour les créateurs
+        {{ $t('footer.creatorguide') }}
      </router-link>
      <router-link to="/documents/termsandconditions"  :style="{color: brandingStore.colors.onBackground}">
-        Termes et Conditions
+        {{ $t('footer.termsandconditions') }}
      </router-link>
      <router-link to="/documents/contentpolicy"  :style="{color: brandingStore.colors.onBackground}">
-        Politique de Contenu
+        {{ $t('footer.contentpolicy') }}
      </router-link>
      <router-link to="/documents/about"  :style="{color: brandingStore.colors.onBackground}">
-        À Propos
+        {{ $t('footer.about') }}
      </router-link>
      <router-link to="/documents/pricing"  :style="{color: brandingStore.colors.onBackground}">
-        Frais
+        {{ $t('footer.pricing') }}
      </router-link>
    </div>

--- a/src/views/profile/creators/CreateCreator.vue
+++ b/src/views/profile/creators/CreateCreator.vue
@@ -31,13 +31,6 @@ function requestAccept() {
        outlined
    ></v-text-field>

-    <v-text-field
-        variant="outlined"
-        v-model="creatorName"
-        label="Compte stripe"
-        outlined
-    ></v-text-field>
-
    <div class="flex flex-row justify-end gap-2">
      <v-btn
          variant="flat"
--- a/src/views/profile/creators/CreatorPage.vue
+++ b/src/views/profile/creators/CreatorPage.vue
@@ -94,7 +94,7 @@ const closeDialog = () => {
    </h1>

    <div v-if="creatorProfileStore.hasCreator" class="w-full max-w-[800px]">
-      <div class="my-10 border rounded-2xl">
+      <div class="my-10 border rounded bg-white">
        <div class="py-5 uppercase ml-4">
          {{ $t('creatorinfopage.informations') }}
        </div>
@@ -132,7 +132,7 @@ const closeDialog = () => {
        <div class="flex flex-col w-full">
          <button
            @click="openDialog('ChangeStripeID')"
-            class="HoverBtn active:bg-gray-300 py-2 px-4 border-gray-400 shadow flex items-center transition duration-200 ease-in-out w-full rounded-b-2xl"
+            class="HoverBtn active:bg-gray-300 py-2 px-4 border-gray-400 shadow flex items-center transition duration-200 ease-in-out w-full rounded-b"
          >
            <span class="flex-none pa-2 min-w-32 text-left"
              >Stripe Account ID</span
@@ -148,7 +148,7 @@ const closeDialog = () => {
        </div>
      </div>

-      <div class="border rounded-2xl">
+      <div class="border rounded bg-white">
        <div class="py-5 uppercase ml-4">
          {{ $t('creatorinfopage.banner&profile') }}
        </div>
@@ -185,12 +185,12 @@ const closeDialog = () => {
        </div>
      </div>

-      <div class="mt-10 border rounded-2xl">
+      <div class="mt-10 border rounded bg-white">
        <div class="py-5 uppercase ml-4">
          {{ $t('creatorinfopage.socialnetwork') }}
        </div>

-        <div class="flex flex-col w-full">
+        <div class="flex flex-col w-full ">
          <button
            @click="openDialog('Socials')"
            class="HoverBtn active:bg-gray-300 py-2 px-4 border-gray-400 shadow flex items-center transition duration-200 ease-in-out w-full"
@@ -298,7 +298,7 @@ const closeDialog = () => {

          <button
            @click="openDialog('Socials')"
-            class="HoverBtn active:bg-gray-300 py-2 px-4 border-gray-400 shadow flex items-center transition duration-200 ease-in-out w-full rounded-b-2xl"
+            class="HoverBtn active:bg-gray-300 py-2 px-4 border-gray-400 shadow flex items-center transition duration-200 ease-in-out w-full rounded-b"
          >
            <span class="pa-2 min-w-32 text-left"
              ><v-icon>mdi-web</v-icon></span
@@ -315,63 +315,27 @@ const closeDialog = () => {
    </div>

    <div v-else class="w-full max-w-[800px]">
-      <div class="my-10 border rounded-2xl">
+      <div class="my-10 border rounded bg-white shadow">
        <div class="py-5 uppercase ml-4 px-4">
          Informations pour pour votre page
        </div>
-        <div class="flex flex-col w-full">
+        <div class="flex flex-col w-full ">
          <button
            @click="openDialog('CreateCreator')"
            class="HoverBtn active:bg-gray-300 py-2 px-4 border-gray-400 shadow flex items-center transition duration-200 ease-in-out"
          >
-            <span class="flex-none pa-2 min-w-32 text-left">Nom (Unique) </span>
+            <span class="flex-none pa-2 min-w-32 text-left">Nom</span>
            <span class="flex-auto text-left pr-6"
-              >Vous devez vous assurer de choisir un nom unique ou d'utiliser
-              votre propre nom. Cela est important car c'est votre nom de
-              marque, celui que vous allez présenter aux gens. Par exemple,
-              notre projet s'appelle Hutopy, nous avons donc utilisé ce nom pour
-              notre page officielle sur la plateforme.</span
+              >Choisissez le nom de votre page. Cela peut être un nom de personne, d'organisation ou de projet.</span
            >
            <span class="flex-none">
              <v-icon>mdi-chevron-right</v-icon>
            </span>
          </button>

-          <button
-            @click="openDialog('CreateCreator')"
-            class="HoverBtn active:bg-gray-300 py-2 px-4 border-gray-400 shadow flex items-center transition duration-200 ease-in-out"
-          >
-            <span class="flex-none pa-2 min-w-32 text-left">Titre</span>
-            <span class="flex-auto text-left pr-6"
-              >Le titre doit refléter ce que vous souhaitez mettre en avant sur
-              la plateforme, ce que vous voulez présenter comme contenu ou la
-              raison de votre présence sur la plateforme. Par exemple, des
-              artistes pourraient écrire chanteur, danseur, peintre ou autre.
-              Une entreprise pourrait indiquer son activité. Dans notre cas,
-              pour Hutopy, c'est 'Créer un monde meilleur'.
-            </span>
-            <span class="flex-none">
-              <v-icon>mdi-chevron-right</v-icon>
-            </span>
-          </button>
+    

-          <button
-            @click="openDialog('CreateCreator')"
-            class="HoverBtn active:bg-gray-300 py-2 px-4 border-gray-400 shadow flex items-center transition duration-200 ease-in-out w-full rounded-b-2xl"
-          >
-            <span class="pa-2 min-w-32 text-left">Description</span>
-            <span class="flex-auto text-left pr-6"
-              >Pour la description, c'est un espace où vous pouvez écrire ce que
-              vous souhaitez : décrire votre page, le service que vous offrez,
-              la raison de votre présence sur la plateforme, votre historique...
-              Vous choisissez ! Dans notre cas, pour Hutopy, nous sommes ici
-              afin de créer une plateforme sur laquelle les gens pourront
-              s'exprimer et créer, tout en étant respectés et non exploités.
-            </span>
-            <span class="flex-none">
-              <v-icon>mdi-chevron-right</v-icon>
-            </span>
-          </button>
+  
        </div>
      </div>
    </div>
@@ -382,7 +346,8 @@ const closeDialog = () => {
 .HoverBtn:hover {
  @apply bg-[#A6147D] text-white;
  @apply hover:opacity-90;
-  /* Réduire l'opacité au survol */
+
+  
 }

 .custom-border {