Skip to content

Commit 2e1394f

Browse files
committed
feat: Add translations
1 parent 2825808 commit 2e1394f

23 files changed

+91
-56
lines changed

Diff for: src/components/ExternalLink.vue

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
class="va-inline-flex va-py-2 va-px-1 va-items-center va-text-blue-700 va-no-underline va-font-medium hover:va-underline"
66
>
77
<slot />
8-
<span class="va-sr-only">(Opens a new tab)</span>
8+
<span class="va-sr-only">({{ $vat('open_new_tab') }})</span>
99
<svg
1010
class="va-ml-1"
1111
fill="none"

Diff for: src/components/Popup.vue

+1-1
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
>
77
<transition name="scale">
88
<div
9-
v-show="true"
9+
v-show="isOpen"
1010
id="va-popup-box"
1111
class="va-popup__box va-w-full va-rounded-lg va-mb-4 va-shadow-lg va-bg-main va-border va-border-solid va-border-gray-200 va-overflow-hidden"
1212
>

Diff for: src/components/PopupBodyDetails.vue

+7-7
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
@click="$emit('hide-details')"
1111
>
1212
<IconArrowNarrow />
13-
<span class="va-ml-2 va-text-base va-font-medium va-leading-3">Back</span>
13+
<span class="va-ml-2 va-text-base va-font-medium va-leading-3">{{ $vat('back', 'Back') }}</span>
1414
</button>
1515
<button
1616
type="button"
@@ -43,7 +43,7 @@
4343
</g>
4444
</svg>
4545
<span class="va-ml-2 va-text-base va-font-medium va-leading-3">
46-
{{ highlights ? 'Stop highlight' : 'Highlight' }}
46+
{{ highlights ? $vat('no_highlight', 'Stop highlight') : $vat('highlight', 'Highlight') }}
4747
</span>
4848
</button>
4949
</div>
@@ -52,7 +52,7 @@
5252
:id="`issue-desc-${details.id}`"
5353
class="va-p-item__header va-bg-primary va-flex va-justify-between va-font-medium va-p-3 va-border va-border-solid va-border-gray-300 va-text-base"
5454
>
55-
Issue description
55+
{{ $vat('issue_desc', 'Issue description') }}
5656
</h2>
5757
<p class="va-p-3">
5858
{{ details.description }}
@@ -62,7 +62,7 @@
6262
:aria-labelledby="`more-${details.id} issue-desc-${details.id}`"
6363
style="margin-left: -0.25rem;"
6464
>
65-
<span :id="`more-${details.id}`">Learn more</span>
65+
<span :id="`more-${details.id}`">{{ $vat('learn_more', 'Learn more') }}</span>
6666
</ExternalLink>
6767
</p>
6868
</section>
@@ -73,7 +73,7 @@
7373
>
7474
<div class="va-w-full va-flex va-items-center va-justify-between">
7575
<h2 class="va-font-medium va-text-base">
76-
Element source
76+
{{ $vat('el_src', 'Element source') }}
7777
</h2>
7878
<div class="va-flex va-items-center">
7979
<span class="va-mx-1 va-font-medium va-text-sm">
@@ -89,7 +89,7 @@
8989
</div>
9090
<div class="va-w-full va-mt-2">
9191
<h3 class="va-font-medium va-text-base">
92-
{{ failure.errors.length > 1 ? 'Fix any of the following' : 'Fix the following' }}:
92+
{{ failure.errors.length > 1 ? $vat('fixes') : $vat('fix') }}:
9393
</h3>
9494
<ul class="va-mt-2">
9595
<li
@@ -111,7 +111,7 @@
111111
:id="`references-${details.id}`"
112112
class="va-p-item__header va-bg-primary va-flex va-justify-between va-font-medium va-p-3 va-border va-border-solid va-border-gray-300 va-text-base"
113113
>
114-
More links
114+
{{ $vat('more_links', 'More links') }}
115115
</h2>
116116
<ul class="va-p-3 va-pt-2">
117117
<li

Diff for: src/components/PopupBodyNoIssues.vue

+2-2
Original file line numberDiff line numberDiff line change
@@ -4,10 +4,10 @@
44
id="congratulation-title"
55
class="va-text-xl va-uppercase va-text-green-800 va-text-center va-mt-3"
66
>
7-
Congratulation
7+
{{ $vat('congrats', 'Congratulation') }}
88
</h2>
99
<p class="va-text-center va-mt-4">
10-
(0) issues found on this page
10+
(0) {{ $vat('no_issues') }}
1111
</p>
1212
<div class="va-flex va-flex-wrap va-items-center va-justify-center va-my-4 va-pt-4">
1313
<svg

