grassrootseconomics/pelican-website-ge
5
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

carousel to about-us

Browse Source
This commit is contained in:
Idaapayo 2021-06-03 19:54:20 +03:00
parent 11dc6218bb
commit ec7657aea4
4 changed files with 102 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
ge-theme/static/css/about-us.css
View File

@ -47,3 +47,10 @@
background-color: #3E3F45; background-color: #3E3F45;
color: #ffffff; color: #ffffff;
} }
.wrapper-carousel{
box-sizing: border-box;
margin: auto;
border: solid 2px blue;
max-height: 600px;
max-width: 400px;
}

48
ge-theme/templates/about-us.html
View File

@ -35,19 +35,59 @@
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-3"> <div class="col-lg-3">
</div> </div>
<div class="col-3"> <div class="col-lg-3">
</div> </div>
<div class="col-3"> <div class="col-lg-3">
</div> </div>
<div class="col-3"> <div class="col-lg-3">
</div> </div>
</div> </div>
</div> </div>
<div id="carouselExampleIndicators" class="carousel slide carousel-dark" data-bs-ride="carousel" data-interval="false">
<div class="carousel-indicators">
<button type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="0" class="active" aria-current="true" aria-label="Slide 1"></button>
<button type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="1" aria-label="Slide 2"></button>
<button type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="2" aria-label="Slide 3"></button>
</div>
<div class="carousel-inner">
<div class="carousel-item active">
<div class="row">
<div class="col-lg-6 col-md-12 col-md-12">
<div class="wrapper-carousel">
<h3 class="years">2010</h3>
<h2>ECO_PESA</h2>
<p>This program was launched as a backed currency model with 75 Businesses taking part in three informal settlements near Kongowea, Mombasa. The currency was backed by donor funds and accomplished some amazing community service and environmental goals in partnership with Green World Campaign while increasing local trade for a year period.</p>
</div>
</div>
<div class="col-lg-6 col-md-12 col-md-12">
<div class="wrapper-carousel">
<iframe width="480" height="277" src="https://www.youtube.com/embed/UaspBGmsdLE" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
</div>
</div>
</div>
<div class="carousel-item">
<img src="..." class="d-block w-100" alt="...">
</div>
<div class="carousel-item">
<img src="..." class="d-block w-100" alt="...">
</div>
</div>
<button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="visually-hidden">Previous</span>
</button>
<button class="carousel-control-next" type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="visually-hidden">Next</span>
</button>
</div>
{% endblock %} {% endblock %}

48
output/pages/about-us.html
View File

@ -77,20 +77,60 @@
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-3"> <div class="col-lg-3">
</div> </div>
<div class="col-3"> <div class="col-lg-3">
</div> </div>
<div class="col-3"> <div class="col-lg-3">
</div> </div>
<div class="col-3"> <div class="col-lg-3">
</div> </div>
</div> </div>
</div> </div>
<div id="carouselExampleIndicators" class="carousel slide carousel-dark" data-bs-ride="carousel" data-interval="false">
<div class="carousel-indicators">
<button type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="0" class="active" aria-current="true" aria-label="Slide 1"></button>
<button type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="1" aria-label="Slide 2"></button>
<button type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="2" aria-label="Slide 3"></button>
</div>
<div class="carousel-inner">
<div class="carousel-item active">
<div class="row">
<div class="col-lg-6 col-md-12 col-md-12">
<div class="wrapper-carousel">
<h3 class="years">2010</h3>
<h2>ECO_PESA</h2>
<p>This program was launched as a backed currency model with 75 Businesses taking part in three informal settlements near Kongowea, Mombasa. The currency was backed by donor funds and accomplished some amazing community service and environmental goals in partnership with Green World Campaign while increasing local trade for a year period.</p>
</div>
</div>
<div class="col-lg-6 col-md-12 col-md-12">
<div class="wrapper-carousel">
<iframe width="480" height="277" src="https://www.youtube.com/embed/UaspBGmsdLE" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
</div>
</div>
</div>
<div class="carousel-item">
<img src="..." class="d-block w-100" alt="...">
</div>
<div class="carousel-item">
<img src="..." class="d-block w-100" alt="...">
</div>
</div>
<button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="visually-hidden">Previous</span>
</button>
<button class="carousel-control-next" type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="visually-hidden">Next</span>
</button>
</div>
<div class="row"> <div class="row">
<div class="col-lg-12 base-footer"> <div class="col-lg-12 base-footer">

7
output/theme/css/about-us.css
View File

@ -47,3 +47,10 @@
background-color: #3E3F45; background-color: #3E3F45;
color: #ffffff; color: #ffffff;
} }
.wrapper-carousel{
box-sizing: border-box;
margin: auto;
border: solid 2px blue;
max-height: 600px;
max-width: 400px;
}