Project Overview

Este README também está disponível em Português.

This project is a responsive product showcase website built with LESS. It demonstrates the use of variables, mixins, color maps, media queries, and automated compilation with LESS plugins. The layout features a sticky header, a responsive product grid, and interactive buttons.

🔗 Live Demo: View on Vercel

Technologies Used

• HTML5
• CSS3 / LESS
• LESS Watch Compiler
• LESS Plugins
• Responsive Design
• Grid Layout
• Hover Effects

How to Run

1. Clone the repository.
2. Install dependencies with npm install.
3. Run the LESS compiler to watch and build CSS:

npm run dev

4. Open index.html in your browser to view the product page.

Features

• Sticky header with navigation
• Responsive product grid using CSS Grid
• Reusable LESS variables, mixins, and color maps
• Interactive buttons with hover effects
• Placeholder images for easy customization

Additional Notes

This project is intended for practicing LESS features and responsive design concepts. The layout adapts to desktop, tablet, and mobile screen sizes automatically.

Related Repository

This is the second project practicing LESS and its plugins. You can check out the first repository here.