Live website : gc2018.com
- The environment deployed : Linux, Docker, Drupal 8
- Main task : UI development, UI cross browsing test, defects fix
- The project site launched around April 2016
The GC2018 project required a high depth of CSS3 work. Most of the grid fits are very customised and setup with the value of vh and vw. Responsive grid configuration uses foundation 6 or Bootstrap3 for devices, and the break point falls to xs, sm, md, lg. This project, however, uses a susy custom grid and all the view breakpoints are very specified for all browsers and devices. That was a hard working job.
Unlike other projects, this project relies entirely on Drupal's content generate flow. Which means I cannot setup particular classes or IDs on the template markups. Each of modules inherited from parent modules, parent modules cascading from their parent container and so on. What I did for targeting parent-child connections on elements and referred the SMACSS and BEM guide documents. This project was testing my problem-solving skills of CSS3.
The component animation, gradients, stylings are using compass functions.
Left : mobile menu / Right : mobile version of grid. For the detail check, I recommend you go to website.