Merge pull request #6108 from Ocelot-Social-Community/5978-refactor-change-invite-code-button-and-menu-to-copy-invite-link

refactor(webapp): change invite code button and menu to copy invite link

webapp/components/InviteButton/InviteButton.vue

@@ -1,7 +1,16 @@
 <template>
   <dropdown class="invite-button" offset="8" :placement="placement">
     <template #default="{ toggleMenu }">
-      <base-button icon="user-plus" circle ghost @click.prevent="toggleMenu" />
+      <base-button
+        icon="user-plus"
+        circle
+        ghost
+        v-tooltip="{
+          content: $t('invite-codes.button.tooltip'),
+          placement: 'bottom-start',
+        }"
+        @click.prevent="toggleMenu"
+      />
     </template>
     <template #popover>
       <div class="invite-button-menu-popover">
@@ -15,10 +24,7 @@
               ghost
               @click="copyInviteLink"
             >
-              <ds-text bold>
-                {{ $t('invite-codes.copy-code') }}
-                {{ inviteCode.code }}
-              </ds-text>
+              <ds-text bold>{{ $t('invite-codes.copy-code') }}</ds-text>
             </base-button>
           </base-card>
         </div>
@@ -108,6 +114,6 @@ export default {
 }
 
 .invite-code {
-  left: 50%;
+  margin-left: 25%;
 }
 </style>

webapp/locales/de.json

@@ -515,10 +515,13 @@
     "no-results": "Keine Beiträge gefunden."
   },
   "invite-codes": {
-    "copy-code": "Code:",
+    "button": {
+      "tooltip": "Lade deine Freunde ein"
+    },
+    "copy-code": "Einladungslink kopieren",
     "copy-success": "Einladungscode erfolgreich in die Zwischenablage kopiert",
     "not-available": "Du hast keinen Einladungscode zur Verfügung!",
-    "your-code": "Kopiere deinen Einladungscode in die Ablage:"
+    "your-code": "Sende diesen Link per E-Mail oder in sozialen Medien, um deine Freunde einzuladen:"
   },
   "login": {
     "email": "Deine E-Mail",

webapp/locales/en.json

@@ -515,10 +515,13 @@
     "no-results": "No contributions found."
   },
   "invite-codes": {
-    "copy-code": "Code:",
+    "button": {
+      "tooltip": "Invite your friends"
+    },
+    "copy-code": "Copy Invite Link",
     "copy-success": "Invite code copied to clipboard",
     "not-available": "You have no valid invite code available!",
-    "your-code": "Copy your invite code to the clipboard:"
+    "your-code": "Send this link per e-mail or in social media to invite your friends:"
   },
   "login": {
     "email": "Your E-mail",