-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
139 lines (120 loc) · 4.84 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ecommerce Clothes</title>
<link rel="stylesheet" href="/style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/css/all.min.css">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Roboto+Mono:ital,wght@0,100;1,100&display=swap" rel="stylesheet">
</head>
<body>
<!-- navigation -->
<nav>
<div class="container">
<h1>Clothes</h1>
<ul>
<li><a href="#home">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#products">Products</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
</div>
</nav>
<!-- home content -->
<div id="home"></div>
<div class="home-container">
<div class="home-content">
<h1>30% Discount</h1>
<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Odit placeat modi incidunt illo, est dolores ad quas repellendus nisi nostrum!</p>
<button>Order Now</button>
</div>
<div class="image-container"><img src="/images/model.png" alt=""></div>
</div>
<!-- about-page -->
<div id="about"></div>
<div class="about-container">
<h1>About Us</h1>
<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Voluptates dolorum quidem quod cumque accusamus aliquam fuga, saepe quia maiores repudiandae modi ipsa! Eius excepturi aut veritatis facere eveniet dolore ipsa ullam, laudantium laboriosam velit. Illo soluta iure esse, nihil minima porro eaque! Molestiae autem aliquam, obcaecati necessitatibus esse sed suscipit!</p>
</div>
<!-- products-page -->
<div id="products"></div>
<div class="products-page-container">
<h1>Our Products</h1>
<div class="products-container">
<div class="product-container">
<img src="/images/jeans.png" alt="Jeans">
<h2>Jeans</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Corporis, earum.</p>
<p class="price">95.000</p>
</div>
<div class="product-container">
<img src="/images/jacket.png" alt="jacket">
<h2>Jacket</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Corporis, earum.</p>
<p class="price">150.000</p>
</div>
<div class="product-container">
<img src="/images/scarf.png" alt="scarf">
<h2>Scarf</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Corporis, earum.</p>
<p class="price">50.000</p>
</div>
<div class="product-container">
<img src="/images/shoes.jpg" alt="shoes">
<h2>Shoes</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Corporis, earum.</p>
<p class="price">200.000</p>
</div>
<div class="product-container">
<img src="/images/watch.png" alt="watch">
<h2>Watch</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Corporis, earum.</p>
<p class="price">400.000</p>
</div>
</div>
</div>
<!-- contact-page-container -->
<div id="contact"></div>
<div class="contact-page-container">
<h1>Contact</h1>
<div class="contact-container">
<form class="form">
<label for="name">Name</label>
<input type="text" id="name" placeholder="Write your name">
<label for="email">Email</label>
<input type="email" id="email" placeholder="Write your email">
<label for="text">Text</label>
<textarea id="text" cols="30" rows="10" placeholder="Ask something..."></textarea>
<input class="submit" type="submit" value="Send">
</form>
<div class="contact">
<div class="icon">
<i class="fas fa-phone-alt"></i>
<p>+998 97 443 00 26</p>
</div>
<div class="icon">
<i class="fas fa-envelope"></i>
<p>[email protected]</p>
</div>
<div class="icon">
<i class="fab fa-telegram-plane"></i>
<p>@abdulaziz_2212</p>
</div>
<div class="icon">
<i class="fab fa-instagram"></i>
<p>abdulaziz_221201</p>
</div>
<div class="icon">
<i class="fab fa-facebook"></i>
<p>abdulaziz2212</p>
</div>
</div>
</div>
</div>
<footer>
<div class="footer-container">All rights reserved. Copyright <sup style="font-size: 26px"> © </sup></div>
</footer>
</body>
</html>