Answered step by step
Verified Expert Solution
Link Copied!

Question

1 Approved Answer

Assignment 2 Information City Coffee House City Coffee House Home Menu Events Event Registration Relax at City Coffee Friendly and eclectic - City Coffee House

Assignment 2 Information

      City Coffee House    

City Coffee House

  • Specialty Coffee and Organic Tea
  • Bagels, Muffins and Gluten-free Pastries
  • Organic Salads
  • Music and Poetry Readings
  • Open Mic Night
12010 Broad Street
Richmond, VA 23234
888-555-5555

© 2021 City Coffee House
yourfirstname@yourlastname.com

menu.html containing the menu page:

      City Coffee House Menu    

City Coffee House

Just Java
Regular house blend, decaffeinated coffee, or flavour of the day.
Endless cup $3.50
Cafe au Lait
House blend coffee infused into a smooth, steamed milk.
Single $4.00 Double $5.00
Iced Cappuccino
Sweetened expresso blended with icy-cold milk and served into a chilled glass.
Single $5.00 Double $6.50
© 2021 City Coffee House
yourfirstname@yourlastname.com

event.html containing the schedule of events. Here, no information was mentioned about the schedule of events, so I kept the main body blank, and only created the navigation links and the footer.

      City Coffee House Events    

City Coffee House

ereservation.html containing the event bookings. No information was mentioned about event booking, so I kept the main body blank, and only created the navigation links and the footer.

      City Coffee House Reservation    

City Coffee House

CSS file for very basic styling:

body { padding-left: 10px; } .nav { list-style-type: none; margin: 0; padding: 0; } .nav li { display: inline-block; font-size: 20px; }

image text in transcribed

image text in transcribed

image text in transcribed

image text in transcribed

image text in transcribed

image text in transcribed

image text in transcribed

Please provide comments on this assignment for all 4 HTLM and CSS codes.

This assignment is continuation of assignment 2. You will add CSS on the pages and complete the web site you created during assignment 2. Following are instructions to complete index and menu page Task 1: Create a folder on your hard drive called citycofee2. Copy all the files from your assignment 2 folder into the citycoffee2 folder to keep you assignment work separate. Task 2: The External Style Sheet. You will use a text editor to create an external style sheet named style.css. Code the CSS to configure the following: 1. Global styles for the document (use the body element selector) with background color #FCEBB6; text color #221811; and Verdana, Arial, or any sans-serif font. 2. Styles for the header element selector that configure background color #D2B48C, font radley Hand, cursive; 3. Styles for the h1 element selector that configure 200% line height. 4. Styles for the nav element selector that configure centered, bold text. Hint: Use the CSS text-align and font-weight properties. 5. Styles for the footer element selector that configure background color #D2B48C, small font size (.60em), italics, and centered text. Save the file as style.css in the folder. Check your syntax with the CSS validator (http://jigsaw.w3.org/css-validator). Correct and retest if necessary. Task 2: The Home Page. Launch a text editor, and open the index.html file. You will modify this file to apply styles from the style.css external style sheet as follows: 1. Add a element to associate the web page with the style.css external style sheet file. 2. Configure the navigation area. Remove the elements which are no longer needed because you have configured bold text with CSS. 3. Configure the page footer area. Remove the and elements-they are no longer needed since CSS is now used to configure the text. 4. download images file from blackboard and save in the same folder of your html and css file folder. 5. Add image logocup.png before

tag in
tag tag. 7. Add paragraph below

