forked from Thinkful-Ed/starter-thinkfulbnb
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
2bc8384
commit b77f4be
Showing
2 changed files
with
345 additions
and
229 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,110 +1,167 @@ | ||
| <!DOCTYPE html> | ||
| <html> | ||
| <head> | ||
| <meta charset="utf-8" /> | ||
| <meta name="viewport" content="width=device-width" /> | ||
| <title>Vacation Rentals & Unique Homes</title> | ||
| <link | ||
| href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css" | ||
| rel="stylesheet" | ||
| type="text/css" | ||
| /> | ||
| <link rel="preconnect" href="https://fonts.gstatic.com" /> | ||
| <link | ||
| href="https://fonts.googleapis.com/css2?family=Pangolin&family=Lato&display=swap" | ||
| rel="stylesheet" | ||
| /> | ||
| <link href="style.css" rel="stylesheet" type="text/css" /> | ||
| </head> | ||
|
|
||
| <body> | ||
| <header> | ||
| <div class="logo">Thinkfulbnb</div> | ||
| <nav> | ||
| <ul id="menu"> | ||
| <li><a>Stay</a></li> | ||
| <li><a>About</a></li> | ||
| <li><a>Ideas</a></li> | ||
| <li><a>Host</a></li> | ||
| </ul> | ||
| </nav> | ||
| </header> | ||
|
|
||
| <main> | ||
| <!-- Stay --> | ||
| <section id="stay"> | ||
| <h2>Find the perfect vacation rental</h2> | ||
| <!-- Create a form here --> | ||
| </section> | ||
|
|
||
| <!-- About --> | ||
| <section id="about" class="alternate-background"> | ||
| <h2>About</h2> | ||
|
|
||
| <img | ||
| src="images/vacation-rental-pool.png" | ||
| alt="Thinkfulbnb - Vacation rental pool" | ||
| /> | ||
|
|
||
| <img | ||
| src="images/vacation-rental-inside-stone.png" | ||
| alt="Thinkfulbnb - Vacation rental inside stone" | ||
| /> | ||
|
|
||
| <p> | ||
| Fusce porta odio nunc, eget pretium massa rutrum sit amet. Etiam | ||
| fringilla aliquam dapibus. Maecenas quis nisi sed turpis aliquam | ||
| porttitor eget ut quam. Sed vel scelerisque ex. Duis in pharetra | ||
| neque, at tempus lorem. Aenean mi magna, posuere at quam sed, euismod | ||
| gravida neque. | ||
| </p> | ||
| </section> | ||
|
|
||
| <!-- Ideas --> | ||
| <section id="ideas"> | ||
| <h2>Ideas</h2> | ||
| <h3>Forest retreats</h3> | ||
| <img | ||
| src="images/forest-retreat.png" | ||
| alt="Thinkfulbnb - Forest retreat" | ||
| /> | ||
| <h3>Beaches</h3> | ||
| <img src="images/beach-house.png" alt="Thinkfulbnb - Beach house" /> | ||
|
|
||
| <h3>Rustic cabins</h3> | ||
| <img src="images/cabin.png" alt="Thinkfulbnb - Cabin" /> | ||
|
|
||
| <h3>Pet-friendly</h3> | ||
| <img src="images/pet-friendly.png" alt="Thinkfulbnb - Pet-friendly" /> | ||
| </section> | ||
|
|
||
| <!-- Host --> | ||
| <section id="host" class="alternate-background"> | ||
| <h2>Want to Become a Thinkfulbnb Host?</h2> | ||
| <p> | ||
| Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus | ||
| molestie in est id efficitur. Sed hendrerit ut turpis quis dapibus. | ||
| Nam sit amet iaculis lectus. Aliquam erat volutpat. Praesent rhoncus | ||
| pellentesque eros in aliquet. Sed accumsan elit lacus, id ultrices | ||
| libero rutrum vitae. | ||
| </p> | ||
| <ul> | ||
| <li>Mauris in pellentesque ligula.</li> | ||
| <li>Sed accumsan elit lacus, id ultrices libero rutrum vitae.</li> | ||
| <li>Nunc vitae ex eget neque pellentesque porttitor.</li> | ||
| <li>Cras mollis lorem sagittis sapien imperdiet blandit. Vivamus.</li> | ||
| <li> | ||
| Donec vehicula ipsum nisi, eu consectetur leo feugiat et. Fusce eget | ||
| hendrerit mauris. | ||
| </li> | ||
| </ul> | ||
|
|
||
| <img src="images/become-a-host.png" alt="Thinkfulbnb - Become a host" /> | ||
| </section> | ||
| </main> | ||
|
|
||
| <footer> | ||
| <p>© Thinkful</p> | ||
| </footer> | ||
| </body> | ||
| </html> | ||
|
|
||
| <!DOCTYPE html> | ||
| <html> | ||
| <head> | ||
| <meta charset="utf-8" /> | ||
| <meta name="viewport" content="width=device-width" /> | ||
| <title>Vacation Rentals & Unique Homes</title> | ||
| <link | ||
| href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css" | ||
| rel="stylesheet" | ||
| type="text/css" | ||
| /> | ||
| <link rel="preconnect" href="https://fonts.gstatic.com" /> | ||
| <link | ||
| href="https://fonts.googleapis.com/css2?family=Pangolin&family=Lato&display=swap" | ||
| rel="stylesheet" | ||
| /> | ||
| <link href="style.css" rel="stylesheet" type="text/css" /> | ||
| </head> | ||
|
|
||
| <body> | ||
| <header> | ||
| <div class="logo">Thinkfulbnb</div> | ||
| <nav> | ||
| <ul id="menu"> | ||
| <li><a href="#stay">Stay</a></li> | ||
| <li><a href="#about">About</a></li> | ||
| <li><a href="#ideas">Ideas</a></li> | ||
| <li><a href="#host">Host</a></li> | ||
| </ul> | ||
| </nav> | ||
| </header> | ||
|
|
||
| <main> | ||
| <!-- Stay --> | ||
| <section id="stay"> | ||
| <h2>Find the perfect vacation rental</h2> | ||
| <!-- Create a form here --> | ||
| <form> | ||
| <div class="form-row"> | ||
| <label for="location">Location</label> | ||
| <input type="type" id="location" name="location" placeholder="Search Destination"/> | ||
| </div> | ||
|
|
||
| <div class="form-row"> | ||
| <label for="arrive">Arrive</label> | ||
| <input type="date" id="arrive" name="arrive"/> | ||
| </div> | ||
|
|
||
| <div class="form-row"> | ||
| <label for="depart">Depart</label> | ||
| <input type="date" id="depart" name="depart"/> | ||
| </div> | ||
|
|
||
| <div class="form-row"> | ||
| <label for="type">Type</label> | ||
| <select name="type" id="type"> | ||
| <option value="apartment">Apartment</option> | ||
| <option value="house">Barn</option> | ||
| <option value="hotel">Castle</option> | ||
| <option value="hotel">Houseboat</option> | ||
| <option value="hotel">Tiny House</option> | ||
| <option value="hotel">Yacht</option> | ||
| <option value="hotel">Yurt</option> | ||
| </select> | ||
| </div> | ||
|
|
||
| <button>Search</button> | ||
|
|
||
| </form> | ||
|
|
||
| </section> | ||
|
|
||
| <!-- About --> | ||
| <section id="about" class="alternate-background"> | ||
| <h2>About</h2> | ||
| <div class="about-section"> | ||
|
|
||
| <img | ||
| src="images/vacation-rental-pool.png" | ||
| alt="Thinkfulbnb - Vacation rental pool" | ||
| /> | ||
|
|
||
|
|
||
| <img | ||
| src="images/vacation-rental-inside-stone.png" | ||
| alt="Thinkfulbnb - Vacation rental inside stone" | ||
| /> | ||
|
|
||
| <p> | ||
| Fusce porta odio nunc, eget pretium massa rutrum sit amet. Etiam | ||
| fringilla aliquam dapibus. Maecenas quis nisi sed turpis aliquam | ||
| porttitor eget ut quam. Sed vel scelerisque ex. Duis in pharetra | ||
| neque, at tempus lorem. Aenean mi magna, posuere at quam sed, euismod | ||
| gravida neque. | ||
| </p> | ||
| </div> | ||
|
|
||
| </section> | ||
|
|
||
| <!-- Ideas --> | ||
| <section id="ideas"> | ||
| <h2>Ideas</h2> | ||
| <div class="group"> | ||
| <div class="item item-double"> | ||
| <h3>Forest retreats</h3> | ||
| <img | ||
| src="images/forest-retreat.png" | ||
| alt="Thinkfulbnb - Forest retreat" | ||
| /> | ||
| </div> | ||
| <div class="item item-double"> | ||
| <h3>Beaches</h3> | ||
| <img src="images/beach-house.png" alt="Thinkfulbnb - Beach house" /> | ||
| </div> | ||
| </div> | ||
| <div class="group"> | ||
| <div class="item item-double"> | ||
| <h3>Rustic cabins</h3> | ||
| <img src="images/cabin.png" alt="Thinkfulbnb - Cabin" /> | ||
| </div> | ||
| <div class="item item-double"> | ||
| <h3>Pet-friendly</h3> | ||
| <img src="images/pet-friendly.png" alt="Thinkfulbnb - Pet-friendly" /> | ||
| </div> | ||
| </div> | ||
| </section> | ||
|
|
||
| <!-- Host ---> | ||
| <section id="host" class="alternate-background"> | ||
|
|
||
| <div class="group"> | ||
| <div class="item"> | ||
| <h2>Want to Become a Thinkfulbnb Host?</h2> | ||
|
|
||
| <p> | ||
| Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus | ||
| molestie in est id efficitur. Sed hendrerit ut turpis quis dapibus. | ||
| Nam sit amet iaculis lectus. Aliquam erat volutpat. Praesent rhoncus | ||
| pellentesque eros in aliquet. Sed accumsan elit lacus, id ultrices | ||
| libero rutrum vitae. | ||
| </p> | ||
| <ul> | ||
| <li>Mauris in pellentesque ligula.</li> | ||
| <li>Sed accumsan elit lacus, id ultrices libero rutrum vitae.</li> | ||
| <li>Nunc vitae ex eget neque pellentesque porttitor.</li> | ||
| <li>Cras mollis lorem sagittis sapien imperdiet blandit. Vivamus.</li> | ||
| <li> | ||
| Donec vehicula ipsum nisi, eu consectetur leo feugiat et. Fusce eget | ||
| hendrerit mauris. | ||
| </li> | ||
| </ul> | ||
| </div> | ||
| <div class="item"> | ||
| <img src="images/become-a-host.png" alt="Thinkfulbnb - Become a host" /> | ||
| </div> | ||
| </div> | ||
| </section> | ||
| </main> | ||
|
|
||
| <footer> | ||
| <p>© Thinkful</p> | ||
| </footer> | ||
| </body> | ||
| </html> | ||
|
|
||
|
|
Oops, something went wrong.