-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
117 lines (105 loc) · 4.18 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
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title> ESeller </title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" href="https://w7.pngwing.com/pngs/824/301/png-transparent-social-media-scalable-graphics-favicon-icon-t-english-tshirt-blue-text.png">
<!-- font awesome cdn -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/css/all.min.css" integrity="sha512-+4zCK9k+qNFUR5X+cKL9EIR+ZOhtIloNl9GIKS57V1MyNsYpYcUrUeQc9vNfzsWfV28IaLL3i96P9sdNyeRssA==" crossorigin="anonymous" />
<link rel="stylesheet" href="style.css">
</head>
<body>
<!-- header -->
<header>
<div class = "container">
<!-- navbar -->
<nav class = "navbar">
<a href = "index.html" class = "navbar-brand">ESeller</a>
<button type = "button" class = "navbar-toggler">
<i class = "fas fa-bars"></i>
</button>
<div class = "navbar-collapse">
<ul>
<li><a href = "#">Home</a></li>
<li><a href = "#">Category</a></li>
<li><a href = "#">Blog</a></li>
<li><a href = "#">Contact</a></li>
</ul>
</div>
<div class = "cart">
<button type = "button" id = "cart-btn">
<i class = "fas fa-shopping-cart"></i>
<span id = "cart-count-info"></span>
</button>
<div class = "cart-container">
<div class = "cart-list">
</div>
<div class = "cart-total">
<h3>Total: £ </h3>
<span id = "cart-total-value"></span>
</div>
</div>
</div>
</nav>
<!-- end of navbar -->
<!-- banner -->
<div class = "banner">
<div class = "banner-content">
<h1>Smart Shirts Collections </h1>
<p class = "text">Lorem ipsum dolor sit amet consectetur adipisicing elit. Quos eveniet, quis nisi recusandae assumenda ea sequi obcaecati accusantium in provident dolore debitis autem neque vel commodi atque voluptates incidunt aliquam delectus veritatis? Exercitationem, fugit sed!</p>
<div class = "btns">
<button type = "button" class = "btn">know more</button>
<button type = "button" class = "btn">more info</button>
</div>
</div>
<div class = "banner-img">
<img src = "https://www.beyoung.in/api/cache/catalog/category-banner/mobile/mobileView_men_graphic_category_banner-_767x430.jpg" alt = "t-shirts banner">
</div>
</div>
</div>
</header>
<!-- end of header -->
<!-- products section -->
<section class = "products">
<div class = "container">
<h2>Our Collections</h2>
<div class = "product-list">
</div>
</div>
</section>
<!-- end of products section -->
<!-- footer -->
<footer>
<div class = "footer-banner">
<div class = "container">
<h2>Latest Collections</h2>
<p class = "text">Lorem ipsum dolor sit amet consectetur adipisicing elit. Maiores est quod maxime nisi possimus corporis qui aliquid molestias sit iusto itaque, cum delectus tempore, distinctio velit. Repellat reiciendis suscipit quidem aliquid ipsam, nemo minus repudiandae quas eligendi natus voluptate nostrum?</p>
<button type = "button" class = "btn">View More</button>
</div>
</div>
<div class = "container">
<div class = "social-icons">
<a href = "">
<i class = "fab fa-facebook-f"></i>
</a>
<a href = "">
<i class = "fab fa-twitter"></i>
</a>
<a href = "">
<i class = "fab fa-instagram"></i>
</a>
<a href = "">
<i class = "fab fa-pinterest"></i>
</a>
<a href = "">
<i class = "fab fa-linkedin"></i>
</a>
</div>
</div>
</footer>
<!-- end of footer -->
<script src="app.js"></script>
</body>
</html>