Make Icon-Only Buttons and Clickable Cards Accessible By Screen Readers

[Aquilaafuadajo]

Description
Currently some icon-only buttons and clickable cards on the Ushahidi Platform are not accessible by screen readers, so when a user tabs to that button or card location the screen reader just announces "button". This behaviour can confuse a user that relies heavily on keyboard for navigation as they won't know what the button or card does. I have attached a screen recording of the issue for better understanding.

Expected behaviour
Screen readers should announce the purpose for the button so the user understands the action they are about to perform. I plan to fix this on everywhere the issue occurs on the Ushahidi Platform.

Actual Behaviour

new_recording_-_07_03_2024._00_45_28.1080p.mp4

@Angamanga I have submitted my blog post and I'm ready to proceed with this issue, please assign me 🙏🏽

[Aquilaafuadajo]

@Angamanga I'm unable to apply labels to this issue because I don't have the right permissions so I put the label in the title instead. I hope that's okay by you? 🙏🏽