From c1fb707699449af4d56e5b490b37ac3c9f7a55dc Mon Sep 17 00:00:00 2001 From: Abdennour Hachemi Date: Sun, 17 May 2020 02:17:25 +0100 Subject: [PATCH 01/13] tick flexfroggy exercise as done tick flexfroggy exercise as done --- week2/1-flexbox-froggy/readme.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/week2/1-flexbox-froggy/readme.md b/week2/1-flexbox-froggy/readme.md index f903d8ec..29fed368 100644 --- a/week2/1-flexbox-froggy/readme.md +++ b/week2/1-flexbox-froggy/readme.md @@ -4,4 +4,4 @@ Flexbox Froggy is a really fun way of learning how Flexbox works. You should complete all the levels -https://flexboxfroggy.com/ +https://flexboxfroggy.com/ Done From e5b72c747dd70f7225aea7b8c59276d5edad3a38 Mon Sep 17 00:00:00 2001 From: Abdennour Hachemi Date: Sun, 17 May 2020 19:12:32 +0100 Subject: [PATCH 02/13] update html Adding a header, nav bar and logo to html code. --- week2/2-website/index.html | 27 +++++++++++++++++++++++++++ 1 file changed, 27 insertions(+) diff --git a/week2/2-website/index.html b/week2/2-website/index.html index 876b59d6..856e6fed 100644 --- a/week2/2-website/index.html +++ b/week2/2-website/index.html @@ -12,6 +12,33 @@ +
+ + +
+ +
+
+ +
+
+

Join us on

+
+ +
+ +
From bc4672b66bb02af6fb515ee089c20650d5469561 Mon Sep 17 00:00:00 2001 From: Abdennour Hachemi Date: Mon, 18 May 2020 17:22:10 +0100 Subject: [PATCH 03/13] add an to html add a hyper link to the nav bar --- week2/2-website/index.html | 88 ++++++++++++++++++++------------------ 1 file changed, 47 insertions(+), 41 deletions(-) diff --git a/week2/2-website/index.html b/week2/2-website/index.html index 856e6fed..12cd5b35 100644 --- a/week2/2-website/index.html +++ b/week2/2-website/index.html @@ -1,48 +1,54 @@ - - - - Karma - - - - - - - - -
- - +
+
+
+

Introducing Karma

+

Bring WiFi with you, everywhere you go.

+ - - - - - +
- +
+
+

Everyone needs a little Karma.

+
+
+
+
+

Join us on

+
+

© Karma Mobility, Inc.

