-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
193 lines (179 loc) · 11.5 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>bersihkan/home</title>
<link rel="stylesheet" href="./code/css/home.css">
<link rel="icon" href="./code/asset/broom.png">
</head>
<body>
<div class="img_bg_fix"><img src="./code/asset/Hero.png" alt=""></div>
<input type="checkbox" id="burger_icon">
<header>
<label for="burger_icon">
<div class="icon_bars">
<div></div>
<div></div>
<div></div>
</div>
</label>
<h1>bersihkan</h1>
<a href="./code/html/errorpage.html"><img src="./code/asset/user.png" alt="Profile"></a>
</header>
<nav class="side_nav">
<ul>
<li><a href="./index.html" id="home-default">HOME</a></li>
<li><a href="./code/html/home-logged-in.html" id="home-logged-in">HOME</a></li>
<li><a href="./code/html/recycle.html">RECYCLE</a></li>
<li><a href="./code/html/redeem.html">REDEEM</a></li>
<li><a href="./code/html/forum.html">FORUM</a></li>
<li><a href="./code/html/aboutus.html">ABOUT US</a></li>
<li id><a href="./code/html/login.html" id="login">LOGIN</a></li>
<li id="logout"><a href="./code/html/login.html">LOGOUT</a></li>
<li style="position: absolute; bottom: 20vh;"><a href="./code/html/admin.html" id="admin">ADMIN</a></li>
</ul>
</nav>
<main>
<div class="main_container">
<div class="hero">
<img class="hero-img" src="./code/asset/Hero.png" alt="">
<div class ="hero-text">
<h1>Caring Hearts, Changing Lives</h1>
<div></div>
<h2>A promising future is constructed and safeguarded through responsible waste management of your garbage.</h2>
</div>
</div>
<div class="info">
<input type="radio" name="select-info" id="about-us" checked ="checked">
<input type="radio" name="select-info" id="our-service">
<input type="radio" name="select-info" id="partner">
<div class="select">
<label for="about-us" class="about-us-text label_text">
About Us
</label>
<label for="our-service" class="our-service-text label_text">
Our service
</label>
<label for="partner" class="partner-text label_text">
Partner
</label>
</div>
<div class="main-info">
<div class="AU">
<img class = "info-img-1" src="./code/asset/info 1.png" alt="">
<div class="info-text-1" style="padding-left: 5vw; text-align: justify;">
Our mission at "Bersihkan" is to leverage technology's potential and create innovative apps that propel our country towards a future unburdened by the challenges of waste management.
With a passionate team of experts, we are dedicated to developing cutting-edge solutions that revolutionize the way we approach and address the issue of garbage.
Through our user-friendly apps, we empower individuals, communities, and businesses to actively participate in building a sustainable and waste-free society.
By providing practical tools, resources, and knowledge, we enable our users to make informed decisions and take responsible actions towards waste reduction and proper disposal.
Together, we can create a cleaner and healthier environment, preserving the beauty of our nation for future generations while leaving behind a lasting legacy of sustainable practices.
</div>
</div>
<div class="OU">
<div class="info-text-2" style="padding-right: 5vw; text-align: justify;">
Our flagship service at "Bersihkan" revolves around recycling garbage, where we strive to provide the best-in-class solutions for effectively managing and repurposing waste materials.
In addition to recycling, we offer a dynamic forum where individuals and communities can come together to share ideas, discuss environmental initiatives, and collaborate on waste reduction strategies.
As part of our commitment to sustainability, we have implemented a unique redeem point system, rewarding users for their recycling efforts and encouraging active participation in the recycling ecosystem.
Through our innovative approach, we aim to create a positive impact on the environment by diverting waste from landfills and transforming it into valuable resources.
Join us on this transformative journey towards a greener future, where recycling becomes a rewarding experience, fostering a sense of community and environmental responsibility.
</div>
<img class = "info-img-2" src="./code/asset/info 2.png" alt="">
</div>
<div class="PRT">
<img class = "info-img-3" src="./code/asset/info 3.png" alt="">
<div class="info-text-3" style="padding-left: 5vw; text-align: justify;">
Partnering with esteemed organizations, we collaborate with industry leaders who share our vision for a sustainable future, amplifying our impact and expanding our reach.
These strategic alliances enable us to leverage the expertise and resources of our partner companies, fostering innovation and driving advancements in waste management practices.
Our partner companies play a crucial role in strengthening our network, allowing us to tap into diverse knowledge pools, access new markets, and create synergistic solutions to tackle the challenges of garbage management.
Through these meaningful partnerships, we forge powerful alliances that propel our mission forward, ensuring a united front in our collective efforts to build a cleaner and greener world.
</div>
</div>
</div>
</div>
<div class="line_section">
<div></div>
</div>
<div class="new_section">
<div class="title_new_section">
<h1>RECYCLE NOW</h1>
<h4>Learn about the positive impact of recycling and how it helps protect the environment</h4>
</div>
<button id="gorecycle"> LEARN MORE </button>
</div>
<div class="disclaimer">
<h1>DISCLAIMER</h1>
<p>
This website is created solely for the purpose of a college project. All information, data, and content provided on this website are entirely fictional and for demonstration purposes only. Any resemblance to actual persons, places, or events is purely coincidental.
The purpose of this website is to showcase web design and development skills acquired during the course. The ideas and concepts presented on this website, excluding the fictional content, are original and created solely for this project.
Please note that any real-world information, references, or links present on this website are for illustrative purposes only and do not represent actual entities or endorsements.
Visitors are advised not to rely on the accuracy, completeness, or reliability of any information or content provided on this website. Any actions taken based on the information found here are at the sole discretion and responsibility of the visitor.
Thank you for understanding and enjoying our college project website!
</p>
</div>
</div>
<footer>
<div class="footer_top">
<div class="footer_top_left">
<h1>Sign up to our newsletter</h1>
<h2>Stay up to date with the latest news and announcement</h2>
</div>
<div class="footer_top_right">
<form action="">
<input type="email" id="email" placeholder="Enter your email here">
<button type="submit">SUBSCRIBE</button>
</form>
</div>
</div>
<div class="footer_mid">
<div class="link_container">
<div class="link main_link">
<h1>Bersihkan</h1>
<ul>
<li><a href="./code/html/errorpage.html">Partners</a></li>
<li><a href="./code/html/errorpage.html">News</a></li>
<li><a href="./code/html/errorpage.html">Terms of Service</a></li>
<li><a href="./code/html/errorpage.html">Privacy Policy</a></li>
</ul>
</div>
<div class="link">
<h1>Help & FAQs</h1>
<ul>
<li><a href="./code/html/errorpage.html">Error</a></li>
<li><a href="./code/html/errorpage.html">Accessbility</a></li>
<li><a href="./code/html/errorpage.html">Customer</a></li>
<li><a href="./code/html/errorpage.html">Service</a></li>
<li><a href="./code/html/errorpage.html">Billing & Coin</a></li>
</ul>
</div>
<div class="link">
<h1>Service</h1>
<ul>
<li><a href="./code/html/errorpage.html">Recycle</a></li>
<li><a href="./code/html/errorpage.html">Redeem</a></li>
<li><a href="./code/html/errorpage.html">Forum</a></li>
<li><a href="./code/html/errorpage.html">Daily Pickup</a></li>
</ul>
</div>
<div class="social">
<h1>Our Social</h1>
<div class="social_icon">
<img src="./code/asset/linkedin.png" alt="" style="border: 1px solid blue;">
<img src="./code/asset/telegram.png" alt="" style="border: 1px solid lightblue;">
<img src="./code/asset/blog.png" alt="" style="border: 1px solid orangered;">
<img src="./code/asset/instagram.png" alt="" style="border: 1px solid purple;">
<img src="./code/asset/youtube.png" alt="" style="border: 1px solid red;">
</div>
</div>
</div>
</div>
<div class="footer_bottom">
<h1>Copyright © 2023 Bersihkan.id. All rights reserved.</h1>
<h2>Bersihkan.id (1234 4354) | Indonesia (302123)</h2>
</div>
</footer>
</main>
<script src="./code/js/general.js"></script>
<script src="./code/js/home.js"></script>
</body>
</html>