diff --git a/docs/reference/default-theme-config.md b/docs/reference/default-theme-config.md
index 80c17139..386ecbb0 100644
--- a/docs/reference/default-theme-config.md
+++ b/docs/reference/default-theme-config.md
@@ -214,7 +214,9 @@ export default {
icon: {
svg: ''
},
- link: '...'
+ link: '...',
+ // You can include a custom label for accessibility too (optional but recommended):
+ ariaLabel: 'cool link'
}
]
}
@@ -225,6 +227,7 @@ export default {
interface SocialLink {
icon: SocialLinkIcon
link: string
+ ariaLabel?: string
}
type SocialLinkIcon =
diff --git a/src/client/theme-default/components/VPSocialLink.vue b/src/client/theme-default/components/VPSocialLink.vue
index d5f08785..c884229e 100644
--- a/src/client/theme-default/components/VPSocialLink.vue
+++ b/src/client/theme-default/components/VPSocialLink.vue
@@ -6,6 +6,7 @@ import { icons } from '../support/socialIcons'
const props = defineProps<{
icon: DefaultTheme.SocialLinkIcon
link: string
+ ariaLabel?: string
}>()
const svg = computed(() => {
@@ -18,7 +19,7 @@ const svg = computed(() => {
diff --git a/types/default-theme.d.ts b/types/default-theme.d.ts
index d4cde64c..3a37eb57 100644
--- a/types/default-theme.d.ts
+++ b/types/default-theme.d.ts
@@ -251,6 +251,7 @@ export namespace DefaultTheme {
export interface SocialLink {
icon: SocialLinkIcon
link: string
+ ariaLabel?: string
}
export type SocialLinkIcon =