https://github.com/pintu544/frontend-job-challenge-level-2b
Frontend-Job-Challenge-Level-2B
https://github.com/pintu544/frontend-job-challenge-level-2b
bootstrap html-css-javascript
Last synced: about 2 months ago
JSON representation
Frontend-Job-Challenge-Level-2B
- Host: GitHub
- URL: https://github.com/pintu544/frontend-job-challenge-level-2b
- Owner: pintu544
- Created: 2023-12-25T06:57:25.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2023-12-25T06:58:45.000Z (over 1 year ago)
- Last Synced: 2025-02-10T09:41:41.749Z (4 months ago)
- Topics: bootstrap, html-css-javascript
- Language: HTML
- Homepage: https://pintu544.github.io/Frontend-Job-Challenge-Level-2B/
- Size: 10.7 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Overview
The Restaurant Management App is a comprehensive web application designed to facilitate the efficient management of restaurants. It aims to provide users with a seamless experience for exploring, adding, updating, and discovering various restaurants. The application targets both food enthusiasts and restaurant owners, offering a user-friendly platform to enhance the overall dining experience.
Live Link for Reference
[https://paper-iib--tanaypratap.repl.co/](https://paper-iib--tanaypratap.repl.co/)
# Features
### 1. Home Page
### 1.1 Header
- Title: "BistroPal - Restaurant Management"
- Tagline: "Elevate your restaurant's performance with our efficient restaurant management system."
### 1.2 Call-to-Action
- Button: "Explore Now"
- Functionality: Redirects to the restaurant list page.
### 2. Restaurant List Page
### 2.1 Header
- Title: "Restaurant List"
### 2.2 Filter and Sort
- Cuisine Filter: Enables users to filter restaurants by cuisine.
- Sort Options: Allows sorting by name or rating.
### 2.3 Restaurant Cards
- Card Structure: Each card displays restaurant name, cuisine, address, rating, and buttons for details, deletion, and updating.
- Functionality: Clicking "View Details" redirects to the specific restaurant details page.
### 3. Restaurant Details Page
### 3.1 Header
- Title: [Restaurant Name]
### 3.2 Content
- Information: Displays cuisine, address, city, rating, menu, and reviews for the specific restaurant.
### 3.3 Navigation
- Navbar: Home, Restaurant List, Add Restaurant, About Us
### 4. Add/Update Restaurant Page
### 4.1 Header
- Title: "Add Restaurant" or "Update Restaurant" based on context.
### 4.2 Form
- Fields: Name, Cuisine, Address, City, Rating
- Buttons: "Add Restaurant" or "Update Restaurant" based on context.
### 4.3 Pre-Fill (for Update)
- Functionality: If updating a restaurant, pre-fill the form with existing data.
### 5. About Us Page
### 5.1 Header
- Title: "About Us"
### 5.2 Content
- Mission Statement: Describes the mission of Restaurant Management.
### 5.3 Contact Information
- Email: [email protected]
- Phone: (123) 456-7890
### 6. Navigation
### 6.1 Navbar
- Pages: Home, Restaurant List, Add Restaurant, About Us
- Links: Proper navigation links to each page.
### 7. Footer
### 7.1 Copyright
- Text: "© 2023 BistroPal. All rights reserved."
Technical Specifications
- HTML, CSS, Bootstrap for responsive design.
- JavaScript for dynamic functionality.
- RESTful API for backend communication.
Conclusion
The Restaurant Management Application PRD outlines the key features and technical specifications for the development of a robust platform. It aims to streamline restaurant management, providing a valuable resource for both restaurant owners and enthusiasts. The application's intuitive design and comprehensive features contribute to an enhanced dining experience.
Style Guide
1. ### Landing Page
## Colors
- Primary Color: #007bff (Primary Blue) - Used for the navbar and "Add Restaurant" button.
- Secondary Color: #dc3545 (Danger Red) - Used for danger indicators and the "Delete" button.
- Background Color: #f8f9fa (Light Gray) - Used for the background color of sections.
## Typography
- Heading Font: Use the default Bootstrap heading font.
- Body Text Font: Use the default Bootstrap body font.
## Navbar
- Navbar Background Color: #f8f9fa (Light Gray)
- Navbar Text Color: #000000 (Black)
## Jumbotron
- Jumbotron Background Color: #007bff (Primary Blue)
- Jumbotron Text Color: #ffffff (White)
## Sections
- Section Background Color: #ffffff (White)
- Section Border Color: #dee2e6 (Light Gray)
## Cards
- Card Background Color: #ffffff (White)
- Card Border Color: #dee2e6 (Light Gray)
- Card Text Color: #000000 (Black)
## Images
Special Dish 1: [https://placehold.co/400x300/EFEFEFF/grey?text=Special](https://placehold.co/400x300/EFEFEFF/grey?text=Special) Dish 1
Special Dish 2: [https://placehold.co/400x300/EFEFEFF/grey?text=Special](https://placehold.co/400x300/EFEFEFF/grey?text=Special) Dish 2
Special Order 1: [https://placehold.co/400x300/EFEFEFF/grey?text=Special](https://placehold.co/400x300/EFEFEFF/grey?text=Special) Order 1
Special Order 2: [https://placehold.co/400x300/EFEFEFF/grey?text=Special](https://placehold.co/400x300/EFEFEFF/grey?text=Special) Order 2
## Footer
- Footer Background Color: #f8f9fa (Light Gray)
- Footer Text Color: #000000 (Black)
2. ### Restaurants Page
## Colors
- Primary Color: #007bff (Primary Blue) - Used for the BistroPal navbar and buttons.
- Secondary Color: #dc3545 (Danger Red) - Used for alert messages and delete button.
- Background Color: #f8f9fa (Light Gray) - Used for the page background.
## Alerts
- Loading Alert Background Color: #17a2b8 (Info Blue)
- Error Alert Background Color: #dc3545 (Danger Red)
- Alert Text Color: #ffffff (White)
## Filters and Sorting
- Filter Dropdown Background Color: #ffffff (White)
- Filter Dropdown Text Color: #000000 (Black)
## Restaurant List
- List Item Background Color: #ffffff (White)
- List Item Border Color: #dee2e6 (Light Gray)
- List Item Text Color: #000000 (Black)
- View Details Button Color: #007bff (Primary Blue)
- Delete Button Color: #dc3545 (Danger Red)
- Update Button Color: #ffc107 (Warning Yellow)
3. ### Add Restaurant Page
## Form
- Form Background Color: #ffffff (White)
- Form Text Color: #000000 (Black)
- Form Border Color: #dee2e6 (Light Gray)
- Input Field Background Color: #ffffff (White)
- Input Field Text Color: #000000 (Black)
- Button Background Color: #007bff (Primary Blue) for "Add Restaurant" and #28a745 (Success Green) for "Update Restaurant"
- Button Text Color: #ffffff (White)
4. ### Restaurant Details Page
## Colors
- Primary Color: #007bff (Primary Blue) - Used for the BistroPal navbar.
- Info Color: #17a2b8 (Info Blue) - Used for the loading alert.
- Danger Color: #dc3545 (Danger Red) - Used for the error alert.
- Background Color: #f8f9fa (Light Gray) - Used for the page background.
## Typography
- Heading Font: Use the default Bootstrap heading font.
- Body Text Font: Use the default Bootstrap body font.
## Restaurant Details
- Details Text Color: #000000 (Black)
- Menu Item Text Color: #000000 (Black)
- Review Text Color: #000000 (Black)
5. ### About Us Page
## Jumbotron
- Jumbotron Background Color: #f8f9fa (Light Gray)
- Jumbotron Heading Color: #007bff (Primary Blue)
- Jumbotron Text Color: #000000 (Black)
## Contact Section
- Contact Heading Color: #007bff (Primary Blue)
- Contact Text Color: #000000 (Black)
- Link Color: #007bff (Primary Blue)