From 025ae5be250469d1d7e8a1ecf58dca31c90faac2 Mon Sep 17 00:00:00 2001 From: Your Name Date: Sat, 23 Sep 2023 12:29:27 +0100 Subject: [PATCH 1/3] I did changes on website --- index.html | 298 ++++++++++++++++++++++++----------------------- styles/style.css | 85 +++++++++++--- 2 files changed, 221 insertions(+), 162 deletions(-) diff --git a/index.html b/index.html index 76254c13..b063e030 100644 --- a/index.html +++ b/index.html @@ -20,160 +20,166 @@ -
+
+ + + + + + + +
+ + +
+
+ You've helped us give 72 bikes to + refugees and asylum seekers so far. Thank you! +
+ +
+

Bikes for Refugees

+

+ Providing donated bikes and accessories to refugees and asylum + seekers in Scotland. +

+ + +
+ +
+

Learn more

+ +
+
+

Why do refugees need bikes?

+

+ Many refugees are placed in housing in areas where there are few + jobs. Bikes provide low-cost transportation so that they can get + to work, manage child care and do their shopping. +

+

+ + + Learn more + +

+
+ +
+

How can I help?

+

+ We need lots of bikes and bike accessories! If you have an old + bike you don't use, bring it to one of our dropoff events. Or + come attend one of our fundraisers. +

+

+ + + Learn more + +

+
+
+
+
+ +
- -
-
-
- You've helped us give 72 bikes - to refugees and asylum seekers so far. Thank you! -
- -
-

Bikes for Refugees

-

- Providing donated bikes and accessories to refugees and asylum - seekers in Scotland. +

+

+ Join us for our Spring fundraisers +

+

+ Riders needed now to help raise awareness and funds for BfR and + Médecins Sans Frontières.

- - -
- -
-

Learn more

- -
-
-

Why do refugees need bikes?

-

- Many refugees are placed in housing in areas where there are - few jobs. Bikes provide low-cost transportation so that they - can get to work, manage child care and do their shopping. -

-

- - - Learn more - -

-
- -
-

How can I help?

-

- We need lots of bikes and bike accessories! If you have an - old bike you don't use, bring it to one of our dropoff - events. Or come attend one of our fundraisers. -

-

- - - Learn more - -

-
-
-
-
- -
-

Upcoming events

- -
- -
-

- Join us for our Spring fundraisers -

-

- Riders needed now to help raise awareness and funds for BfR and - Médecins Sans Frontières. -

-
-
- -
- -
-

- Bike dropoff event in Edinburgh on May 11 -

-
-
- -
- -
-

- Help us cycle 4,797km -

-

- We need you to help us cycle 4797km, the distance of Edinburgh - to Damascus. -

-
-
+ + - -
-
- -
-
+ + + + + + + + +
+

- Bikes for Refugees Scotland is a volunteer-led project to help - people explore and make connections with their local communities. + Bikes for Refugees Scotland is a volunteer-led project to help + people explore and make connections with their local + communities.

Website by Code Your Future

-
-
+ + diff --git a/styles/style.css b/styles/style.css index 4d1c088e..f0e074a9 100644 --- a/styles/style.css +++ b/styles/style.css @@ -5,13 +5,13 @@ * */ - :root { - --grey-dark: #292b2c; - --grey-light: #e4e4e4; - --orange-dark: #c05326; - --orange-light: #f7eae4; - --white: #fff; - } +:root { + --grey-dark: #292b2c; + --grey-light: #e4e4e4; + --orange-dark: #c05326; + --orange-light: #f7eae4; + --white: #fff; +} body { margin: 0; @@ -24,7 +24,12 @@ button { font-size: 1rem; } -h1,h2,h3,h4,h5,h6 { +h1, +h2, +h3, +h4, +h5, +h6 { margin-top: 0; margin-bottom: 0; } @@ -59,15 +64,19 @@ p { } /* Navigation */ +nav { + padding-right: 30rem; +} .navigation__list { display: flex; + gap: 2rem; list-style: none; } -.navigation__item { +/* .navigation__item { padding: 0.5rem 0; -} +} */ .navigation__link { color: var(--grey-dark); @@ -76,6 +85,9 @@ p { text-decoration: none; } +.navigation__link:hover { + color: orange; +} /* Text styles */ @@ -92,12 +104,24 @@ p { border-left-color: var(--orange-dark); } - /* Buttons */ +button { + background-color: #c05326; + color: white; + border-radius: 5px; +} - /* INSERT BUTTON STYLES HERE */ +/* INSERT BUTTON STYLES HERE */ +button:hover { + background-color: gray; +} +.btn { + background-color: white; + color: orange; + border-radius: 5px; +} /* Content */ .content { @@ -108,7 +132,9 @@ p { /* Alert */ .alert { + border-style: solid; background-color: var(--orange-light); + color: black; border-left: 4px solid var(--orange-dark); border-radius: 4px; font-size: 0.85rem; @@ -120,21 +146,27 @@ p { /* hero */ .hero { - background-image: url("header-bike.jpg"); + background-image: url("../images/header-bike.jpg"); + width: 95%; + height: 350px; background-color: var(--grey-light); + padding-left: 30px; } .hero h1 { + padding-top: 30px; margin-bottom: 1rem; font-size: 2.5rem; + color: white; } .hero p { font-size: 1.2rem; margin-bottom: 2rem; + padding-top: 30px; + color: white; } - /* Headings */ .heading-underline { @@ -145,6 +177,7 @@ p { font-size: 1rem; font-weight: 600; text-transform: uppercase; + padding-top: 30px; } .heading-underline:before { @@ -158,17 +191,28 @@ p { background: var(--orange-dark); } - /* Article */ +.learn-more-articles { + display: flex; + gap: 1rem; + flex-direction: row; + flex-wrap: wrap; +} + .article { + display: flex; + flex-direction: row; margin-bottom: 1rem; + border-color: var(--grey-light); + border-style: solid; } .article__title { margin-bottom: 0.5rem; font-size: 1rem; - font-weight: 700; + font-weight: 600; + padding-left: 20px; } .article__title-link { @@ -186,6 +230,15 @@ p { width: 5rem; } +.block { + display: flex; + flex-direction: column; + border-style: solid; + width: 45%; + border-color: var(--grey-light); + align-content: center; +} + .article__read-more { margin-top: 0; } From 131d8e1e37653fd1993f64ece097c621c456d921 Mon Sep 17 00:00:00 2001 From: Your Name Date: Wed, 27 Sep 2023 17:05:48 +0100 Subject: [PATCH 2/3] i made changes on img alt, color, padding and layout --- index.html | 28 ++++++++++++++-------------- styles/style.css | 32 +++++++++++++++++++------------- 2 files changed, 33 insertions(+), 27 deletions(-) diff --git a/index.html b/index.html index b063e030..44ac3135 100644 --- a/index.html +++ b/index.html @@ -24,7 +24,7 @@ @@ -66,11 +66,11 @@

Bikes for Refugees

-
+

Learn more

-
-
+
+

Why do refugees need bikes?

Many refugees are placed in housing in areas where there are few @@ -83,9 +83,9 @@

Why do refugees need bikes?

Learn more

-
+
-
+

How can I help?

We need lots of bikes and bike accessories! If you have an old @@ -98,19 +98,19 @@

How can I help?

Learn more

-
-
- + + + -
+

Upcoming events

+