Design comparison
Solution retrospective
Hello everyone, I just completed the FAQ Accordion Frontend Mentor Challenge. It was fun building this component. I really enjoyed using Javascript to dynamically set the max-height of the li elements to hide its content. I really took my time to make sure that some small functionality details were handled as best as possible, which made me use the ResizeObserver API to fix some issues when the screen was being resized. I had lots of fun building this component overall, please let me know if there is anything I can improve on, thank you! :D P.S - I didn't use the design files for this project :p
Community feedback
- @DeanogitPosted 11 months ago
Wow! @CloudOfAlemar! This is impressive!
I've been wondering for a while now how its possible to get these cool on loading animations!
I've noticed at the bottom of your CSS file you're using
@keyframes introFaqCard { 0% { opacity: 0; transform: translateY( 20% ); } 100% { opacity: 1; transform: translateY( 0% ); }This really looks great!! What an inspiring solution, I'll dig into the JS more when I have more time, I'd also like to implement the accessibility features in the brief.
Amazing work!
0 - @EugeniaAntonovaPosted 11 months ago
Hello! I really like your solution and as i am a newbie, i have more of a question, than advise: why did you decide to put background images directly into the murkup and not to use background-image? I read it is better practice
0
Please log in to post a comment
Log in with GitHub
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