Skip to content

Commit eba8007

Browse files
committed
fix(a11y): enhance accessibility for UInputCopy and improve logo image formatting
- Update aria-label for UInputCopy button to be more contextual - Refactor NuxtImg components in deploy pages for better readability and consistency
1 parent ed34106 commit eba8007

3 files changed

Lines changed: 21 additions & 3 deletions

File tree

app/components/UInputCopy.vue

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,10 @@ const props = defineProps({
1616
const { copy, copied } = useClipboard()
1717
const { track } = useAnalytics()
1818
19+
const ariaLabel = computed(() =>
20+
props.label ? `Copy "${props.label}" to clipboard` : 'Copy command to clipboard'
21+
)
22+
1923
function copyValue() {
2024
track('Command Copied', { value: props.value })
2125
copy(props.value)
@@ -45,7 +49,7 @@ function copyValue() {
4549
'!text-primary cursor-default': copied,
4650
'cursor-copy': !copied
4751
}"
48-
:aria-label="label ? `Copy "${label}" to clipboard` : 'Copy command to clipboard'"
52+
:aria-label="ariaLabel"
4953
@click="copyValue"
5054
/>
5155
</template>

app/pages/deploy/[slug].vue

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -97,7 +97,14 @@ links.push({
9797
<template #title>
9898
<div class="flex items-center gap-4">
9999
<UIcon v-if="provider.logoIcon" :name="provider.logoIcon" class="w-10" />
100-
<NuxtImg v-else :src="provider.logoSrc" width="40" height="40" class="size-10" :alt="`${provider.title} logo`" />
100+
<NuxtImg
101+
v-else
102+
:src="provider.logoSrc"
103+
width="40"
104+
height="40"
105+
class="size-10"
106+
:alt="`${provider.title} logo`"
107+
/>
101108

102109
<span>{{ provider.title }}</span>
103110
</div>

app/pages/deploy/index.vue

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -61,7 +61,14 @@ await fetchList()
6161
}"
6262
>
6363
<template #leading>
64-
<NuxtImg v-if="deployment.logoSrc" :src="deployment.logoSrc" width="40" height="40" class="w-10 h-10" :alt="`${deployment.title} logo`" />
64+
<NuxtImg
65+
v-if="deployment.logoSrc"
66+
:src="deployment.logoSrc"
67+
width="40"
68+
height="40"
69+
class="w-10 h-10"
70+
:alt="`${deployment.title} logo`"
71+
/>
6572
<UIcon v-else :name="deployment.logoIcon" class="size-10 text-black dark:text-white" />
6673
</template>
6774
<UBadge

0 commit comments

Comments
 (0)