From f32606eb0852744c64fe78ca8b30690ba67c3f38 Mon Sep 17 00:00:00 2001
From: Corinna Hillebrand <corinna.hillebrand@wikimedia.de>
Date: Mon, 16 Dec 2024 12:28:37 +0100
Subject: [PATCH] Add link titles to banner links

- gives the user a popup that says what the link does
---
 src/components/FallbackBanner/UseOfFundsLink.vue | 6 +++++-
 src/components/Footer/BannerFooter.vue           | 1 +
 src/components/Footer/FooterAlreadyDonated.vue   | 8 +++++++-
 src/components/Footer/messages/Footer.de.ts      | 3 ++-
 src/components/Footer/messages/Footer.en.ts      | 3 ++-
 5 files changed, 17 insertions(+), 4 deletions(-)

diff --git a/src/components/FallbackBanner/UseOfFundsLink.vue b/src/components/FallbackBanner/UseOfFundsLink.vue
index f7eb899f3..f2d8963a5 100644
--- a/src/components/FallbackBanner/UseOfFundsLink.vue
+++ b/src/components/FallbackBanner/UseOfFundsLink.vue
@@ -1,5 +1,9 @@
 <template>
-	<a class="wmde-banner-fallback-usage-link" @click.prevent="$emit( 'button-clicked' )">
+	<a
+		class="wmde-banner-fallback-usage-link"
+		@click.prevent="$emit( 'button-clicked' )"
+		:title="$translate( 'use-of-funds-link-description' )"
+	>
 		{{ $translate( 'use-of-funds-link' ) }}
 	</a>
 </template>
diff --git a/src/components/Footer/BannerFooter.vue b/src/components/Footer/BannerFooter.vue
index 65f8e8d07..09892909b 100644
--- a/src/components/Footer/BannerFooter.vue
+++ b/src/components/Footer/BannerFooter.vue
@@ -21,6 +21,7 @@
 					id="application-of-funds-link"
 					class="wmde-banner-footer-usage-link t-use-of-funds-link"
 					@click.prevent="$emit( 'showFundsModal' )"
+					:title="$translate( 'use-of-funds-link-description' )"
 				>
 					{{ $translate( 'use-of-funds-link' ) }}
 				</a>
diff --git a/src/components/Footer/FooterAlreadyDonated.vue b/src/components/Footer/FooterAlreadyDonated.vue
index 401d3d7ad..865b8219e 100644
--- a/src/components/Footer/FooterAlreadyDonated.vue
+++ b/src/components/Footer/FooterAlreadyDonated.vue
@@ -10,7 +10,12 @@
 			<label class="wmde-banner-footer-bank-item iban">IBAN:
 				<SelectionInput :value="'DE09 3702 0500 0003 2873 00'" :focusedValue="'DE09370205000003287300'"/>
 			</label>
-			<a href="#" class="wmde-banner-footer-already-donated" @click.prevent="onClickAlreadyDonated">
+			<a
+				href="#"
+				class="wmde-banner-footer-already-donated"
+				@click.prevent="onClickAlreadyDonated"
+				:title="$translate( 'already-donated-description' )"
+			>
 				<TickIcon :fill="'#5B5B5B'"/> {{ $translate( 'already-donated-open-link' ) }}
 			</a>
 		</div>
@@ -21,6 +26,7 @@
                     id="application-of-funds-link"
                     class="wmde-banner-footer-usage-link t-use-of-funds-link"
                     @click.prevent="$emit( 'showFundsModal' )"
+					:title="$translate( 'use-of-funds-link-description' )"
 				>
                     {{ $translate('use-of-funds-link') }}
                 </a>
diff --git a/src/components/Footer/messages/Footer.de.ts b/src/components/Footer/messages/Footer.de.ts
index d14a9445b..e167f5fef 100644
--- a/src/components/Footer/messages/Footer.de.ts
+++ b/src/components/Footer/messages/Footer.de.ts
@@ -5,7 +5,8 @@ const translations: TranslationMessages = {
 	'use-of-funds-link': 'Was Ihre Spende bewirkt',
 	'use-of-funds-link-description': 'Erklärungstext aufklappen',
 	'faq-page-link': 'Häufige Fragen zur Spende',
-	'faq-page-link-description': 'Webseite in neuem Browsertab bzw. -fenster öffnen'
+	'faq-page-link-description': 'Webseite in neuem Browsertab oder Fenster öffnen',
+	'already-donated-description': 'Banner schließen'
 };
 
 export default translations;
diff --git a/src/components/Footer/messages/Footer.en.ts b/src/components/Footer/messages/Footer.en.ts
index f135c90be..04d6a23ba 100644
--- a/src/components/Footer/messages/Footer.en.ts
+++ b/src/components/Footer/messages/Footer.en.ts
@@ -5,7 +5,8 @@ const translations: TranslationMessages = {
 	'use-of-funds-link': 'Where does my donation go?',
 	'use-of-funds-link-description': 'expand explanation text',
 	'faq-page-link': 'FAQ',
-	'faq-page-link-description': 'open webpage in a new browser tab or window'
+	'faq-page-link-description': 'open webpage in a new browser tab or window',
+	'already-donated-description': 'close banner'
 };
 
 export default translations;