https://github.com/ahmed-elrashidii/mealify

"Mealify" is a responsive restaurant landing page that offers a delightful and engaging user experience. The website showcases various sections including a home page, chefs' profiles, a gallery of appetizing dishes, and a contact section.
https://github.com/ahmed-elrashidii/mealify

css-pseudo-classes css-pseudo-elements css-variables css3 css3-animations dark-mode flexbox-css font-awesome html5 media-embed media-queries responsive-layout semantic-tags vendor-prefix web-development

Last synced: 14 days ago
JSON representation

"Mealify" is a responsive restaurant landing page that offers a delightful and engaging user experience. The website showcases various sections including a home page, chefs' profiles, a gallery of appetizing dishes, and a contact section.

• Host: GitHub
• URL: https://github.com/ahmed-elrashidii/mealify
• Owner: Ahmed-Elrashidii
• Created: 2024-10-17T14:03:07.000Z (6 months ago)
• Default Branch: master
• Last Pushed: 2024-12-01T21:58:53.000Z (5 months ago)
• Last Synced: 2025-03-24T01:35:20.818Z (about 1 month ago)
• Topics: css-pseudo-classes, css-pseudo-elements, css-variables, css3, css3-animations, dark-mode, flexbox-css, font-awesome, html5, media-embed, media-queries, responsive-layout, semantic-tags, vendor-prefix, web-development
• Language: CSS
• Homepage: https://ahmed-elrashidii.github.io/Mealify/
• Size: 1.98 MB
• Stars: 3
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Mealify 🍽️

Mealify is a responsive website designed for a restaurant, focusing on showcasing its chefs, dishes, and ambiance. Built with HTML, CSS, and JavaScript, Mealify features a modern design with a dark mode option, a responsive layout, and interactive elements to enhance user experience.

![Mealify Preview](./img/hero-img.png)

## Features

- **Responsive Design**: Mobile, tablet, and desktop-friendly layouts.

- **Dark Mode Toggle**: Switch between light and dark themes.

- **Interactive Navigation**: Smooth transitions and accessible navigation menu.

- **Sections**:

  - **Home**: Welcoming header with a call-to-action.

  - **Chefs**: Introduction to the restaurant's chefs with social media links.

  - **Gallery**: Showcase of featured dishes.

  - **Contact**: Contact form with integrated Google Maps for location.

- **CSS Animations**: Hover effects and transitions to enhance interactivity.

- **SEO-Ready**: Meta tags and descriptive alt texts for better indexing by search engines.

## Technologies Used

- **HTML5**: For semantic structure.

- **CSS3**: For styling, layout, and animations.

- **JavaScript**: Interactive elements and dark mode toggle.

- **Font Awesome**: Icon library for aesthetic and functional icons.

- **Google Fonts**: Custom fonts for a unique style.

## Installation and Setup

1. **Clone the repository**:

   ```bash

   git clone https://github.com/Ahmed-Elrashidii/Mealify.git

## Contact

For any questions or collaboration requests, feel free to reach out!

 - [Email](mailto:[email protected])

 - [GitHub](https://github.com/Ahmed-Elrashidii)

 - [LinkedIn](https://www.linkedin.com/in/ahmed-elrashidii)