HTML5 semantics and CSS3 features as possible. Cross browser compatibility such as Chrome, Firefox Safari and Edge, latest versions.
- Use of media queries to adapt the layout in small screens. (comp not provided, so I use my creativity).
- Non safe web font used: Lato
- Preprocessors used SASS.
- Clicking on one of the links of the main menu redirects the user to the other pages (only comp for the main page provided so just I use white pages with message on them).
Just add interaction in the middle voting boxes: Kanye West, Mark Zuckerberg, Cristina Fernández de Kirchner and Malala Yousafzai.
- Created a data feed in Firebase with the structure that best suits the content for the voting boxes and populated the initial content from it.
- The user can select either thumb up or thumb down button on each of the boxes (when the button is selected, a white border is displayed as featured in the comp)
- Once the user clicks on the "Vote now” button, a message is displayed saying “Thank you for voting!” as well as a vote again button to vote again.
- There is no limit in the amount of votes
- Percentage bars change depending on the up/or downs votes.
- Persist the current votes was a fact so if the page is refreshed the data is not lost. That's why I used Firebase non relational database
- Framework used React.