Fixed badge color

app/components/calendar/event/Details.vue

@@ -187,19 +187,19 @@ function deployDeleteModal() {
     </menu>
 
     <nav v-if="event.startDate && event.endDate" class="mt-2 flex gap-2">
-      <UiBadge class="hover:bg-indigo-400 dark:hover:bg-slate-300" as-child>
+      <UiBadge as-child>
         <button
-          class="flex gap-1"
-          title="Naviguer au début"
+          class="flex gap-1 cursor-pointer"
+          :title="$t('entity.calendar.event.gotoStart')"
           @click="handleJumpToDate(event.startDate!)"
         >
           <PhHourglassHigh size="16" weight="fill" /> {{ $t('entity.calendar.event.isStart') }}
         </button>
       </UiBadge>
-      <UiBadge class="hover:bg-indigo-400 dark:hover:bg-slate-300" as-child title="Naviguer à la fin">
+      <UiBadge as-child>
         <button
-          class="flex gap-1"
-          title="Naviguer à la fin"
+          class="flex gap-1 cursor-pointer"
+          :title="$t('entity.calendar.event.gotoEnd')"
           @click="handleJumpToDate(event.endDate!)"
         >
           <PhHourglassLow size="16" weight="fill" /> {{ $t('entity.calendar.event.isEnd') }}

i18n/i18n.config.ts

@@ -206,6 +206,8 @@ export default defineI18nConfig(() => ({
             title: "Event title",
             isStart: "Start",
             isEnd: "End",
+            gotoStart: "Go to the start of this event",
+            gotoEnd: "Go to the end of this event",
             isHidden: "Hidden",
             isPublic: "Public",
             hiddenLabel: "Hide this event",
@@ -539,6 +541,8 @@ export default defineI18nConfig(() => ({
             title: "Titre de l'évènement",
             isStart: "Début",
             isEnd: "Fin",
+            gotoStart: "Aller au début de l'évènement",
+            gotoEnd: "Aller à la fin de l'évènement",
             isHidden: "Privé",
             isPublic: "Public",
             hiddenLabel: "Rendre l'évènement privé",