Submitted over 2 years ago

Responsive FAQ accordion using HTML CSS/SCSS Js

Robert•300

@romanrobert

Preview site View code

This is a solution for...FAQ accordion card

HTML
CSS
JS

1newbie

Design comparison

SolutionDesign

Solution retrospective

Hello,

This challenge was a lot of fun.

Would have loved to handle the JS in a different way. Tried using for loop to iterate over each question but every time an event is triggered on a specific question, the class is applied only to the 1st one.

Tips would be gladly appreciated. :)

Community feedback

Doston Nabotov•950
@dostonnabotovPosted over 2 years ago
Hi, there! That looks great! I think, there is a little problem over there. When you open several FAQs, it is overflowing off the card. I guess setting a fixed height is making it happen so. It would be good not to set height, I guess. And, instead, try 'fit-content'. Perhaps, it might work. Everything looks cool! Good luck!
Marked as helpful
0
Robert•300
@romanrobertPosted over 2 years ago
@dostonnabotov

Hello,

Thank you for the tips, Will make sure to implement those changes.

Happy Coding!
0
Kamasah-Dickson•5,590
@Kamasah-DicksonPosted over 2 years ago
Your solution looks great and the JavaScript is working it I think hover states are supposed to be black instead of orange. Like your box shadow there.

Besides good job👍 Happy Coding👍
1
Robert•300
@romanrobertPosted over 2 years ago
@Kamasah-Dickson Hello, I appreciate the feedback. On the given design hover: is orange and only on active state is changing to black.

Happy Coding :)
0
Kamasah-Dickson•5,590
@Kamasah-DicksonPosted over 2 years ago
@romanrobert oh really my bad😂👍 Happy Coding too bro👍😂
1

Please log in to post a comment

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord