Responsive templates (All tasks)

[Ramin-RX7]

You have to make our template responsive:

Note that all of these features are supposed to be in the phone view, Please change the PC view as less as possible.

Base

• Navbar:

  • In phone view, the cart button must be directly in the navbar (and also in the expandable menu)

• Customer login form:

  • It has to fit the screen width
  • make the form bigger and easier to access
  • put the image below the form

Index

• Working times section has to have those two images below the text. The text has to fit the screen width
• (PC Screen) The main section content (the one above all) has to be placed higher than what it is.
• The main section content has to fit the screen width

Category List

• Images must be bigger, They have fit the screen width and the text has to be below them (The text also has to be fit with screen width)

Menu

• Category images must be bigger, they have to fit the screen.
• The description of them must be below them
• Food images must be bigger (one in each row), but they have to be smaller than categories images
• Food details must be below their image.

Dashboard

• Each order must fit the screen size
• EditOrder page: make the main order description form bigger
• EditOrder page: each OrderItem form must be in it's own row
• EditOrder page: the AddItem form must fit the screen size
• Add sidebar to the page. (in PC it is located on the left side of the screen and in the phone screen it has to be placed lower than the main content.

Cart

• Make each item fit the content.
• Put them in a box where it is clear that the text and image are all for one item

Orders

• Each row must have only one OrderItem in it
• All of the text in the page must be bigger
• Do both of the tasks above for the order details page