Skip to content
Submitted over 1 year ago

FAQ Accordian šŸš€ [SEMANTIC HTML + SASS]

Lungten Wangchukā€¢110
@thelungten
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...FAQ accordion card
  • HTML
  • CSS
  • JS
1newbie

Design comparison

SolutionDesign

Solution retrospective

This is an insanely well designed challenge. It covers a lot of things. I cannot at all say that I did it well but at least I am happy with what I have come up with. I cannot wait to see how others have solved this because there would be millions of ways people can do this. Please, feel free to see my code and comment anything to help me improve my code.

Community feedback

  • Vanza Setiaā€¢27,775
    @vanzasetiaPosted over 1 year ago

    Hi, Lungten Wangchuk! šŸ‘‹

    I strongly recommend having a simpler file structure. You do not need to have src and dist folders. I recommend putting

    • the index.html on the root folder,
    • the css folder on the root folder,
    • the app.js folder on the root folder
    • and then adjusting the other things

    This way, it is easier for people to give feedback on your HTML, CSS, and JavaScript code.

    Here are some suggestions for improvements.

    • All <img> elements must have alt attributes.
    • Use the native HTML elements, the <summary> and <details> elements to create the accordion panels.
    • Use a more modern CSS reset. My recommendation ā€” A Modern CSS Reset | Andy Bell
    • Maybe create functionality where the users can only open one accordion panel at a time.

    I hope this helps. Happy coding! šŸ˜„

    Marked as helpful
    0
    Lungten Wangchukā€¢110
    @thelungtenPosted over 1 year ago

    @vanzasetia You're absolutely helpful. Thank you so much for taking time in reviewing my code. I will take in your suggestions for my next challenges.

    0
    Vanza Setiaā€¢27,775
    @vanzasetiaPosted over 1 year ago

    @thelungten

    Great! šŸ‘

    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