Skip to content

Commit 48708f5

Browse files
codegenwebcodegenweb
authored
Add files via upload
1 parent 33f7cd4 commit 48708f5

File tree

4 files changed

+409
-0
lines changed

4 files changed

+409
-0
lines changed

‎img/lake.jpg

1.62 MB
Loading

‎img/planet.png

11 MB
Loading

‎index.html

Lines changed: 80 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,80 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<title>Save Water</title>
8+
9+
<!--Fonts-->
10+
<link rel="preconnect" href="https://fonts.googleapis.com">
11+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
12+
<link href="https://fonts.googleapis.com/css2?family=Fredoka:wght@300..700&display=swap" rel="stylesheet">
13+
14+
<!-- fontawesome -->
15+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
16+
17+
<!--Style Sheets-->
18+
<link rel="stylesheet" href="styles.css">
19+
20+
</head>
21+
22+
<body>
23+
<!--Hero section-->
24+
<section id="hero">
25+
<div class="hero-section-container">
26+
<header>
27+
<a class="logo" href="#hero">Save<span>Water.</span></a> <!--Left Section-->
28+
29+
<nav> <!--Middle Section-->
30+
<a class="nav-items active" href="#">Home</a>
31+
<a class="nav-items" href="#">About</a>
32+
<a class="nav-items" href="#">Gallery</a>
33+
<a class="nav-items" href="#">Contacts</a>
34+
</nav>
35+
36+
<button class="cta-btn">Donate</button> <!--Right Section-->
37+
</header>
38+
39+
<div class="hero-content"> <!--Hero Content-->
40+
41+
<div class="left-section">
42+
<div class="left-content-container">
43+
<h3>SAVE</h3>
44+
<h1>
45+
<span>W</span>
46+
<span class="color-change">A</span>
47+
<span>T</span>
48+
<span class="color-change">E</span>
49+
<span>R</span>
50+
</h1>
51+
<p>
52+
<span>Save Water, Secure Tomorrow!</span> Water is life, and every drop we save today protects the world
53+
of tomorrow. Join the movement to conserve and protect our most precious resource. Together, we can build
54+
a sustainable future where every drop counts and every effort matters.
55+
</p>
56+
<button class="big-cta-btn">Donate</button>
57+
</div>
58+
</div>
59+
60+
<div class="right-section">
61+
<div class="image-wrap">
62+
<img src="img/planet.png" alt="planet image">
63+
</div>
64+
</div>
65+
66+
</div>
67+
68+
<div class="social-icons">
69+
<i class="fa-brands fa-facebook"></i>
70+
<i class="fa-brands fa-youtube"></i>
71+
<i class="fa-brands fa-twitter"></i>
72+
<i class="fa-brands fa-tiktok"></i>
73+
</div>
74+
75+
</div>
76+
</section>
77+
78+
</body>
79+
80+
</html>

0 commit comments

Comments
 (0)