FAQ Accordion with SASS and NO Javascript

Hey Rael, good job with the design! Unfortunately, I'm not so sure with box shadows so I can't help you there. I did notice that your code has a lot of id selectors. You should use classes instead as they are better for re usability and will give you less headaches when it comes to specificity. I recommend reading this article about it here https://dev.to/clairecodes/reasons-not-to-use-ids-in-css-4ni4 Also, you might be interested in the BEM(Block-Element-Modifier) methodology, as it's a good way to organize code a little bit better. Happy coding!

Hi Rael! I also find box shadows quite tricky to do, it's worth keeping in mind that smooth-looking box shadows are often multiple shadows overlaid on top of each other. And to get the shadow under the box, you'll probably need to give it a separate one - I found this article on using the filter property to add shadows to images.

Maybe check out this list of box shadow examples

Overall though - your solution looks and works well but is not accessible - you can't toggle the accordions with keyboard. The standard would be to use buttons and add JS but if you want to keep it CSS only, maybe try to hide the inputs in an accessible way (using display: none hides the element completely from assistive technologies) and add styling to the labels when the focus is on input.

Hope this helps :)