Skip to content

Commit 2ecbf81

Browse files
AmeeMadhaniAmeeMadhani
authored
Add files via upload
1 parent 625f715 commit 2ecbf81

File tree

5 files changed

+232
-0
lines changed

5 files changed

+232
-0
lines changed

‎images.jpg

8.6 KB
Loading

‎index.css

+154
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,154 @@
1+
nav {
2+
font-family: poppins;
3+
display: flex;
4+
justify-content: space-between;
5+
align-items: center;
6+
background-color: #fff;
7+
height: 60px;
8+
padding: 0 20px;
9+
font-size: 25px;
10+
}
11+
12+
.nav-left {
13+
display: flex;
14+
align-items: center;
15+
}
16+
17+
.nav-icon {
18+
font-size: 24px;
19+
margin-right: 5px;
20+
}
21+
22+
.nav-text {
23+
font-weight: bold;
24+
}
25+
26+
.heart-icon {
27+
color: red;
28+
}
29+
30+
.nav-center {
31+
display: flex;
32+
align-items: center;
33+
}
34+
35+
.nav-link {
36+
text-decoration: none;
37+
color: #333;
38+
margin-right: 20px;
39+
}
40+
41+
.bold {
42+
font-weight: bold;
43+
}
44+
45+
.resource-icon {
46+
font-size: 12px;
47+
margin-left: 5px;
48+
vertical-align: middle;
49+
}
50+
51+
.new-icon {
52+
margin-left: auto;
53+
color: blue;
54+
font-weight: bold;
55+
}
56+
57+
.nav-right {
58+
display: flex;
59+
align-items: center;
60+
}
61+
62+
.submit-btn {
63+
display: flex;
64+
align-items: center;
65+
justify-content: center;
66+
background-color: blue;
67+
color: #fff;
68+
border: none;
69+
border-radius: 5px;
70+
padding: 10px 20px;
71+
}
72+
73+
.plus-icon {
74+
margin-right: 5px;
75+
}
76+
77+
.stats {
78+
display: flex;
79+
justify-content: center;
80+
align-items: center;
81+
margin: 50px 0;
82+
}
83+
84+
.stats-text {
85+
display: flex;
86+
flex-direction: column;
87+
align-items: center;
88+
text-align: center;
89+
margin-right: 20px;
90+
}
91+
92+
.stats-number {
93+
font-size: 48px;
94+
font-weight: bold;
95+
}
96+
97+
.stats-description {
98+
font-size: 16px;
99+
font-weight: bold;
100+
text-transform: uppercase;
101+
margin-top: -20px;
102+
}
103+
104+
.stats-subtitle {
105+
font-size: 16px;
106+
margin-top: 10px;
107+
}
108+
109+
.stats-image {
110+
max-width: 200px;
111+
margin-left: 20px;
112+
}
113+
114+
footer {
115+
background-color: #f9f9f9;
116+
padding: 20px;
117+
}
118+
119+
.footer-container {
120+
display: flex;
121+
justify-content: space-between;
122+
align-items: center;
123+
}
124+
125+
.footer-item {
126+
display: flex;
127+
align-items: center;
128+
}
129+
130+
.footer-text {
131+
font-size: 18px;
132+
font-weight: bold;
133+
margin-right: 10px;
134+
}
135+
136+
.footer-number {
137+
width: 50px;
138+
height: 50px;
139+
margin-right: 20px;
140+
}
141+
142+
.footer-number text {
143+
font-size: 24px;
144+
font-weight: bold;
145+
}
146+
147+
148+
.img {
149+
max-width: 100%;
150+
height: auto;
151+
}
152+
153+
154+

‎index.html

+78
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,78 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<link href='https://fonts.googleapis.com/css?family=Poppins' rel='stylesheet'>
5+
<title></title>
6+
<meta charset="UTF-8">
7+
<meta name="viewport" content="width=device-width, initial-scale=1">
8+
<link href="index.css" rel="stylesheet">
9+
</head>
10+
<body style = "font-family: poppins;">
11+
<nav>
12+
<div class="nav-left">
13+
<!-- <span class="nav-icon">:</span> -->
14+
<span class="nav-text">we <span class="heart-icon">&hearts;</span></span>
15+
</div>
16+
<div class="nav-center">
17+
<a href="#" class="nav-link bold">Share Your Work</a>
18+
<a href="#" class="nav-link">Resources <span class="resource-icon">34</span></a>
19+
<a href="#" class="nav-link">About Us</a>
20+
<a href="#" class="nav-link">FAQ</a>
21+
<a href="#" class="nav-link new-icon">New</a>
22+
</div>
23+
<div class="nav-right">
24+
<button class="submit-btn"><span class="plus-icon">+</span> Submit</button>
25+
</div>
26+
</nav>
27+
<!-- <div style = "align-items: flex-end;">
28+
<h2> 1.6 million creators</h2>
29+
<h2> we are the fastest growing community on IG </h2>
30+
</div> -->
31+
<div class="stats">
32+
<div class="stats-text">
33+
<span class="stats-number">1.6 million creators</span>
34+
<br>
35+
<span class="stats-number">We are the fastest growing community on IG</span>
36+
</div>
37+
</div>
38+
<div>
39+
<img src="png_20230401_171342_0000.png" alt="iPhone" class="stats-image" style = "margin-left: 800px; size : 200px">
40+
41+
</div>
42+
43+
44+
45+
</body>
46+
<footer style = "margin-top: 150px;">
47+
<div class="footer-container">
48+
<div class="footer-item">
49+
<span class="footer-text">welovewebdesign</span>
50+
<svg class="footer-number" viewBox="0 0 100 100">
51+
<text x="50" y="50" text-anchor="middle" dominant-baseline="central">500K</text>
52+
</svg>
53+
</div>
54+
<div class="footer-item">
55+
<span class="footer-text">welovebranding</span>
56+
<svg class="footer-number" viewBox="0 0 100 100">
57+
<text x="50" y="50" text-anchor="middle" dominant-baseline="central">500K</text>
58+
</svg>
59+
</div>
60+
<div class="footer-item">
61+
<span class="footer-text">weloveillustrations</span>
62+
<svg class="footer-number" viewBox="0 0 100 100">
63+
<text x="50" y="50" text-anchor="middle" dominant-baseline="central">500K</text>
64+
</svg>
65+
</div>
66+
<div class="footer-item">
67+
<span class="footer-text">weloveanimations</span>
68+
<svg class="footer-number" viewBox="0 0 100 100">
69+
<text x="50" y="50" text-anchor="middle" dominant-baseline="central">500K</text>
70+
</svg>
71+
</div>
72+
</div>
73+
</footer>
74+
75+
76+
77+
78+
</html>

‎index.js

Whitespace-only changes.

‎png_20230401_171342_0000.png

518 KB
Loading

0 commit comments

Comments
 (0)