+
+ + + + From c44fef68c614bfb4da93dca0af8288f5f251b9f2 Mon Sep 17 00:00:00 2001 From: Abdennour Hachemi Date: Mon, 18 May 2020 17:24:40 +0100 Subject: [PATCH 04/13] update css update css --- week2/2-website/css/style.css | 58 +++++++++++++++++++++++++++++++++++ 1 file changed, 58 insertions(+) diff --git a/week2/2-website/css/style.css b/week2/2-website/css/style.css index 5cb025ce..4c0cb8d5 100644 --- a/week2/2-website/css/style.css +++ b/week2/2-website/css/style.css @@ -15,5 +15,63 @@ body { * * - When using Flexbox, remember the items you want to move around need to be inside a parent container set to 'display: flex' */ +/* We are using the 'Roboto' font from Google. This has already been added to your HTML header */ + +body { + font-family: 'Roboto', sans-serif; + -webkit-font-smoothing: antialiased; + // background: blue; + //background: url(img/first-background.jpg); +} + +ul > li{ + list-style:none; + } + + #header{ + position:fixed; + margin-right: 40px; + display:flex; + align-items : center; + justify-content: space-around; + min-height: 95px; + padding: 0px 10px; + background-color: #eee; + width: 80%; + + + } + .logo { + width: 3%; + height: 3%; + } + .logo > img { + width: 100%; + height: 100%; + max-width: 50px; + display: flex; + justify-content: center; + align-items: center; + text-align: center; + margin-left: 20px; + } + nav > ul { + width: 35vw; + display: flex; + flex-direction: row; + justify-content: space-between; + } + a{ + text-decoration: none ; + } + + + + + + + + + From 7b755e84ec70b824d464c9f3b6a65c60cbb0c93f Mon Sep 17 00:00:00 2001 From: Abdennour Hachemi Date: Tue, 19 May 2020 04:48:12 +0100 Subject: [PATCH 05/13] update html add background image to section 1 --- week2/2-website/index.html | 52 ++++++++++++++++++++++++++++++++++++++ 1 file changed, 52 insertions(+) diff --git a/week2/2-website/index.html b/week2/2-website/index.html index 12cd5b35..b6e77881 100644 --- a/week2/2-website/index.html +++ b/week2/2-website/index.html @@ -1,5 +1,57 @@ + + + + + Karma + + + + + + + + + +
+
+

Introducing Karma

+

Bring WiFi with you, everywhere you go.

+ +
+
+ + + + + + From 43724ce9444fe9bd06a3ba6d1f6f543e9a3854e3 Mon Sep 17 00:00:00 2001 From: Abdennour Hachemi Date: Tue, 19 May 2020 04:51:31 +0100 Subject: [PATCH 06/13] update css style the second section --- week2/2-website/css/style.css | 174 ++++++++++++++++++++++++---------- 1 file changed, 124 insertions(+), 50 deletions(-) diff --git a/week2/2-website/css/style.css b/week2/2-website/css/style.css index 4c0cb8d5..c57424dc 100644 --- a/week2/2-website/css/style.css +++ b/week2/2-website/css/style.css @@ -1,20 +1,3 @@ - - /* We are using the 'Roboto' font from Google. This has already been added to your HTML header */ - -body { - font-family: 'Roboto', sans-serif; - -webkit-font-smoothing: antialiased; -} - -/** - * Add your custom styles below - * - * Remember: - * - Be organised, use comments and separate your styles into meaningful chunks - * for example: General styles, Navigation styles, Hero styles, Footer etc. - * - * - When using Flexbox, remember the items you want to move around need to be inside a parent container set to 'display: flex' - */ /* We are using the 'Roboto' font from Google. This has already been added to your HTML header */ body { @@ -24,54 +7,145 @@ body { //background: url(img/first-background.jpg); } -ul > li{ - list-style:none; - } - - #header{ - position:fixed; +li { + list-style: none; +} + +#header { + position: fixed; margin-right: 40px; - display:flex; - align-items : center; + display: flex; + align-items: center; justify-content: space-around; min-height: 95px; padding: 0px 10px; - background-color: #eee; + //background-color: #eee; width: 80%; - - - } - .logo { +} + +.logo { width: 3%; height: 3%; - } - .logo > img { +} + +.logo>img { width: 100%; height: 100%; max-width: 50px; - display: flex; - justify-content: center; + display: flex; + justify-content: center; align-items: center; - text-align: center; + text-align: center; margin-left: 20px; - } - nav > ul { +} + +nav>ul { width: 35vw; + //color:black; + font-weight: lighter; display: flex; flex-direction: row; justify-content: space-between; - } - a{ - text-decoration: none ; - } - - - - - - - - - +} + +a { + //text-decoration: none; +} + +li { + // font-weight:bolder; + // color: green; +} + +nav a { + text-decoration: none; + color: rgb(121, 116, 116); + //font-weight: bold; +} + +.nav-link1 { + color: black; + font-weight: bold; +} + +nav a:hover { + font-weight: bold; + color: black; +} + + +/* We are using the 'Roboto' font from Google. This has already been added to your HTML header */ +body { + font-family: 'Roboto', sans-serif; + -webkit-font-smoothing: antialiased; +} +ul>li { + list-style: none; + padding: 1px; +} + +#header { + position: fixed; + margin-right: 40px; + display: flex; + align-items: center; + justify-content: space-around; + min-height: 95px; + padding: 0px 10px; + background-color: white; + width: 100%; +} + +.logo { + width: 3%; + height: 3%; +} + +.logo>img { + width: 100%; + height: 100%; + max-width: 50px; + display: flex; + justify-content: center; + align-items: center; + text-align: center; + margin-left: 20px; +} + +nav>ul { + width: 35vw; + //color:black; + font-weight: lighter; + display: flex; + flex-direction: row; + justify-content: space-between; +} + +a { + text-decoration: none; +} + +.hero { + display: flex; + flex-direction: column; +} + +.hero-content { + color: white; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + text-align: center; + height: 200px; + background: url(../img/first-background.jpg)no-repeat center; + padding: 200px 100px; + margin: 100px; +} + +button { + background: rgb(236, 93, 93); + border-radius: 25px; +} From b23efc1bf5eaf0d28659568df9d37a5dab209f4a Mon Sep 17 00:00:00 2001 From: Abdennour Hachemi Date: Sat, 23 May 2020 22:33:00 +0100 Subject: [PATCH 07/13] final html code final code for this home work --- week2/2-website/index.html | 128 ++++++++++++++++--------------------- 1 file changed, 54 insertions(+), 74 deletions(-) diff --git a/week2/2-website/index.html b/week2/2-website/index.html index b6e77881..98f86c82 100644 --- a/week2/2-website/index.html +++ b/week2/2-website/index.html @@ -1,12 +1,12 @@ - - Karma + Karma nouri + @@ -19,88 +19,68 @@ -
+

Introducing Karma

Bring WiFi with you, everywhere you go.

- +
-
- - - - - - - - - - Karma - - - - - - - - - -
-
-

Introducing Karma

-

Bring WiFi with you, everywhere you go.

- - -
- -
-
-

Everyone needs a little Karma.

-
+ +
-