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