search

IHK-GfI / lux-components

Other
17 stars 5 forks source link

lux-button: Aria-Label für Lux-Button ohne Text #417

Closed JWoesteSN closed 5 months ago

JWoesteSN commented 5 months ago

WCAG Success Criterion 4.1.2 Name, Role, Value

Buttons müssen entweder einen lesbaren Inhalt, ein zugeordnetes Label oder ein aria-label haben. Für Lux-Buttons ist das aria-label gleich dem Lux-Label, das auch angezeigt wird. Wir haben Buttons, für die kein Text angezeigt werden soll, für die aber gemäß Barrierefreiheitsvorschrift ein aria-label benötigt wird. Wir benötigen also eine Möglichkeit, das aria-label direkt zu setzen (und damit den leeren Wert des Lux-Labels zu überschreiben).

thodic77 commented 5 months ago

Dies ist möglich, bitte das Attribute luxLabel weglassen und stattdessen luxAriaLabel verwenden. 

<lux-button luxAriaLabel="aaaa" luxIconName="lux-close" [luxRaised]="true"></lux-button>
oder
<lux-button [luxAriaLabel]="myAriaLabel" luxIconName="lux-close" [luxRaised]="true"></lux-button>

image

Sollte dies nicht die Lösung sein, bitte bei mir melden.