Responsive Website Country using API , ReactJS, styled, and router

Community feedback

• 

  

  Alex•2,010

  @AlexKMarshall

  Posted over 3 years ago

  The filter functionality seems to work ok, and it is responsive at different screen sizes, well done.

  However, there are some fairly serious accessibility issues.

  The Theme Toggle must be a button. At the moment it's not accessible to a keyboard, and even with a mouse you have to click on the icon, not the text. All interactive elements, must be either buttons or links. This one is a button as it doesn't navigate to a new url.

  It's not possible to use the filters properly with a keyboard. This is because the inputs are missing :focus-visible styles. All form controls and all interactive elements must have properly contrasting :focus-visible styles so that a user knows where they are on the page.

  The countries should load when the user first visits the page. At the moment, when you load the page it shows nothing until you search. Before the user searches the full list of all countries should be displayed.

  00