The 5-star rating system allows respondents to rank their feedback on a 5-point scale from 1 to 5 star. This project made with HTML, CSS and JavaScript.
Users should be able to:
- View the optimal layout for the app depending on their device's screen size
- See hover states for all interactive elements on the page
- Select and submit a number rating
- See the "Thank you" card state after submitting a rating
- Solution URL: Add solution URL here
- Live Site URL: Add live site URL here
- Semantic HTML5 markup
- CSS, Sass
- Flexbox
- Desktop First Workflow
- JavaScript Array forEach()
- HTML DOM Element addEventListener()
- If else Statement
The designs were created to the following widths:
- Mobile: 375px
- Desktop: 1440px
- Orange: hsl(25, 97%, 53%)
- White: hsl(0, 0%, 100%)
- Light Grey: hsl(217, 12%, 63%)
- Medium Grey: hsl(216, 12%, 54%)
- Dark Blue: hsl(213, 19%, 18%)
- Very Dark Blue: hsl(216, 12%, 8%)
- Font size (paragraph): 15px
- Family: Overpass
- Weights: 400, 700