tags with following content Were a little out of the way, but take a drive down Garrett Bay Road to today! Indulge in our locally roasted free-trade coffee and home-made pastries. You'll feel right at home at City Coffee! Save the index.html file, and test it in a browser. Your page should look similar to the one shown in Figure City Coffee House Home Menu Events Event reservation Relax at City Coffee Friendly and eclectic City Coffee House is the perfect place to take a break, enjoy a refreshing beverage, and have a snack or light meal. Specialty Coffee and Organic Tea Bagels, Muffins, and Gluten-free Pastries Organic Salads Music and Poetry Readings Open Mic Night 12010 Broad street Richmond, VA 23234 888-555-5555 Copyright 2021 City Coffee House yourfirstnameyourlastname.com Task 3: The Menu Page. Launch a text editor, and open the menu.html file. You will modify this file in a similar manner as you modified the home page: Add the element and configure the navigation and page footer areas. Save and test your new menu.html. Task 4: To center Page Layout with CSS. Modify style.css, index.html, and menu.html to configure page content that is centered with 80% width. 1. Launch a text editor, and open the style.css file. Add a style rule for an id named wrapper with width set to 80%, margin-right set to auto, margin-left set to auto, min-width 900px, max-width 1280px and set the box shadow 3px 3px 3px and #676767 i-add color #8C3826 and height 100px in the header selector. Save style.css 2. Launch a text editor, and open the index.html file. Add the HTML code to configure a div element assigned to the id wrapper that "wraps," right after body tag and close div tag before close body tag, the code within the body section. Save and test your index.html page in a browser and you'll notice that the page content is now centered within the browser viewport. 3. do the following steps i. download images file from blackboard and save in the same folder of your html and css file folder. ii. Add image logocup.png before

tag in
tag tag. iv. Add paragraph below

tags with following content Were a little out of the way, but take a drive down Garrett Bay Road to today! Indulge in our locally roasted free-trade coffee and home-made pastries. You'll feel right at home at City Coffee! Save index.html Task 5. Launch a text editor, and open the menu.html file. Add the HTML code to configure a div element assigned to the id wrapper that "wraps," right after body tag and close div tag before close body tag, the code within the body section. Save and test your menu.html page in a browser and you'll notice that the page content is now centered within the browser viewport. Do the following for making menu page same as index page. i. Add image logocup.png before

