FAQ Accordion Card - JavaScript Accordion

Community feedback

• 

  Agata Liberska•3,995

  @AgataLiberskaPosted over 3 years ago

  Hi Richard, well done on this challenge! It's great that you used buttons for the accordion toggle so they're accessible, but it would be good if they had some clear focus styles. The default outline is not showing up, I think it's because of the all: inherit style rule. Maybe to add focus you could use the :focus-within pseudoselector on the h2 elements? You can read more about it here

  Hope this helps

  0

  ---

  

  P

  Richard Cyrus•465

  @richardcyrusPosted over 3 years ago

  @AgataLiberska Thanks for the feedback. I've added focus styles for the buttons.

  0
• 

  P

  tediko•6,680

  @tedikoPosted over 3 years ago

  Hello, Richard Cyrus! 👋

  Good job on this one! Your solution responds well and overall looks good. Here's my suggestion:

  • Try not to repeat your HTML code with image for each arrow. Easier way around is to use pseudo element ::before on your .accordion__trigger element. Set it to position: relative and your pseudo element as position: absolute. Put your image using content: url('image.jpg').

  Good luck with that, have fun coding! 💪

  0