Diff for: src/components/PopupBodyViolations.vue

+13-5
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,10 @@
11
<template>
22
<div class="va-bg-main va-p-5">
33
<div class="va-font-medium">
4-
<span>{{ results.issuesFound }} issue{{ results.issuesFound > 1 ? 's' : '' }} found</span>
4+
<span>
5+
{{ results.issuesFound }}
6+
{{ results.issuesFound > 1 ? $vat('issues_found', 'issues found') : $vat('issue_found', 'issue found') }}
7+
</span>
58
</div>
69
<ul class="va-mt-6">
710
<li
@@ -11,8 +14,11 @@
1114
>
1215
<template v-if="result.length">
1316
<div class="va-p-item__header va-bg-primary va-flex va-justify-between va-font-medium va-p-3 va-border va-border-solid va-border-gray-300">
14-
<span :class="`va-capitalize va-text-${key}`">{{ key }}</span>
15-
<span>{{ result.length }} issues</span>
17+
<span :class="`va-capitalize va-text-${key}`">{{ $vat(key, key) }}</span>
18+
<span>
19+
{{ result.length }}
20+
{{ result.length > 1 ? $vat('issues', 'issues') : $vat('issue', 'issue') }}
21+
</span>
1622
</div>
1723
<ul class="va-mt-2">
1824
<WrapperCard
@@ -27,7 +33,7 @@
2733
<span :id="`violation-${violation.id}`">
2834
{{ violation.help }}.
2935
<em v-show="violation.nodes.length > 1">
30-
({{ `${violation.nodes.length}` }} elements)
36+
({{ `${violation.nodes.length}` }} {{ $vat('els', 'elements') }})
3137
</em>
3238
</span>
3339
</div>
@@ -41,7 +47,9 @@
4147
<span
4248
:id="`see-more-${violation.id}`"
4349
class="va-sr-only"
44-
>See more</span>
50+
>
51+
{{ $vat('see_more', 'See more') }}
52+
</span>
4553
<IconArrowNarrow right />
4654
</button>
4755
</WrapperCard>

Diff for: src/components/PopupButton.vue

+4-2
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
<template>
22
<button
33
class="va-btn va-popup-btn va-w-16 va-h-16 va-relative va-outline-none va-bg-main va-text-color va-border-0 va-rounded-full va-inline-block va-pt-1"
4-
:data-notifications="notifications"
54
aria-haspopup="true"
65
aria-controls="va-popup-box"
76
:aria-expanded="popupShow.toString()"
@@ -14,7 +13,10 @@
1413
aria-live="assertive"
1514
aria-atomic="true"
1615
>
17-
{{ notifications }} <span class="va-sr-only">accessibility issue found</span>
16+
{{ notifications }}
17+
<span class="va-sr-only">
18+
{{ Number(notifications) > 1 ? $vat('btn_label_plu') : $vat('btn_label') }}
19+
</span>
1820
</span>
1921
<svg
2022
v-show="!popupShow"

Diff for: src/components/PopupFooter.vue

+1-1
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@
2525
id="va-btn-run-label"
2626
class="va-text-base va-font-medium va-ml-2"
2727
>
28-
{{ loading ? 'Running' : 'Run again' }}
28+
{{ loading ? $vat('running', 'Running') : $vat('run_again', 'Run again') }}
2929
</span>
3030
</button>
3131
</div>

Diff for: src/components/PopupHeader.vue

+1-1
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@
1313
width="46"
1414
height="45.3"
1515
>
16-
<title id="va-logo-title">Vue axe (opens in a new window)</title>
16+
<title id="va-logo-title">Vue aXe ({{ $vat('open_new_tab') }})</title>
1717
<path
1818
d="M34.4 42h-32L0 38.3 22.6 0l17.2 29.3H33L22.5 13V1.3v14.5L7.8 36.4h26.6a6.1 6.1 0 015.5-3.4 6.1 6.1 0 016.1 6.1 6.1 6.1 0 01-6.1 6.2 6.1 6.1 0 01-5.5-3.4zm2.4-2.9a3 3 0 003 3.1 3 3 0 003.1-3 3 3 0 00-3-3.1 3 3 0 00-3.1 3z"
1919
fill="#3ab982"

Diff for: src/components/PopupLoading.vue

