MEED-2581 Add some adjustments to the activity toolbar icons

Meeds-io · Sep 25, 2023 · 9407669 · 9407669
1 parent 0c2bb1f
commit 9407669
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 13 deletions.
diff --git a/kudos-services/src/main/resources/locale/addon/Kudos_en.properties b/kudos-services/src/main/resources/locale/addon/Kudos_en.properties
@@ -6,6 +6,7 @@ NewKudosSentActivityComment.activity_kudos_content={3} Kudos to {1} {2}
 NewKudosSentActivityComment.activity_kudos_title=Kudos to {0}
 
 kudos.title=Kudos
+exoplatform.kudos.tooltip=Send kudos
 exoplatform.kudos.title.sendAKudos=Send a Kudos
 exoplatform.kudos.content.to=To:
 exoplatform.kudos.visibility.title=Visible to any member of:

diff --git a/kudos-services/src/main/resources/locale/addon/Kudos_fr.properties b/kudos-services/src/main/resources/locale/addon/Kudos_fr.properties
@@ -6,6 +6,7 @@ NewKudosSentActivityComment.activity_kudos_content={3} Kudos \u00E0 {1} {2}
 NewKudosSentActivityComment.activity_kudos_title=Kudos \u00E0 {0}
 
 kudos.title=Kudos
+exoplatform.kudos.tooltip=Envoyer un kudos
 exoplatform.kudos.title.sendAKudos=Envoyer un kudos
 exoplatform.kudos.content.to=\u00C0 :
 exoplatform.kudos.visibility.title=Visible par tout membre du :

diff --git a/kudos-webapps/src/main/webapp/vue-app/kudos/components/SendKudosToolbarAction.vue b/kudos-webapps/src/main/webapp/vue-app/kudos/components/SendKudosToolbarAction.vue
@@ -1,16 +1,37 @@
 <template>
+  <v-tooltip v-if="!spaceId" bottom>
+    <template #activator="{ on, attrs }">
+      <v-btn
+        id="kudosBtnToolbar"
+        icon
+        height="36px"
+        width="36px"
+        v-bind="attrs"
+        v-on="on"
+        @click="openSendKudosDrawer">
+        <v-icon
+          size="20px"
+          color="primary">
+          fa-award
+        </v-icon>
+      </v-btn>
+    </template>
+    <span>
+      {{ $t('exoplatform.kudos.tooltip') }}
+    </span>
+  </v-tooltip>
   <v-btn
     id="kudosBtnToolbar"
-    :icon="!spaceId"
-    :text="spaceId"
-    :class="kudosButtonStyle"
+    v-else
+    text
+    class="d-flex flex-row align-center py-2 px-3"
     @click="openSendKudosDrawer">
     <v-icon
-      :size="iconSize"
+      size="27px"
       color="primary">
       fa-award
     </v-icon>
-    <v-span v-if="spaceId" class="body-2 font-weight-bold ms-5  mt-1 dark-grey-color">
+    <v-span class="body-2 font-weight-bold ms-5  mt-1 dark-grey-color">
       {{ $t('kudos.title') }}
     </v-span>
   </v-btn>
@@ -22,14 +43,6 @@ export default {
       spaceId: eXo.env.portal.spaceId,
     };
   },
-  computed: {
-    iconSize() {
-      return this.spaceId ? '27' : '21';
-    },
-    kudosButtonStyle() {
-      return this.spaceId && 'd-flex flex-row align-center py-2 px-3';
-    }
-  },
   methods: {
     openSendKudosDrawer() {
       document.dispatchEvent(new CustomEvent('exo-kudos-open-send-modal', {detail: {