Landing page for myBike shop. Presents the advantages of muBike bikes, contains information about bikes redy fo purchase and galery. Contains a form for sending messages.
- HTML
- CSS
- Sass (SCSS)
- JavaScript
- BEM
A Pixel Perfect Layout is adaptive and responsive. It works correctly on all screen sizes (mobile, tablet and desktop versions).
In order to decrease user load and avoid code duplication, styles are implemented using Sass (SCSS) including advanced features like mixins, functions, conditional operators etc.
User interaction is implemented using hover effects, transition and JavaScript. The page is interactive and has a smooth animation.
Semantic tags are used.
After practicing with easier Landing page layout I decided to try to implement a more complex one combining all the knowledge in HTML/CSS I have gained so far along with some JavaScript and DOM manipulations in order to make the page more interactive.
The main challenge of this project was to implement more difficult Design then I did before and to make it responsive. I had to use more advanced CSS features like flexbox, grid, media queries, pseudo-classes and pseudo-elements along with Sass (SCSS) features like mixins, functions, conditional operators etc.