[SOLVED] Cosc484 assignment 1

DoorDash, Grubhub, and UberEats have been dominating the food delivery
market, so to combat this, Towson is coming up with a ghost kitchen, TUEats.
You are assigned to the team that is working on the signup flow for new users.
Please use a text editor of your choice to create tueats.html, tueats.css and
tueats completed.html.
The second phase of the TUEats project is to add some styling. This portion of
the assignment must be done only in CSS. You must link your tueats.html
file to tueats.css, as an external CSS.
tueats.html (HTML)
For tueats.html, you will need to:
• Create a “Sign Up” fieldset with:
– A username textfield (required)
– An email address textfield (required)
– A referral code (optional)
– A password obscured textfield (required)
– A password verify obscured textfield (required)
– A checkbox with a label to the right side saying: “Sign up for our
newsletter?”
• A “Menu” fieldset that contains a 4×4 table (including the table headers):
– Row 1: There will be four table heading fields: “” (aka blank),
“Name”, “Price”, and “Calories”
1
– Row 2: “item 1”, “Burger”, “$8”, “550”
– Row 3: “item 2”, “Mozzarella Sticks”, “$7”, “400”
– Row 4: “item 3”, “Fries”, “$4”, “400”
– You’ll notice (r3,c4), (r4,c4) both have “400”. Make is so it only says
“400” once for column 4 across rows 3-4 (HINT: look at rowspan and
colspan)
– Caption the table saying “Menu is subject to change, please visit our
main site for more information” and the words “Towson Website” is
a link that takes users to towson.edu if clicked.
• A single submit button that performs a GET request onsubmit to tueats completed.html.
Please note if this path is hardcoded with an absolute, i.e.
/Users/yourname/Desktop/assigments/tueats completed.html OR even using /tueats completed.html it will not work when used on another machine. Please ensure this is a relative path i.e. just using ”tueats completed.html”
as long as it is in the same folder as tueats.html, otherwise points will be
deducted.
tueats.css (CSS)
For tueats.css, you need to:
• Add CSS to the menu table
– Bold all table header elements
– Make the width of the table 75%
– Add a 1px solid black border
– Align the text in the table to be centered
– Make the background of the table to be gray (HEX: #808080)
• Add a picture for TUEats (this can be any photo you choose online (Towson logo is fine), just be sure there is a comment in your CSS sourcing
it).
• Change the “Welcome to TUEats” header to the Towson Gold (see below
for exact color).
• If a user hovers over any link in the page (this should only be the “Towson
Website” link in the table caption), it should turn Towson’s Gold color.
tueats completed.html
For this tueats completed.html, you need to:
• Simply say “Welcome to TUEats” in any heading tag size of your choice.
2
Notes
Towson’s color scheme:
• HEX: #FFBB00
• RGB: 255, 187, 0
This link can serve as a guide for some table styling: W3 Schools
Example TUEats.html
Note: I am currently hovering over “main site” in the image above
Submission
Please submit the following on Blackboard:
• tueats.html
• tueats.css
• tueats completed.html
• any image files needed