+1-4
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,5 @@
11
<template>
2-
<div
3-
v-show="loading"
4-
class="va-absolute va-top-0 va-left-0 va-bottom-0 va-right-0 va-z-20 va-flex va-items-center va-justify-center va-bg-white va-bg-opacity-75"
5-
>
2+
<div class="va-absolute va-top-0 va-left-0 va-bottom-0 va-right-0 va-z-20 va-flex va-items-center va-justify-center va-bg-white va-bg-opacity-75">
63
<svg
74
width="100"
85
height="100"

Diff for: src/composables/useLocale.js

+12-2
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,13 @@
1-
export default function useLocale () {
2-
// import locales by axe lang
1+
import translations from '../locales'
2+
3+
export default function useLocale (lang) {
4+
const translation = translations[lang] || translations.en
5+
6+
function $t (key, value) {
7+
return translation[key] || value
8+
}
9+
10+
return {
11+
$t
12+
}
313
}

Diff for: src/composables/useVueAxe.js

+6-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,9 @@
1-
import useAxe from '@/composables/useAxe'
21
import merge from 'deepmerge'
32
import VueAxePopup from '@/components/Popup'
43

4+
import useAxe from '@/composables/useAxe'
5+
import useLocale from '@/composables/useLocale'
6+
57
import { ref } from 'vue'
68
import { version } from '../../package.json'
79
import { vueAxe, defaultOptions } from '@/utils/constants'
@@ -11,10 +13,13 @@ export default function useVueAxe (options) {
1113
const highlights = ref(null)
1214
const axeOptions = merge(defaultOptions, options)
1315
const axe = useAxe(axeOptions)
16+
const { $t } = useLocale(axeOptions.config.locale && axeOptions.config.locale.lang)
1417

1518
function registerPlugin (app) {
1619
app.component('VueAxePopup', VueAxePopup)
1720

21+
app.config.globalProperties.$vat = $t
22+
1823
app.provide(vueAxe, {
1924
...axe,
2025
version,

Diff for: src/locales/da.js

-3
This file was deleted.

Diff for: src/locales/de.js

-3
This file was deleted.

Diff for: src/locales/en.js

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
export default {
2+
open_new_tab: 'Opens in a new tab',
3+
no_issues: 'issues found on this page',
4+
btn_label: 'accessibility issue found',
5+
btn_label_plu: 'accessibility issues found',
6+
fix: 'Fix the following',
7+
fixes: 'Fix any of the following'
8+
}

Diff for: src/locales/es.js

-3
This file was deleted.

Diff for: src/locales/eu.js

-3
This file was deleted.

Diff for: src/locales/fr.js

-3
This file was deleted.

Diff for: src/locales/index.js

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import ptBR from './pt_BR'
2+
import en from './en'
3+
4+
export default {
5+
en,
6+
pt_BR: ptBR
7+
}

Diff for: src/locales/ja.js

-3
This file was deleted.

Diff for: src/locales/ko.js

-3
This file was deleted.

Diff for: src/locales/nl.js

-3
This file was deleted.

Diff for: src/locales/pt_BR.js

+25-4
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,28 @@
11
export default {
2-
run_again: 'Executar',
2+
run_again: 'Analisar',
3+
running: 'Analisando',
4+
open_new_tab: 'Abre em uma nova tab',
5+
issue: 'erro',
36
issues: 'erros',
4-
issue_found: 'Erros encontrados',
5-
no_issues_found: 'issues found on this page',
6-
learn_more: 'Saiba mais'
7+
back: 'Voltar',
8+
issue_desc: 'Descrição',
9+
issue_found: 'Erro encontrado',
10+
issues_found: 'Erros encontrados',
11+
no_issues: 'erros nesta página',
12+
btn_label: 'erro de acessibilidade encontrado',
13+
btn_label_plu: 'erros de acessibilidade encontrados',
14+
learn_more: 'Saiba mais',
15+
see_more: 'Saiba mais',
16+
highlight: 'Destacar',
17+
no_highlight: 'Sem destaque',
18+
el_src: 'Código fonte',
19+
more_links: 'Mais links',
20+
congrats: 'Parabéns',
21+
fix: 'Corrija o seguinte',
22+
fixes: 'Corrija qualquer um dos seguintes',
23+
critical: 'Critico',
24+
serious: 'Importante',
25+
moderate: 'Moderado',
26+
minor: 'Leve',
27+
els: 'Elementos'
728
}

Diff for: src/utils/constants.js

+2-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,8 @@ export const defaultOptions = {
55
config: {
66
branding: {
77
application: 'vue-axe'
8-
}
8+
},
9+
locale: null
910
},
1011
runOptions: {
1112
reporter: 'v2',

0 commit comments

Comments
 (0)