diff --git a/.hintrc b/.hintrc new file mode 100644 index 00000000..5c813c42 --- /dev/null +++ b/.hintrc @@ -0,0 +1,8 @@ +{ + "extends": [ + "development" + ], + "hints": { + "disown-opener": "off" + } +} \ No newline at end of file diff --git a/index.html b/index.html index 76254c13..0bbf6a2a 100644 --- a/index.html +++ b/index.html @@ -1,179 +1,149 @@ - - - - - - - - - - - Bikes for Refugees - - - -
- - - - - -
- -
- + + + + -
+ + + + -
-
-
- 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 - -

-
-
-
-
+ Bikes for Refugees + -
-

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. -

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

Bikes for Refugees

- Bikes for Refugees Scotland is a volunteer-led project to help - people explore and make connections with their local communities. + Providing donated bikes and accessories to refugees and asylum + seekers in Scotland.

-

Website by Code Your Future

+ + +
+ +
+

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 + +

+
+
+
+ + +
+ + + + + \ No newline at end of file diff --git a/styles/style.css b/styles/style.css index 4d1c088e..2bd22d87 100644 --- a/styles/style.css +++ b/styles/style.css @@ -34,9 +34,9 @@ p { margin-bottom: 0; } -.header, +header, .content, -.footer { +footer { padding: 0 1.5rem; max-width: 1200px; margin: 0 auto; @@ -44,7 +44,7 @@ p { /* Header */ -.header { +header { display: flex; align-items: center; justify-content: space-between; @@ -66,7 +66,10 @@ p { } .navigation__item { - padding: 0.5rem 0; + padding: 0; +} +.navigation__link:hover { + color: var(--orange-dark); } .navigation__link { @@ -74,6 +77,7 @@ p { font-weight: 600; text-transform: uppercase; text-decoration: none; + margin-left: 1.5rem; } @@ -95,7 +99,40 @@ p { /* Buttons */ - /* INSERT BUTTON STYLES HERE */ + .donate-button { + background-color: var(--orange-dark); + border: none; + color: var(--white); + text-align: center; + justify-content: center; + font-size: .9rem; + padding: .3rem; + border-radius: .2rem; + + } + .donate-button:hover{ + background-color: var(--white); + color: var(--orange-dark); + border: 1px solid var(--orange-dark); + transition:all 0.1s ease-in; + } + + .volunteer-button { + background-color: var(--white); + border: none; + color: var(--orange-dark); + text-align: center; + justify-content: center; + font-size: .9rem; + padding: .3rem; + border-radius: .2rem; + } + .volunteer-button:hover { + background-color: var(--orange-dark); + color: var(--white); + border: 1px solid var(--orange-dark); + transition:all 0.1s ease-in; + } /* Content */ @@ -120,18 +157,23 @@ p { /* hero */ .hero { - background-image: url("header-bike.jpg"); - background-color: var(--grey-light); + background-image: url("../images/header-bike.jpg"); + background-size:initial; + padding:5rem 0 9rem 2rem; + margin-bottom: 2rem; + height: 6rem; } .hero h1 { margin-bottom: 1rem; font-size: 2.5rem; + color: var(--white); } .hero p { font-size: 1.2rem; margin-bottom: 2rem; + color: var(--white); } @@ -161,8 +203,16 @@ p { /* Article */ -.article { +.article-main { + display: grid; + grid-template-columns: 1fr 1fr; + grid-gap: 1rem; +} + +article { margin-bottom: 1rem; + border:2px solid var(--grey-light); + padding: 1rem; } .article__title { @@ -202,6 +252,14 @@ p { text-decoration: underline; } +.article-aside { + display: flex; +} + +.article__content { +padding-left: 1rem; +} + .fa { margin-right: 0.5rem; color: var(--orange-dark); @@ -209,6 +267,7 @@ p { .facebook-link { color: var(--orange-dark); + text-align: right; } /* Sidebar */ @@ -221,18 +280,18 @@ p { /* Footer */ -.footer { +footer { margin-top: 2rem; } .footer__content { border-top: 2px solid var(--orange-light); padding-top: 2rem; - padding-bottom: 2rem; + padding-bottom: 1rem; } -.footer p { - padding-bottom: 1rem; +footer p { + padding-bottom: .5rem; text-align: center; font-size: 0.85rem; } @@ -244,7 +303,7 @@ p { flex-direction: row; } - .main { + main { padding-right: 2rem; } }