The exercise consisted of laying out a web page using HTML5 and CSS3.
This exercise has been solved through the use of flexbox, grid, different types of positioning and some animations and transitions. The index.html document was split into partials. The main.scss document was also segregated into different parts trying to save code, accompanied by the use of variables and nesting. For this project a "develop" branch was used to work on a first stable version of the layout, still without mediaqueries. When the responsive version was ready, both branches were merged. The result is published on GitHub Pages and you can see it here. I hope you like it!
For this we have used the Adalab Web Starter Kit (AWSK), created with node and gulp. Among other things, ADWSK includes an HTML template engine, the SASS preprocessor, and a local server.