PLEASE SOLVE FULL CODE FOR THE FIRST PART $($STYLING$)$ PROJECT MAIN GOAL:

Use current web and Internet development tools and techniques to create a small webapplication.

PROJECT THEME: Web$-$Based Supermarket Website the main functionalities of the system might include but not limited to the following:

Website design requirements:

Use only basic HTML$/$CSS$/$Media Query to create simple responsive website for three views $($Desktop$,$ Tablet and Mobile$).$ No Bootstrap or any readymade code should be used.

Make it attractive looking and unified in all pages. No need to make it professional.

DON'T USE READY MADE TEMPLATES or FRAMEWORK as the aim of this project is to learn web designing from scratch. Any group violate this rule, will receive ZERO in the web design.

Registration and Login

Customer users can register themselves to the system $($must be validated using regular expressions in PHP$,$ HTML$5$ validation shouldn't be used$).$ JS$/$AJAX should be used to verify the username is available or not $($JQuery isn't allowed$).$

One admin user should be predefined with user$=$admin, password$=$abc $123.$

Only admin users, can create staff users accounts, to manage the supermarket inventory and process customers' orders.

All users $($customer$/$staff$/$admin$)$ can login to the system $($authorization$)$

Customer Users

Users can browse all products by categories, search for an item using keywords, view item details by clicking on the item.

Users can add items to the basket, view basket, view total price including delivery charges, delete$/$update items, place order. Note: users shouldn't be able to order more than the available quantity in the inventory.

Users can track their the orders' status $($acknowledged$,$ in process, completed etc$)$

Users can view previous order.

Staff Users

Staff users can view current active orders with corresponding buttons to mark their status with acknowledged, in process, in transit and completed.

Staff can update products inventory $($quantity of the products$).$

$[$Self Learning$]$ Staff users can add new items with pictures $($require file upload$)$ to the supermarket DB$.$

Note: All form Inputs should be Validated using regular expressions for all the functions you have implemented.

MAIN PROGRAMMING TOOLS:

Assume the website will live on an Apache server so it can only be implemented in PHP$,$ HTML$/$CSS and or JavaScript along with the use of MYSQL database. YOU MUST USE PDO$/$PHP interface to access MYSQL$.$

GRADING:

Basically, the grade will be divided into the following areas:

Final Implementation: $(80\%).$:Thelevelofcomple$tyandthe$

$u$ mberofthe functions you implement using PHP$,$ or database and$/$or JavaScript$/$Ajax $+$ the responsive web design.

Final submission and Demonstration $(20\%).$: $($complete code$/$DB$)-$ Any delay or missing details in the submission will effect the overall grades of the project.

a$.$ The instruction should include the following:

i$.$ Team members details $($Student ID$,$ Name and Section$)$

ii$.$ Instructions to access your system $($usernames$/$passwords of existing users for testing purposes$)$

iii. Instructions to setup your submitted code$/$DB in local computer.