etkr4k/bedolaga-cabinet
1
0
Fork 0
mirror of https://github.com/chillpadclub/bedolaga-cabinet.git synced 2026-07-28 09:33:46 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(a11y): label associations for AdminInfoPageEditor fields

Browse Source 
Add htmlFor/id pairs for slug, icon, sort-order, replaces-tab and title inputs (WCAG 1.3.1).
This commit is contained in:
c0mrade
2026-05-26 00:40:12 +03:00
parent fefc52fb20
commit a4897243ba
1 changed files with 18 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
src/pages/AdminInfoPageEditor.tsx
View File

@@ -1126,8 +1126,11 @@ export default function AdminInfoPageEditor() {
<div className="space-y-5"> <div className="space-y-5">
{/* Slug */} {/* Slug */}
<div> <div>
<label className="label">{t('admin.infoPages.fields.slug')}</label> <label htmlFor="ip-slug" className="label">
{t('admin.infoPages.fields.slug')}
</label>
<input <input
id="ip-slug"
type="text" type="text"
value={slug} value={slug}
onChange={(e) => { onChange={(e) => {
@@ -1142,8 +1145,11 @@ export default function AdminInfoPageEditor() {
{/* Icon + Sort Order row */} {/* Icon + Sort Order row */}
<div className="grid gap-4 sm:grid-cols-2"> <div className="grid gap-4 sm:grid-cols-2">
<div> <div>
<label className="label">{t('admin.infoPages.fields.icon')}</label> <label htmlFor="ip-icon" className="label">
{t('admin.infoPages.fields.icon')}
</label>
<input <input
id="ip-icon"
type="text" type="text"
value={icon} value={icon}
onChange={(e) => setIcon(e.target.value)} onChange={(e) => setIcon(e.target.value)}
@@ -1152,8 +1158,11 @@ export default function AdminInfoPageEditor() {
/> />
</div> </div>
<div> <div>
<label className="label">{t('admin.infoPages.fields.sortOrder')}</label> <label htmlFor="ip-sortorder" className="label">
{t('admin.infoPages.fields.sortOrder')}
</label>
<input <input
id="ip-sortorder"
type="number" type="number"
value={sortOrder} value={sortOrder}
onChange={(e) => setSortOrder(Number(e.target.value) || 0)} onChange={(e) => setSortOrder(Number(e.target.value) || 0)}
@@ -1199,8 +1208,11 @@ export default function AdminInfoPageEditor() {
{/* Replaces tab selector */} {/* Replaces tab selector */}
<div> <div>
<label className="label">{t('admin.infoPages.fields.replacesTab')}</label> <label htmlFor="ip-replaces-tab" className="label">
{t('admin.infoPages.fields.replacesTab')}
</label>
<select <select
id="ip-replaces-tab"
value={replacesTab ?? ''} value={replacesTab ?? ''}
onChange={(e) => setReplacesTab((e.target.value || null) as ReplacesTab | null)} onChange={(e) => setReplacesTab((e.target.value || null) as ReplacesTab | null)}
className="input max-w-xs" className="input max-w-xs"
@@ -1250,10 +1262,11 @@ export default function AdminInfoPageEditor() {
{/* Title for current locale */} {/* Title for current locale */}
<div> <div>
<label className="label"> <label htmlFor="ip-title" className="label">
{t('admin.infoPages.fields.title')} ({t(`admin.infoPages.locales.${activeLocale}`)}) {t('admin.infoPages.fields.title')} ({t(`admin.infoPages.locales.${activeLocale}`)})
</label> </label>
<input <input
id="ip-title"
type="text" type="text"
value={titles[activeLocale] ?? ''} value={titles[activeLocale] ?? ''}
onChange={(e) => setTitles((prev) => ({ ...prev, [activeLocale]: e.target.value }))} onChange={(e) => setTitles((prev) => ({ ...prev, [activeLocale]: e.target.value }))}