DavidsTea-clone

Project Description

A clone of DavidsTea's index page
Tools: HTML5, CSS3 and Vanilla JavaScript
Deployed at https://davidstea-clone.netlify.app/

Biggest achievement

I used 3 different ways to create the carousals/sliders

Takeaways

Semantic tags in HTML
CSS media query in particular
display:none
How to center a div
- flexbox/grid
- margin auto
- position relative + left (50%) + translate (50%)
- text-align/vertical-align
- float

To-dos

Responsive design best practices
- Page is not fully responsive on mobile devices => <meta name='viewport' content='width=device-width, initial-scale=1.0'>
Learn more about the CSS selectors