Skip to content

Commit

Permalink
responsive design
Browse files Browse the repository at this point in the history
  • Loading branch information
@waweruedwin8
waweruedwin8 committed Mar 18, 2024
1 parent fbc46c9 commit 211ba3b
Show file tree
Hide file tree
Showing 39 changed files with 2,201 additions and 0 deletions.
20 changes: 20 additions & 0 deletions web_static/0-index.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
<!DOCTYPE html>
<html lang="en">
<meta charset="utf-8">
<title>AirBnB Clone</title>

<body style="margin: 0; padding: 0;">
<header style="background-color: #FF0000; height: 70px; width: 100%;">
</header>
<footer style="align-items: center;
background-color: #00FF00;
bottom: 0;
display: flex;
height: 60px;
justify-content: center;
position: absolute;
width: 100%;">
Best School
</footer>
</body>
</html>
39 changes: 39 additions & 0 deletions web_static/1-index.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>AirBnB Clone</title>
<style>
body {
margin: 0;
padding: 0;
}

header {
background: #f00;
height: 70px;
width: 100%;
}

footer {
align-items: center;
background-color: #0f0;
bottom: 0;
display: flex;
height: 60px;
justify-content: center;
position: absolute;
width: 100%;
}

</style>
</head>
<body>
<header></header>
<footer>
Best School
</footer>
</body>
</html>
201 changes: 201 additions & 0 deletions web_static/100-index.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,201 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>AirBnB Clone</title>
<link rel="stylesheet" href="styles/reset.css">
<link rel="icon" href="images/icon.png">
<link rel="stylesheet" href="styles/4-common.css">
<link rel="stylesheet" href="styles/3-header.css">
<link rel="stylesheet" href="styles/3-footer.css">
<link rel="stylesheet" href="styles/6-filters.css">
<link rel="stylesheet" href="styles/100-places.css">
</head>
<body>
<header>
<div class="logo"></div>
</header>
<div class="container">
<section class="filters">
<div class="locations">
<h3>States</h3>
<h4>Nairobi/Mombasa...</h4>
<ul class="popover">
<li><h2>Nairobi:</h2></li>
<li>Upper Hill</li>
<li>Nairobi City</li>
<li><h2>Mombasa:</h2></li>
<li>Nyali Beach</li>
<li>Mombasa City</li>
</ul>
</div>
<div class="amenities">
<h3>Amenities</h3>
<h4>Internet/Swimming-pool...</h4>
<ul class="popover">
<li>Internet</li>
<li>TV</li>
<li>Kitchen</li>
<li>Iron</li>
<li>Swimming-pool</li>
</ul>
</div>
<button>Search</button>
</section>
<section class="places">
<h1>Places</h1>
<article>
<h2>My Home</h2>
<div class="price_by_night">
<p>$90
</div>
<div class="information">
<div class="max_guest">
<div class="icon_guest"></div>
<p>2 Guests
</div>
<div class="number_rooms">
<div class="icon_bed"></div>
<p>1 Bedroom
</div>
<div class="number_bathrooms">
<div class="icon_bath"></div>
<p>1 Bathroom
</div>
</div>
<div class="user">
<p><b>Owner</b>: Mark Joe</p>
</div>
<div class="description">
<p>This is a lovely 1 bedroom and 1 bathroom apartment that can accomodate 2 people. It locates at the center of Shangai and next to subway line 1, 1 stop to People Square, 2 stops to Bund, 3 stops to Jingan Temple.
</div>
<div class="amenities">
<h2>Amenities</h2>
<ul>
<li>
<div class = "tv_icon"></div>
<p>TV</p>
</li>
<li>
<div class = "wifi_icon"></div>
<p>Wifi</p>
</li>
<li>
<div class = "pets_icon"></div>
<p>Pet Friendly</p>
</li>
</ul>
</div>
<div class="reviews">
<h2>2 Reviews</h2>
<ul>
<li>
<h3>From Ben Jamea the 27th July 2022</h3>
<p>Mark is an epic host. Nothing more I can say, 5 stars!</p>
</li>
<li>
<h3>From Sam Too the 5th January 2022</h3>
<p>Highly recommend!</p>
</li>
</ul>
</div>
</article>
<article>
<h2>My Apartment</h2>
<div class="price_by_night">
<p>$65
</div>
<div class="information">
<div class="max_guest">
<div class="icon_guest"></div>
<p>4 Guests
</div>
<div class="number_rooms">
<div class="icon_bed"></div>
<p>2 Bedrooms
</div>
<div class="number_bathrooms">
<div class="icon_bath"></div>
<p>1 Bathroom
</div>
</div>
<div class="user">
<p><b>Owner</b>: Grace</p>
</div>
<div class="description">
<p>Our place is a private, affordable stand-alone guest house centrally located just minutes to French Quarters, Downtown, the Fair Grounds(Jazz Fest) and City Park. The guest house is a quaint, 400 square ft. with a full bath, mini kitchen and living room. The extra high ceilings make the home feel more spacious. The sofa converts to a bed also. We have a handmade counter area that adds character to the room and a great porch/deck to relax on and have a glass of Merlot.
</div>
<div class="amenities">
<h2>Amenities</h2>
<ul>
<li>
<div class = "pets_icon"></div>
<p>Pet Friendly</p>
</li>
</ul>
</div>
<div class="reviews">
<h2>1 Review</h2>
<ul>
<li>
<h3>From Lenny the 15th August 2022</h3>
<p>Fantastic place. It was clean, Grace was great (even though we didn't meet in person) and everything went super smooth. Location is also great if you like running and something a bit more quiet.</p>
</li>
</ul>
</div>
</article>
<article>
<h2>A Suite</h2>
<div class="price_by_night">
<p>$190
</div>
<div class="information">
<div class="max_guest">
<div class="icon_guest"></div>
<p>5 Guests
</div>
<div class="number_rooms">
<div class="icon_bed"></div>
<p>3 Bedrooms
</div>
<div class="number_bathrooms">
<div class="icon_bath"></div>
<p>2 Bathrooms
</div>
</div>
<div class="user">
<p><b>Owner</b>: Vincent</p>
</div>
<div class="description">
<p>This suite is equipped with 2 kind-size beds and 1 twin bed, and is perfect for a family vacation. Located near ground transportation in the east of Paris, it's easy to go visit the city in less than 30 minutes. The cafe across the street serves delicious vegan brunch every weekend, and is children-friendly.
</div>
<div class="amenities">
<h2>Amenities</h2>
<ul>
<li>
<div class = "wifi_icon"></div>
<p>Wifi</p>
</li>
</ul>
</div>
<div class="reviews">
<h2>2 Reviews</h2>
<ul>
<li>
<h3>From Ronny the 7th June 2022</h3>
<p>Super charming place in a cool neighborhood! The apartment is very clean and sunny. Highly recommend!</p>
</li>
<li>
<h3>From Shaddy the 25th May 2022</h3>
<p>Vincent was very sweet when she welcomed us and made sure we felt as comfortable as possible. The location is ideal for visiting the city and use transportation.</p>
</li>
</ul>
</div>
</article>
</section>
</div>
<footer>
Best School
</footer>
</body>
</html>
Loading

0 comments on commit 211ba3b

Please sign in to comment.