tag in
tag tag. Save menu.html SSS City Coffee House Home Menu Events Event reservation Relax at City Coffee We're a little out of the way, but take a drive down Garrett Bay Road to today! Indulge in our locally roasted free-trade coffee and home-made pastries. You'll feel right at home at City Coffee! Friendly and eclectic - City Coffee House is the perfect place to take a break, enjoy a refreshing beverage, and have a snack or light meal. City Coffee Bar features: AD Specialty Coffee and Organic Tea Bagels, Muffins, and Gluten-free Pastries Organic Salads Music and Poetry Readings Open Mic Night 12010 Broad street Richmond, VA 23234 888-555-5555 Copyright 2 City Care House Task 6: Event page: Use the html and css we did so far to create event page and link it to event menu on each page. Your event page should look like as follows. Feel free you add more listing in event table and also apply css such as back ground color, text color, and width of cell etc Image name for upcoming events is upevents.jpg. Background color for heading row is #D2B48C Background color for odd rows is #ebd391 Background for even rows is #c99608 SSS City Coffee House Home Menu Events Event reservation list of Event at City Coffee Shop UPCOMING EVENTS Date Time Event Guest Sponsor Frequency Detail March 10th 5:00PM Book Review Robert Walser's Virgina Books Club Monthly Join the Community Bookstore for an event March 11th 3:00PM Movie Review Dan J. Johnson Virgin Movie Club Monthly Safer at Home March 12th 6:00PM Music Evening Melanie Morris Richmond Music Club weekly Melanie Morris entertains with her melodic folk style March 13th 8:00PM Story night Mark Eitzel Chesterfield Library weekly Tahoe Greg is back from his tour. New songs. New stories. All the events are free and required pre-registration due to limited seating. Jolin and reserver you seat today 12010 Broad street Richmond, VA 23234 888-555-5555 Copyright 2021 City Coffee House purfirstrameurlastram.com Task 7: Event Reservation page: Create Event reservation page with html and css. The page contains a form as shown below. For date use : SSS City Coffee House Home Menu Events Event reservation Reserve Your event R E S ER V E D Please fill the following form Event Details Event Name: 1 Sponsor : 1 Guest : please enter detail of event Deatil : Frequency : Weekly Event Start Date 01/01/2000 Enter your email: Contact Method O E-mail O Mobile Whatsapp In app Chat Submit request Clear Form Copyright 2021 City Coffee House You are free to add any new page. Navigation bar Should have the same navigation bar on all page. The bar should have four hyperlinks: Home, Menu, Event and Event Reservation. Each link should take you to its' respective page. If for example, you are on the home page, the home link should do nothing when you click it, and the same for all other links. O Submission rules Save 4 HTML and 1 CSS documents in a folder citycoffee2 This assignment is continuation of assignment 2. You will add CSS on the pages and complete the web site you created during assignment 2. Following are instructions to complete index and menu page Task 1: Create a folder on your hard drive called citycofee2. Copy all the files from your assignment 2 folder into the citycoffee2 folder to keep you assignment work separate. Task 2: The External Style Sheet. You will use a text editor to create an external style sheet named style.css. Code the CSS to configure the following: 1. Global styles for the document (use the body element selector) with background color #FCEBB6; text color #221811; and Verdana, Arial, or any sans-serif font. 2. Styles for the header element selector that configure background color #D2B48C, font radley Hand, cursive; 3. Styles for the h1 element selector that configure 200% line height. 4. Styles for the nav element selector that configure centered, bold text. Hint: Use the CSS text-align and font-weight properties. 5. Styles for the footer element selector that configure background color #D2B48C, small font size (.60em), italics, and centered text. Save the file as style.css in the folder. Check your syntax with the CSS validator (http://jigsaw.w3.org/css-validator). Correct and retest if necessary. Task 2: The Home Page. Launch a text editor, and open the index.html file. You will modify this file to apply styles from the style.css external style sheet as follows: 1. Add a element to associate the web page with the style.css external style sheet file. 2. Configure the navigation area. Remove the elements which are no longer needed because you have configured bold text with CSS. 3. Configure the page footer area. Remove the and elements-they are no longer needed since CSS is now used to configure the text. 4. download images file from blackboard and save in the same folder of your html and css file folder. 5. Add image logocup.png before

tag in
tag tag. 7. Add paragraph below

tags with following content Were a little out of the way, but take a drive down Garrett Bay Road to today! Indulge in our locally roasted free-trade coffee and home-made pastries. You'll feel right at home at City Coffee! Save the index.html file, and test it in a browser. Your page should look similar to the one shown in Figure City Coffee House Home Menu Events Event reservation Relax at City Coffee Friendly and eclectic City Coffee House is the perfect place to take a break, enjoy a refreshing beverage, and have a snack or light meal. Specialty Coffee and Organic Tea Bagels, Muffins, and Gluten-free Pastries Organic Salads Music and Poetry Readings Open Mic Night 12010 Broad street Richmond, VA 23234 888-555-5555 Copyright 2021 City Coffee House yourfirstnameyourlastname.com Task 3: The Menu Page. Launch a text editor, and open the menu.html file. You will modify this file in a similar manner as you modified the home page: Add the element and configure the navigation and page footer areas. Save and test your new menu.html. Task 4: To center Page Layout with CSS. Modify style.css, index.html, and menu.html to configure page content that is centered with 80% width. 1. Launch a text editor, and open the style.css file. Add a style rule for an id named wrapper with width set to 80%, margin-right set to auto, margin-left set to auto, min-width 900px, max-width 1280px and set the box shadow 3px 3px 3px and #676767 i-add color #8C3826 and height 100px in the header selector. Save style.css 2. Launch a text editor, and open the index.html file. Add the HTML code to configure a div element assigned to the id wrapper that "wraps," right after body tag and close div tag before close body tag, the code within the body section. Save and test your index.html page in a browser and you'll notice that the page content is now centered within the browser viewport. 3. do the following steps i. download images file from blackboard and save in the same folder of your html and css file folder. ii. Add image logocup.png before

