From 5853941218f0edd7309989984b3113a3da824b24 Mon Sep 17 00:00:00 2001 From: abdallah1936 Date: Wed, 8 Mar 2023 09:13:42 -0800 Subject: [PATCH 1/2] Airbnb --- css/style.css | 65 ++++++++++++++++++++++++++++++++++++++++++++++++++- index.html | 29 +++++++++++++++++++++-- 2 files changed, 91 insertions(+), 3 deletions(-) diff --git a/css/style.css b/css/style.css index 26f119bf..66cabbad 100644 --- a/css/style.css +++ b/css/style.css @@ -1,3 +1,66 @@ +body{ + background-color:rgb(237, 238, 236); + text-align: center; +} +.photos{ + flex-direction: column; + border: 10%; +} + h1 { - color: salmon; + color: rgb(92, 95, 96); +} +h2{ + color: rgb(88, 90, 90); +} +#bottom-button{ +background-color: white; + +} +.photos{ + margin: 15px 15px; + display: inline; +} +#san-francisco{ + position: absolute; + top: 5px; + color: white; + color: rgb(255, 255, 255, 0); + margin: auto; + +} +#new-york{ + position: absolute; + top: 5px; + color: white; + color: rgb(255, 255, 255, 0); + margin: auto; +} +#london{ + position: absolute; + top: 5px; + color: white; + color: rgb(255, 255, 255, 0); + margin: auto; +} +#napa{ + position: absolute; + top: 5px; + color: white; + color: rgb(255, 255, 255, 0); + margin: auto; +} +#sonoma{ + position: absolute; + top: 5px; + color: white; + color: rgb(255, 255, 255, 0); + margin: auto; } +#san-francisco-2{ + position: absolute; + top: 5px; + color: white; + color: rgb(255, 255, 255, 0); + margin: auto; +} \ No newline at end of file diff --git a/index.html b/index.html index 8cd37ffb..a65d39b8 100644 --- a/index.html +++ b/index.html @@ -4,9 +4,34 @@ - Hello Front-End + Airbnb -

Hello Front-End

+

Guidebooks

+

Discover hundereds of local spots recommended by Airbnb hosts

+
+

San Francisco

+ Picture of San Francisco +

New York

+ Picture of New york's skyskrapers +

London

+ Picture of the big ben clock +
+
+ +
+

Just for the weekend

+

Discover new, inspiring places close to home

+
+

Napa

+ Picture of Napa +

Sonoma

+ Picture of sonoma's fields +

San Francisco

+ Picture of San Francisco's houses +
+
+ +
From 73d0069e32dfcf1b0afdf28e5393ed561c68b224 Mon Sep 17 00:00:00 2001 From: abdallah1936 Date: Wed, 8 Mar 2023 10:09:19 -0800 Subject: [PATCH 2/2] Airbnb --- css/style.css | 90 +++++++++++++++++++-------------------------------- index.html | 41 ++++++++++++++++++++--- 2 files changed, 70 insertions(+), 61 deletions(-) diff --git a/css/style.css b/css/style.css index 66cabbad..be9c3f7d 100644 --- a/css/style.css +++ b/css/style.css @@ -1,66 +1,44 @@ -body{ - background-color:rgb(237, 238, 236); - text-align: center; -} -.photos{ - flex-direction: column; - border: 10%; +* { + /* browser css reset */ + margin: 0; + box-sizing: border-box; + /* set some basic font styling */ + font-family: "Raleway", sans-serif; + /* use digital color picker to get hex values */ + color: #4b4c4e; +} +body { + background-color: #E9EBE7; } -h1 { - color: rgb(92, 95, 96); +button { + padding: 1rem 7rem; } -h2{ - color: rgb(88, 90, 90); -} -#bottom-button{ -background-color: white; +.card { + display:flex; + flex-direction: column; + flex-wrap: wrap; + align-items: center; + padding: 20px; + text-align: center; } -.photos{ - margin: 15px 15px; - display: inline; -} -#san-francisco{ - position: absolute; - top: 5px; - color: white; - color: rgb(255, 255, 255, 0); - margin: auto; - -} -#new-york{ - position: absolute; - top: 5px; - color: white; - color: rgb(255, 255, 255, 0); - margin: auto; -} -#london{ - position: absolute; - top: 5px; - color: white; - color: rgb(255, 255, 255, 0); - margin: auto; -} -#napa{ - position: absolute; - top: 5px; - color: white; - color: rgb(255, 255, 255, 0); - margin: auto; + +.images { + display: flex; } -#sonoma{ - position: absolute; - top: 5px; - color: white; - color: rgb(255, 255, 255, 0); - margin: auto; + +.images section { + display: flex; + justify-content: center; + align-items: center; + padding: 20px; } -#san-francisco-2{ + +.images p { + /* border: yellow 2px solid; */ position: absolute; - top: 5px; color: white; - color: rgb(255, 255, 255, 0); - margin: auto; + font-weight: 600; + font-size: 36px; } \ No newline at end of file diff --git a/index.html b/index.html index a65d39b8..22f3f475 100644 --- a/index.html +++ b/index.html @@ -4,12 +4,41 @@ - Airbnb + Hello Front-End -

Guidebooks

-

Discover hundereds of local spots recommended by Airbnb hosts

-
+ +
+ +
+

Meet Guidebooks

+

Discover hundreds of local spots recommended by Airbnbn hosts

+
+ +
+ +
+ san francisco +

San Francisco

+
+ +
+ new york +

New York

+
+ +
+ london +

London

+
+
+ + +
+ + + + + +