refactor: replace hardcoded aria-labels with i18n keys, add common.close/remove/home

This commit is contained in:
2026-02-05 15:21:28 +01:00
parent 715ab3ea13
commit 43add27732
9 changed files with 20 additions and 11 deletions

View File

@@ -107,7 +107,7 @@ class AppHeader extends HTMLElement {
render() {
this.innerHTML = /* html */`
<div class="header-inner container">
<a href="#/" class="logo" aria-label="dgray.io Home">
<a href="#/" class="logo" aria-label="dgray.io ${t('common.home')}">
<img src="assets/logo-light.svg" alt="dgray.io" class="logo-img logo-light" width="100" height="28">
<img src="assets/logo-dark.svg" alt="dgray.io" class="logo-img logo-dark" width="100" height="28">
</a>

View File

@@ -63,7 +63,7 @@ class AuthModal extends HTMLElement {
this.innerHTML = /* html */`
<div class="modal-overlay" id="modal-overlay">
<div class="modal-content">
<button class="modal-close" id="modal-close" aria-label="Close">
<button class="modal-close" id="modal-close" aria-label="${t('common.close')}">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<line x1="18" y1="6" x2="6" y2="18"></line>
<line x1="6" y1="6" x2="18" y2="18"></line>

View File

@@ -37,10 +37,10 @@ class ErrorBoundary extends HTMLElement {
this.innerHTML = /* html */`
<div class="error-boundary">
<div class="error-icon">⚠️</div>
<h3 class="error-title">${t('error.title') || 'Etwas ist schiefgelaufen'}</h3>
<h3 class="error-title">${t('error.title')}</h3>
<p class="error-message">${escapeHTML(errorMessage)}</p>
<button class="btn btn-primary error-retry" type="button">
${t('error.retry') || 'Erneut versuchen'}
${t('error.retry')}
</button>
</div>
`
@@ -131,7 +131,7 @@ function showErrorToast(message) {
toast.innerHTML = /* html */`
<span class="error-toast-icon">⚠️</span>
<span class="error-toast-message">${escapeHTML(message)}</span>
<button class="error-toast-close" aria-label="Schließen">×</button>
<button class="error-toast-close" aria-label="${t('common.close')}">×</button>
`
document.body.appendChild(toast)

View File

@@ -53,7 +53,7 @@ class ImageCropper extends HTMLElement {
<div class="cropper-modal">
<div class="cropper-header">
<h3>${t('cropper.title')}</h3>
<button type="button" class="cropper-close" id="cropper-close" aria-label="Close">
<button type="button" class="cropper-close" id="cropper-close" aria-label="${t('common.close')}">
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<line x1="18" y1="6" x2="6" y2="18"></line>
<line x1="6" y1="6" x2="18" y2="18"></line>

View File

@@ -493,7 +493,7 @@ class PageCreate extends HTMLElement {
return this.imagePreviews.map((src, index) => /* html */`
<div class="image-preview">
<img src="${src}" alt="Preview ${index + 1}">
<button type="button" class="remove-image" data-index="${index}" aria-label="Remove">
<button type="button" class="remove-image" data-index="${index}" aria-label="${t('common.remove')}">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<line x1="18" y1="6" x2="6" y2="18"></line>
<line x1="6" y1="6" x2="18" y2="18"></line>

View File

@@ -355,7 +355,7 @@ class PageListing extends HTMLElement {
renderContactDialog() {
return /* html */`
<dialog class="contact-dialog" id="contact-dialog">
<button class="dialog-close" id="dialog-close" aria-label="Close">
<button class="dialog-close" id="dialog-close" aria-label="${t('common.close')}">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<line x1="18" y1="6" x2="6" y2="18"></line>
<line x1="6" y1="6" x2="18" y2="18"></line>