Compare commits
No commits in common. 'main' and 'master' have entirely different histories.
@ -0,0 +1,20 @@
|
||||
## Tanaka Chirar Clean Cooking Stove Website Development
|
||||
|
||||
|
||||
## First Story
|
||||
<p>First User
|
||||
As a user of the website, I would like to be able to access a platform where I can view other designs of the cook stove proposed by others. I would like to have a platform where I can upload images of the designs of the cook stove that I have made. If possible, I would also like an option where I can directly discuss with the inventor of the cook stove.</p>
|
||||
|
||||
## Second Story
|
||||
<p>I want a platform where I can see how to make the cook stove, with clear steps and methods of the procedures explicitly stated. It would be great if there is also a platform on the website where all the user of the cook stove can discuss our experiences so we can brainstorm the ideas together on how we can improve the functionality of the cook stove to achieve an efficient system.</p>
|
||||
|
||||
|
||||
## Third User
|
||||
<p>I really appreciate the method of the clean cooking stove since it has allowed me to cook effectively without suffering from smoke being produced from the firewood. The cook stove has significantly reduced the amount of firewood that we used to cook. However, I would greatly appreciate if the handles are insulated since they tend to become very hot. The website would be truly appreciated if we can discuss drawbacks and problems that need to be improved or fixed.</p>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
@ -0,0 +1,233 @@
|
||||
html{
|
||||
font-size: 62.5%;
|
||||
|
||||
}
|
||||
|
||||
*{
|
||||
padding : 0;
|
||||
margin : 0;
|
||||
box-sizing: border-box;
|
||||
|
||||
}
|
||||
|
||||
header{
|
||||
background-color : goldenrod;
|
||||
|
||||
}
|
||||
.welcomeimages{
|
||||
/* max-width: 980px; */
|
||||
width : 98%;
|
||||
margin : auto;
|
||||
}
|
||||
.welcomeimages img{
|
||||
margin : 0 auto;
|
||||
max-width : 70vh;
|
||||
}
|
||||
|
||||
.navlist{
|
||||
list-style : none;
|
||||
|
||||
}
|
||||
a{
|
||||
color : white;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.navbar{
|
||||
min-height: 70px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items : center;
|
||||
padding : 0 24px;
|
||||
|
||||
}
|
||||
.site-name{
|
||||
font-size : 2.3rem;
|
||||
color : white;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.nav-menu{
|
||||
display : flex;
|
||||
justify-content : space-between;
|
||||
align-items : center;
|
||||
gap : 40px;
|
||||
}
|
||||
|
||||
|
||||
.nav-link{
|
||||
transition: 0.7s ease;
|
||||
font-size : 1.5rem;
|
||||
}
|
||||
.nav-link:hover{
|
||||
color: dodgerblue;
|
||||
}
|
||||
|
||||
.hamburger{
|
||||
display: none;
|
||||
cursor: pointer;
|
||||
|
||||
}
|
||||
.bar{
|
||||
display : block;
|
||||
width : 25px;
|
||||
height : 3px;
|
||||
margin : 5px auto;
|
||||
--webkit-transition: all 0.3s ease-in-out;
|
||||
transition: all 0.3s ease-in-out;
|
||||
background-color: white;
|
||||
|
||||
}
|
||||
|
||||
/* Main Content */
|
||||
|
||||
.container{
|
||||
width :100%;
|
||||
max-width : 980px;
|
||||
padding :0;
|
||||
/* border : solid red; */
|
||||
}
|
||||
|
||||
img{
|
||||
/* max-width : 100%; */
|
||||
margin-top : 0;
|
||||
width : 100%;
|
||||
margin :0;
|
||||
}
|
||||
|
||||
/* END */
|
||||
|
||||
|
||||
|
||||
.columns{
|
||||
display : flex;
|
||||
margin: 1em 0;
|
||||
align-items: flex-start;
|
||||
padding : 1em;
|
||||
/* border : solid brown; */
|
||||
width : 100%;
|
||||
}
|
||||
.col1{
|
||||
width : 90%;
|
||||
justify-content: space-between;
|
||||
/* margin : 0 auto; */
|
||||
padding : 2rem;
|
||||
}
|
||||
|
||||
.col2{
|
||||
width : 15%;
|
||||
justify-content: space-between;
|
||||
margin : 0 auto;
|
||||
}
|
||||
|
||||
.bg-color{
|
||||
background-color: greenyellow;
|
||||
margin : 0;
|
||||
padding : 2rem;
|
||||
|
||||
}
|
||||
|
||||
.bg-color-blue{
|
||||
background-color: #fff5ee;
|
||||
margin : 0;
|
||||
padding : 2rem
|
||||
|
||||
}
|
||||
|
||||
.white{
|
||||
background-color: #f5f5f5;
|
||||
margin : 0;
|
||||
padding : 2rem;
|
||||
|
||||
}
|
||||
.h1welmgs{
|
||||
font-size: 3rem;
|
||||
color: black;
|
||||
margin-bottom : 1em;
|
||||
|
||||
}
|
||||
.h3forallmainContent{
|
||||
font-size: 2rem;
|
||||
margin-top : 1.5em;
|
||||
|
||||
}
|
||||
.allparagraph{
|
||||
font-size : 2rem;
|
||||
line-height: 2rem;
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
.col2{
|
||||
width : 45%;
|
||||
/* border : solid purple; */
|
||||
margin-left : 3rem;
|
||||
margin-right : 3rem
|
||||
}
|
||||
|
||||
.footer-section{
|
||||
width : 100%;
|
||||
background-color : goldenrod;
|
||||
padding : 1rem;
|
||||
}
|
||||
|
||||
.footer-list{
|
||||
display : flex;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
|
||||
/* Footer Design */
|
||||
.footer-item{
|
||||
padding : 2rem;
|
||||
list-style: none;
|
||||
font-size : 1.5rem;
|
||||
margin-right : 1.5rem;
|
||||
/* color : #fff; */
|
||||
}
|
||||
|
||||
|
||||
/* End of Content Area */
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
@media(max-width: 768px){
|
||||
.hamburger{
|
||||
display: block;
|
||||
}
|
||||
.hamburger.acive .bar:nth-child(2){
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.hamburger.acive .bar:nth-child(1){
|
||||
transform:translateY(8px) rotate(45deg);
|
||||
}
|
||||
|
||||
.hamburger.acive .bar:nth-child(3){
|
||||
transform:translateY(-8px) rotate(-45deg);
|
||||
}
|
||||
.nav-menu{
|
||||
position : fixed;
|
||||
left: -100%;
|
||||
top : 70px;
|
||||
gap : 0;
|
||||
flex-direction : columns;
|
||||
width: 100%;
|
||||
background-color : goldenrod;
|
||||
text-align: center;
|
||||
transition: 0.3s;
|
||||
}
|
||||
|
||||
.nav-item{
|
||||
margin: 16px 0;
|
||||
|
||||
}
|
||||
.nav-menu.active{
|
||||
left: 0;
|
||||
display : block;
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,175 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="stylesheet" href="cleancookingstove.css">
|
||||
<title>Hamburger Menu</title>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<header>
|
||||
<nav class="navbar">
|
||||
<h1 class="site-name">Rural Cooking Stove</h1>
|
||||
|
||||
<ul class="nav-menu">
|
||||
<li class="navlist">
|
||||
<a href="#" class="nav-link">Home</a>
|
||||
</li>
|
||||
|
||||
<li class="navlist">
|
||||
<a href="#" class="nav-link">About</a>
|
||||
</li>
|
||||
|
||||
<li class="navlist">
|
||||
<a href="#" class="nav-link">Recent-Post</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="hamburger">
|
||||
<span class="bar"></span>
|
||||
<span class="bar"></span>
|
||||
<span class="bar"></span>
|
||||
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
</header><!--end of header selection-->
|
||||
|
||||
|
||||
|
||||
<!-- Content Area -->
|
||||
<section class="bg-color-blue">
|
||||
<img src="" alt="">
|
||||
<h1 class="h1welmgs"> Welcome To The Clean Cooking Stove</h1>
|
||||
|
||||
|
||||
<div class="columns">
|
||||
<div class="container">
|
||||
<div class="col1"><!--second col-->
|
||||
<h3 class="h3forallmainContent">Second Content</h3>
|
||||
<p class="allparagraph">According to the World Health Organization (WHO), around 2.6 billion people cook and heat
|
||||
using polluting open fires or simple stoves fuelled by kerosene, biomass (wood, animal
|
||||
dung and crop waste) and coal (Air Pollution Data Portal, n.d.). This generates high
|
||||
levels of health-damaging Indoor Air Pollution (IAP), such as particulates, tar and
|
||||
carbon monoxide. Because women are primarily responsible for cooking and raising young
|
||||
children, both are disproportionately affected by IAP. For example, the World Health
|
||||
Report (2002) states that in developing countries among the poor, Acute Respiratory
|
||||
Infection (ARI) is one of the leading causes of childhood mortality (under 5) and is
|
||||
responsible for up to 33% of all ARI cases. IAP also adversely affects Zimbabwe because
|
||||
of the number of people who live in poor, rural regions. (Rural Population
|
||||
(67% of Total Population…2020) - Zimbabwe | Data, n.d.). A second problem caused by open
|
||||
or traditional heaths is the inefficient use of fuel. Past efforts to reduce IAP have
|
||||
focused on efficient combustion but have not necessarily focused on thermal efficiency
|
||||
of the overall cooking and heating process. As a result, a significant portion of the
|
||||
fuel's energy is lost, leading to increased levels of deforestation. In parallel, people who
|
||||
are faced with the challenge of indoor air pollution are from low-income communities
|
||||
which makes it very difficult for them to afford expensive clean cooking stoves.
|
||||
Most of the existing solution focus only on reduction of Indoor Air Pollution,
|
||||
but fall short on distribution the solution to billions of people who need it.
|
||||
</p>
|
||||
|
||||
</div><!--end of col1 section-->
|
||||
</div>
|
||||
</div><!--end of columns-->
|
||||
|
||||
|
||||
</section>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<section class="bg-color">
|
||||
|
||||
|
||||
<div class="columns">
|
||||
<div class="container">
|
||||
<div class="col1"><!--second col-->
|
||||
<h3 class="h3forallmainContent">Second Content</h3>
|
||||
<p class="allparagraph">According to the World Health Organization (WHO), around 2.6 billion people cook and heat
|
||||
using polluting open fires or simple stoves fuelled by kerosene, biomass (wood, animal
|
||||
dung and crop waste) and coal (Air Pollution Data Portal, n.d.). This generates high
|
||||
levels of health-damaging Indoor Air Pollution (IAP), such as particulates, tar and
|
||||
carbon monoxide. Because women are primarily responsible for cooking and raising young
|
||||
children, both are disproportionately affected by IAP. For example, the World Health
|
||||
Report (2002) states that in developing countries among the poor, Acute Respiratory
|
||||
Infection (ARI) is one of the leading causes of childhood mortality (under 5) and is
|
||||
responsible for up to 33% of all ARI cases. IAP also adversely affects Zimbabwe because
|
||||
of the number of people who live in poor, rural regions. (Rural Population
|
||||
(67% of Total Population…2020) - Zimbabwe | Data, n.d.). A second problem caused by open
|
||||
or traditional heaths is the inefficient use of fuel. Past efforts to reduce IAP have
|
||||
focused on efficient combustion but have not necessarily focused on thermal efficiency
|
||||
of the overall cooking and heating process. As a result, a significant portion of the
|
||||
fuel's energy is lost, leading to increased levels of deforestation. In parallel, people who
|
||||
are faced with the challenge of indoor air pollution are from low-income communities
|
||||
which makes it very difficult for them to afford expensive clean cooking stoves.
|
||||
Most of the existing solution focus only on reduction of Indoor Air Pollution,
|
||||
but fall short on distribution the solution to billions of people who need it.
|
||||
</p>
|
||||
|
||||
</div><!--end of col1 section-->
|
||||
</div>
|
||||
</div><!--end of columns-->
|
||||
|
||||
|
||||
</section>
|
||||
|
||||
<section class="bg-color-blue">
|
||||
|
||||
|
||||
<div class="columns">
|
||||
<div class="container">
|
||||
<div class="col1"><!--second col-->
|
||||
<h3 class="h3forallmainContent">Second Content</h3>
|
||||
<p class="allparagraph">According to the World Health Organization (WHO), around 2.6 billion people cook and heat
|
||||
using polluting open fires or simple stoves fuelled by kerosene, biomass (wood, animal
|
||||
dung and crop waste) and coal (Air Pollution Data Portal, n.d.). This generates high
|
||||
levels of health-damaging Indoor Air Pollution (IAP), such as particulates, tar and
|
||||
carbon monoxide. Because women are primarily responsible for cooking and raising young
|
||||
children, both are disproportionately affected by IAP. For example, the World Health
|
||||
Report (2002) states that in developing countries among the poor, Acute Respiratory
|
||||
Infection (ARI) is one of the leading causes of childhood mortality (under 5) and is
|
||||
responsible for up to 33% of all ARI cases. IAP also adversely affects Zimbabwe because
|
||||
of the number of people who live in poor, rural regions. (Rural Population
|
||||
(67% of Total Population…2020) - Zimbabwe | Data, n.d.). A second problem caused by open
|
||||
or traditional heaths is the inefficient use of fuel. Past efforts to reduce IAP have
|
||||
focused on efficient combustion but have not necessarily focused on thermal efficiency
|
||||
of the overall cooking and heating process. As a result, a significant portion of the
|
||||
fuel's energy is lost, leading to increased levels of deforestation. In parallel, people who
|
||||
are faced with the challenge of indoor air pollution are from low-income communities
|
||||
which makes it very difficult for them to afford expensive clean cooking stoves.
|
||||
Most of the existing solution focus only on reduction of Indoor Air Pollution,
|
||||
but fall short on distribution the solution to billions of people who need it.
|
||||
</p>
|
||||
|
||||
</div><!--end of col1 section-->
|
||||
</div>
|
||||
</div><!--end of columns-->
|
||||
|
||||
|
||||
</section>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<footer class="footer-section">
|
||||
<div class="container">
|
||||
<ul class="footer-list">
|
||||
<li class="footer-item">Contact <br>Coming Soon</li>
|
||||
<li class="footer-item">Email <br> Coming Soon</li>
|
||||
<li class="footer-item">Address <br>Coming Soon</li>
|
||||
<li class="footer-item"><span>Developed by Jet Web Development</span></li>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
|
||||
</footer>
|
||||
|
||||
|
||||
<!--End of Content Area-->
|
||||
|
||||
<script src="rurastove.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -0,0 +1,13 @@
|
||||
const hamburger = document.querySelector(".hamburger");
|
||||
const navMenu = document.querySelector(".nav-menu");
|
||||
|
||||
hamburger.addEventListener("click", () =>{
|
||||
hamburger.classList.toggle("active");
|
||||
navMenu.classList.toggle("active");
|
||||
})
|
||||
|
||||
document.querySelectorAll(".nav-link").forEach(n=> n.
|
||||
addEventListener("click", () => {
|
||||
hamburger.classList.remove("active");
|
||||
hamburger.classList.remove("active");
|
||||
}))
|
||||
Loading…
Reference in New Issue