Overview: Create a user login page (using HTML and CSS) for a receptionist at a local Pet Hotel called Happy Tails Hotel (HTH).

Task Description: Scenario

Suppose that you have been hired to design the new web-based interface for a local Pet Hotel, Happy Tails Hotel (HTH). A receptionist will be given a commission for bookings and therefore for each pet stay transaction they will need to login to their account, thus making a connection between the receptionist and the pet owner. The interface gives receptionist access to their accounts where they can book a stay, cancel a stay, request additional perks during a stay, cancel perks, change perks, or create a new client account.

Program Design and Implementation

Design the HTML interface. The interface should have four text fields, (for the receptionists name (first and last), the receptionists phone number and receptionists email address, a password field (for salespersons password), a numeric field (for salespersons ID), a checkbox for indicating an email confirmation for the pet owner if requested, a drop-down menu allowing the receptionist to indicate what type of transaction they wish to perform, and buttons as input elements as shown in the figure below. Be sure to give each input element a unique name attribute.

The options on the drop-down menu do not need to be implemented.

Below is an example to illustrate the HTML form requirements. You must tailor the page to your own style, but make sure the form has all key elements illustrated in my form and described above. The form should have a background (mine is a depiction of dogs in a doghouse) with the form laid on top of your chosen background.

Form Using Dropdown Menu

Once you have created the form using a drop-down menu, I would like you to recreate the form using:

Radio buttons

Checkboxes

for the options found in the dropdown menu.