This project is solely for learning purposes. I take no any responsibility or liability for the accuracy, completeness, or usefulness of any information provided in this project. You should not use it as a reference for creating your project.
I am currently no longer working on this project.
Welcome to the README.md of this repo! In this file I'm going to tell you everything, start from what tool I use, how to contribute, and much more.
This my first JavaScript challenge from Frontend Mentor after learning JavaScript for about one month.
That's it for the introduction and happy reading!
The challenge is to build out this FAQ accordion card and get it looking as close to the design as possible.
The users should be able to:
- View the optimal layout for the component depending on their device's screen size
- See hover states for all interactive elements on the page
- Hide/Show the answer to a question when the question is clicked
Additional challenge for accessibility:
- User should be able to navigate this website using keyboard
- User should be able to understand the page content when using screen reader
- Live Review
- Frontend Mentor Solution
- HTML Semantic Tags
- BEM (Block, Element, Modifier) Class Naming Convention
- Sass
- Vanilla JavaScript
- CSS Flexbox
- Mobile-first workflow
- Normalize.css
- Eruda - mobile console browser
Accordion Example | WAI-ARIA Authoring Practices 1.1 - I didn't know how to create an accessible accordion, but this example helps me out! It tells me the exact markup and the explanation.
The motivation to create a great README.md is coming from awesome-readme repository where it lists a lot of great projects with awesome README.md. That also my inspiration when I want to improve my README.md.
See the documentation.