Skip to content

London | ITP-Sep_25 | Oussama Mouggal | Sprint 1 | Bikes for Refugees #538

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
Oussama-Mouggal wants to merge 3 commits into
base: main
Choose a base branch
from
Open

London | ITP-Sep_25 | Oussama Mouggal | Sprint 1 | Bikes for Refugees #538

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
1ed209b
update index.html
Sep 19, 2025
7072d44
update index.html
Sep 19, 2025
7971ff7
I changed html semantics and footer, also I fixed some broken images.…
Sep 19, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
151 changes: 66 additions & 85 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,8 +20,7 @@
</head>

<body>
<div class="header">

<header class="header">
<a href="#">
<img
src="images/bikes-for-refugees_logo.jpg"
Expand All @@ -30,7 +29,7 @@
/>
</a>

<div>
<nav class="site-nav" role="navigation" aria-label="Main navigation">
<ul class="navigation__list">
<li class="navigation__item">
<a class="navigation__link" href="#">Home</a>
Expand All @@ -45,104 +44,88 @@
<a class="navigation__link" href="#">Contact Us</a>
</li>
</ul>
</div>

<button>Donate Now</button>
</nav>
<button class="btn btn-primary">Donate Now</button>
</header>

</div>

<div class="content">
<div class="main">
<div class="alert">
<div class="content">
<main id="main" >
<section class="alert" role="status">
You've helped us give <span class="text-highlight">72</span> bikes
to refugees and asylum seekers so far. <strong>Thank you!</strong>
</div>

<div class="hero">
</section>
<section class="hero" aria-labelledby="hero-title">
<div class="hero-title">
<h1>Bikes for Refugees</h1>
<p>
Providing donated bikes and accessories to refugees and asylum
seekers in Scotland.
</p>
<button>Donate a bike today</button>
<button>Volunteer</button>
</div>

<div>
<h2 class="heading-underline">Learn more</h2>

<div>
<div class="article">
<h3 class="article__title">Why do refugees need bikes?</h3>
<p class="article__summary">
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.
</p>
<p class="article__read-more">
<a href="#">
<span class="arrow-right"></span>
Learn more
</a>
</p>
</div>

<div class="article">
<h3 class="article__title">How can I help?</h3>
<p class="article__summary">
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.
</p>
<p class="article__read-more">
<a href="#">
<span class="arrow-right"></span>
Learn more
</a>
</p>
</div>
<div class="hero_buttons">
<button class="btn btn-primary">Donate a bike today</button>
<button class="btn btn-secondary">Volunteer</button>
</div>
</div>
</div>
</section>

<div class="sidebar">
<section class="learn-more">
<h2 class="heading-underline">Learn more</h2>
<div class="articles-grid">
<article class="article">
<h3 class="article__title">Why do refugees need bikes?</h3>
<p class="article__summary">
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.
</p>
<p class="article__read-more">
<a href="#"><span class="arrow-right" aria-hidden="true"></span> Learn more</a>
</p>
</article>

<article class="article">
<h3 class="article__title">How can I help?</h3>
<p class="article__summary">
We need lots of bikes and bike accessories! If you have an old bike you don't use, bring it to one of our drop off events. Or come attend one of our fundraisers.
</p>
<p class="article__read-more">
<a href="#"><span class="arrow-right" aria-hidden="true"></span> Learn more</a>
</p>
</article>
</div>
</section>
</main>
<aside class="sidebar" aria-label="Upcoming events">
<h2 class="heading-underline">Upcoming events</h2>

<div class="article">
<article class="card">
<img
class="article__thumbnail"
src="spring-fundraisers_thumbnail.jpg"
alt=""
src="images/spring-fundraisers_thumbnail.jpg"
alt="image of a tree branch and spring fundraisers poster"
/>
<div class="article__content">
<h3 class="article__title">
<a class="article__title-link" href="#">Join us for our Spring fundraisers</a>
<h3>
<a href="#">Join us for our Spring fundraisers</a>
</h3>
<p class="article__summary">
Riders needed now to help raise awareness and funds for BfR and
Médecins Sans Frontières.
</p>
</div>
</div>

<div class="article">
</div>
</article>
<article class="card">
<img class="article__thumbnail"
src="images/bikes-for-refugees_logo.jpg"
alt="a bike logo for scotland refugees" />
<div class="article__content">
<h3 class="article__title"><a
class="article__title-link" href="#">Bike drop off event in Edinburgh on May 11</a></h3>
</div>
</article>
<article class="card">
<img
class="article__thumbnail"
src="bikes-for-refugees_logo.jpg"
alt=""
/>
<div class="article__content">
<h3 class="article__title">
<a class="article__title-link" href="#">Bike dropoff event in Edinburgh on May 11</a>
</h3>
</div>
</div>

<div class="article">
<img
class="article__thumbnail"
src="edinburgh-damascus_thumbnail.png"
alt=""
src="../bikes-for-refugees/images/edinburgh-damascus_thumbnail.png"
alt="image of a man riding a bike and a road sign indicating edinburgh and damascus directions"
/>
<div class="article__content">
<h3 class="article__title">
Expand All @@ -152,9 +135,8 @@ <h3 class="article__title">
We need you to help us cycle 4797km, the distance of Edinburgh
to Damascus.
</p>
</div>
</div>

</div>
</article>
<a
href="https://www.facebook.com/BikesforRefugeesScotland/events/?ref=page_internal"
target="_blank"
Expand All @@ -163,17 +145,16 @@ <h3 class="article__title">
<span class="fa fa-facebook-square"></span>
All Facebook events
</a>
</div>
</div>

<div class="footer">
</aside>
</div>
<footer class="footer">
<div class="footer__content">
<p>
<strong>Bikes for Refugees Scotland is a volunteer-led project to help
people explore and make connections with their local communities.</strong>
</p>
<p>Website by Code Your Future</p>
</div>
</div>
</footer>
</body>
</html>
Loading