As a technical exercise, please could you recreate the first three modules of the following homepage (please don’t recreate the menu);
- Banner module
- Logo module
- Stats module
- Please do not re-create the whole page. Only create the 3 modules (sections) described above (more details will be provided below).
- Please do not copy any of the code (from the site or from the internet), please rebuild yourself.
- Please recreate the animations and hover over effects found in the modules.
- You may use any third party libraries such as jQuery, Vue.js etc but all your own code should be handwritten.
- Think about your module construction in terms of reusability. Make it flexible where appropriate.
- Please place all work on one page/template
- HTML structure
- SCSS General styles
- Get images
- Get fonts --> Had to use Montserrat instead of Sailec
- Get colours
- Banner styling
- Banner hover effects
- Banner animation
- Logo Styling
- Logo hover effects
- Logo slider for mobile --> Using TinySlider
- Stats styling
- Stats grid
- BONUS: Get stats from api --> Using Random Data Api
- Check responsiveness
Slider:
- allows for touch, mousedrag and keystrokes