Natours is a web project that offers exciting tours for adventurous people. It provides users with detailed information about various tours, allows them to book tours, and shares stories from people who have experienced the tours. This project demonstrates the use of advanced CSS and Sass for creating a beautiful and responsive web design.
- Responsive Design: The website is fully responsive, providing a seamless experience across different devices.
- Navigation Menu: A stylish and interactive navigation menu.
- Tour Information: Detailed information about various tours.
- Booking Form: A form to book tours.
- User Stories: Stories from people who have taken the tours.
- Background Video: A beautiful background video to enhance the visual appeal.
- CSS Grid and Flexbox: Utilizes CSS Grid and Flexbox for layout management.
- HTML
- CSS
- Sass
/natours
|-- /css
| |-- fonts
| |-- icon-font.css
| |-- style.comp.css
| |-- style.concat.css
| |-- style.css
| |-- style.prefix.css
|
|-- /img
|
|-- /node_modules
|
|-- /sass
| |-- abstracts
| |-- base
| |-- components
| |-- layout
| |-- pages
| |-- _home.scss
|
|-- main.scss
|-- npm-debug.log
|-- index.html
|-- package.json
- Clone the repository:
git clone https://github.com/kamrancodex/natours.git
Navigate to the project directory:
cd natours
Install the dependencies:
npm install
Compile the Sass files to CSS:
npm run compile:sass
Open index.html in your browser to view the website.
Kamran Bashir - Built the project using advanced CSS and Sass. Jonas Schmedtmann - Original author and inspiration for the project design. Built using advanced CSS and Sass. A credit to the original author, Jonas Schmedtmann, is highly appreciated!