tag in
tag tag. iv. Add paragraph below

tags with following content Were a little out of the way, but take a drive down Garrett Bay Road to today! Indulge in our locally roasted free-trade coffee and home-made pastries. You'll feel right at home at City Coffee! Save index.html Task 5. Launch a text editor, and open the menu.html file. Add the HTML code to configure a div element assigned to the id wrapper that "wraps," right after body tag and close div tag before close body tag, the code within the body section. Save and test your menu.html page in a browser and you'll notice that the page content is now centered within the browser viewport. Do the following for making menu page same as index page. i. Add image logocup.png before

tag in
tag tag. Save menu.html SSS City Coffee House Home Menu Events Event reservation Relax at City Coffee We're a little out of the way, but take a drive down Garrett Bay Road to today! Indulge in our locally roasted free-trade coffee and home-made pastries. You'll feel right at home at City Coffee! Friendly and eclectic - City Coffee House is the perfect place to take a break, enjoy a refreshing beverage, and have a snack or light meal. City Coffee Bar features: AD Specialty Coffee and Organic Tea Bagels, Muffins, and Gluten-free Pastries Organic Salads Music and Poetry Readings Open Mic Night 12010 Broad street Richmond, VA 23234 888-555-5555 Copyright 2 City Care House Task 6: Event page: Use the html and css we did so far to create event page and link it to event menu on each page. Your event page should look like as follows. Feel free you add more listing in event table and also apply css such as back ground color, text color, and width of cell etc Image name for upcoming events is upevents.jpg. Background color for heading row is #D2B48C Background color for odd rows is #ebd391 Background for even rows is #c99608 SSS City Coffee House Home Menu Events Event reservation list of Event at City Coffee Shop UPCOMING EVENTS Date Time Event Guest Sponsor Frequency Detail March 10th 5:00PM Book Review Robert Walser's Virgina Books Club Monthly Join the Community Bookstore for an event March 11th 3:00PM Movie Review Dan J. Johnson Virgin Movie Club Monthly Safer at Home March 12th 6:00PM Music Evening Melanie Morris Richmond Music Club weekly Melanie Morris entertains with her melodic folk style March 13th 8:00PM Story night Mark Eitzel Chesterfield Library weekly Tahoe Greg is back from his tour. New songs. New stories. All the events are free and required pre-registration due to limited seating. Jolin and reserver you seat today 12010 Broad street Richmond, VA 23234 888-555-5555 Copyright 2021 City Coffee House purfirstrameurlastram.com Task 7: Event Reservation page: Create Event reservation page with html and css. The page contains a form as shown below. For date use : SSS City Coffee House Home Menu Events Event reservation Reserve Your event R E S ER V E D Please fill the following form Event Details Event Name: 1 Sponsor : 1 Guest : please enter detail of event Deatil : Frequency : Weekly Event Start Date 01/01/2000 Enter your email: Contact Method O E-mail O Mobile Whatsapp In app Chat Submit request Clear Form Copyright 2021 City Coffee House You are free to add any new page. Navigation bar Should have the same navigation bar on all page. The bar should have four hyperlinks: Home, Menu, Event and Event Reservation. Each link should take you to its' respective page. If for example, you are on the home page, the home link should do nothing when you click it, and the same for all other links. O Submission rules Save 4 HTML and 1 CSS documents in a folder citycoffee2

Step by Step Solution

There are 3 Steps involved in it

Step: 1

blur-text-image

Get Instant Access to Expert-Tailored Solutions

See step-by-step solutions with expert insights and AI powered tools for academic success

Step: 2

blur-text-image

Step: 3

blur-text-image

Ace Your Homework with AI

Get the answers you need in no time with our AI-driven, step-by-step assistance

Get Started

Recommended Textbook for

More Books

Students also viewed these Databases questions

Question

Carry out an interview and review its success.

Answered: 1 week ago