Live Site URL: View live site

Frontend Mentor - FAQ accordion card solution

This is a solution to the FAQ accordion card challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.

Table of contents

• Overview
  • The challenge
  • Screenshot
  • Links
• My process
  • Built with
  • What I learned
  • Useful resources
• Author
• Acknowledgments

Overview

The challenge

Users should be able to:

• View the optimal layout for the component depending on their device's screen size
• See hover states for all interactive elements on the page
• Hide/Show the answer to a question when the question is clicked

Screenshot

Links

• Live Site URL: View live site

My process

Built with

• HTML5
• CSS3
• Adobe XD
• Javascript

What I learned

This is the first project I've done on Frontend Mentor, just after finishing the OpenClassroom curse on Javascript. I faced some difficulties, and I needed to watch a tutorial on Youtube for some parts of the JS. As it's my very first project in Javascript, I think I wouldn't have thought about toggle the 'active' class.

Author

• Website - Kieran LELEUX
• Frontend Mentor - @kilelx

Acknowledgments

Thanks to Coder Coder ( https://www.youtube.com/channel/UCzNf0liwUzMN6_pixbQlMhQ ), the Youtube channel where I could find a solution for some issues.