Welcome to the sushi website project, a showcase of popular food, trending sushi, and drinks crafted using HTML and CSS. This project features smooth and subtle animations to enhance the user experience, providing a visually appealing presentation of various sushi dishes and beverages.
- HTML 5
- CSS 3
- Vite
- CSS Variables: Utilize CSS variables to maintain a consistent and easily adjustable styling approach throughout the project.
- Importing CSS Files: Import CSS files into others, promoting modularity and organization in styling.
- Flex and Position Properties: Use of flex and position properties in CSS to create responsive and well-structured layouts.
- Rendering HTML through JavaScript: Rendering HTML through JavaScript using reusable functions, enhancing code efficiency.
- Smooth Animations: Smooth and subtle animations to enhance the overall user experience, focusing on fluid transitions.
- BEM Method: Follow the Block Element Modifier (BEM) methodology for naming classes, promoting a clear and maintainable structure.
- Organized File and Folder Structure: Maintain a well-organized file and folder structure for easy navigation and management of project assets.
- Responsive Design: The application is completely responsive across all devices, employing responsive design techniques such as media queries and fluid layouts.
All these features were implemented while creating the sushi website, which includes:
- Navigation Bar
- Creative Hero Section
- About Us Section
- Popular Food, Trending Sushi, and Drinks Sections
- Newsletter Signup and Footer
Follow these steps to set up the project locally on your machine.
Make sure you have the following installed on your machine:
- Git
- Node.js
- npm (Node Package Manager)
git clone https://github.com/adrianhajdin/project_html_css_website.git
cd project_html_css_website
npm install
npm run dev