Keyboard navigation, using the tab key, in the donation and membership application form is hard:
- due to overloading the native UI elements with jcf the currently active element (radio in particular) is not indicated
- users cannot navigate to the checkboxes in the address section using the tab key
- the application interferes with the focus after scrolling to specific sections (e. g. when choosing a payment interval using the cursor down key, the notice right of it receives to focus)
Acceptance Criteria:
- No elements other than form fields can receive the input focus
- Amount options reflect having the input focus visually
- Radio buttons and check boxes reflect having the input focus visually
- Users are able to navigate the form using the tab/space keys without any visual artifacts.
Notes:
- Check, if this can be resolved by using ARIA attributes.
- Since the checkboxes and radio buttons are actually hidden and "nice looking" replacements are displayed, the focus of those fields should be reflected visually by something that looks like an input focus.