This repository has been archived by the owner on Mar 17, 2023. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
9e39a95
commit 252b38b
Showing
1 changed file
with
27 additions
and
17 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,35 +1,45 @@ | ||
# IERG4210 Assignment Phase 1 | ||
####Name: Lau Long Ching | ||
####SID: 1155127347 | ||
##Description | ||
|
||
Name: Lau Long Ching | ||
|
||
SID: 1155127347 | ||
|
||
## Description | ||
This project layout is developed with Bootstrap 5 and JQuery. However, I have made some customizations: | ||
- The website supports dark theme. | ||
- Extra JQuery functions are written to let the shopping cart window popover stays on hover. | ||
- The website has implemented responsive UI. | ||
|
||
## Phase 1 marking checklist | ||
1. HTML: Make good use of semantic HTML throughout the whole assignment. | ||
```<header> <nav> <footer> <div> <section> <ul> <li>``` etc. ✅ | ||
|
||
- ```<header> <nav> <footer> <div> <section> <ul> <li>``` etc. ✅ | ||
|
||
2. CSS: Clean separation of HTML, CSS and JS code and files throughout the whole assignment. | ||
No inline CSS and JS are allowed ✅ | ||
No HTML for styling use, e.g. ```<center> align="center"``` etc. ✅ | ||
Tolerance: < 5 exceptions | ||
|
||
- No inline CSS and JS are allowed ✅ | ||
- No HTML for styling use, e.g. ```<center> align="center"``` etc. ✅ | ||
- Tolerance: < 5 exceptions | ||
|
||
3. Main page demonstrates the use of “CSS table-less” product list | ||
Each product has at least its own thumbnail, name, price, and addToCart button ✅ | ||
When the thumbnail or name is clicked, redirect to the corresponding product page ✅ | ||
|
||
- Each product has at least its own thumbnail, name, price, and addToCart button ✅ | ||
- When the thumbnail or name is clicked, redirect to the corresponding product page ✅ | ||
|
||
4. Main page demonstrates the use of “CSS hover” shopping list | ||
When displayed, it will cover any elements behind ✅ | ||
Input boxes are used for inputting the quantity of each selected product ✅ | ||
A checkout button is used (supposed to submit the list to PayPal, currently no function) ✅ | ||
The shopping list is displayed on both main and product pages ✅ | ||
|
||
- When displayed, it will cover any elements behind ✅ | ||
- Input boxes are used for inputting the quantity of each selected product ✅ | ||
- A checkout button is used (supposed to submit the list to PayPal, currently no function) ✅ | ||
- The shopping list is displayed on both main and product pages ✅ | ||
|
||
5. Product page provides product details | ||
To show a full-size or bigger image, name, description, price, and addToCart button ✅ | ||
To display the inventory of the item ✅ | ||
|
||
- To show a full-size or bigger image, name, description, price, and addToCart button ✅ | ||
- To display the inventory of the item ✅ | ||
|
||
6. Both main and product pages should include a hierarchical navigation menu | ||
e.g., Home or Home > Category1 or Home > Category1 > Product1 ✅ | ||
They are hyperlinks that can redirect users to an upper level of the hierarchy ✅ | ||
|
||
- e.g., Home or Home > Category1 or Home > Category1 > Product1 ✅ | ||
- They are hyperlinks that can redirect users to an upper level of the hierarchy ✅ | ||
|