Skip to content
OverviewSolutions
8
Comments
2
P

Dullahan

@Dullahan83France290 points

I’m a mysterious individual who has yet to fill out my bio. One thing’s for certain: I love writing front-end code!

Latest solutions

View more solutions

Latest comments

  • P
    Dullahan•290
    @Dullahan83

    Hello :)

    Your Solution looks nice,.

    Neverless, after looking at the preview site and your code, there is 2 principal issues that you could fix pretty easily:

    • You shouldn't use a fixed height for the .faq class in your app.css. The height of this container should be the result of the content + the padding. Because actually, if you close all accordions you will have a blank space at the bottom, and if you open most of them at the same time the content will overflow from the container.

    • You should try to hide the bar below the last accordion. Since you use a classname for said bar, it should be pretty easy to do in css with something like .classname:last-of-type{ display: none;}

    I found back this link that you could use to improve further the accordion for better user experience

    I hope this feedback is helpful

    Happy Coding :)

    Marked as helpful
  • P
    Dullahan•290
    @Dullahan83

    Hello :) There is not much you could have done with a static version except create a function that takes expander, panel, panelExpanded and img and call it for every accordion there is. That would avoid repeating all the block and just call the fonction n Times with the different params

    But i would suggest you to look either into design pattern or object oriented programming. Mostly to avoid code repetition, one method create the accordion with question and answer as parameters. That would make it go from static to dynamic and it's more interesting :)

    But your solution works, and it's the most important.

    Marked as helpful