-
Notifications
You must be signed in to change notification settings - Fork 0
/
product_details.html
154 lines (151 loc) · 11.7 KB
/
product_details.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
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
<title>Ecommerce site</title>
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@400;600&display=swap">
<link rel="stylesheet" href="assets/fonts/fontawesome-all.min.css">
<link rel="stylesheet" href="assets/fonts/font-awesome.min.css">
<link rel="stylesheet" href="assets/fonts/ionicons.min.css">
<link rel="stylesheet" href="assets/fonts/line-awesome.min.css">
<link rel="stylesheet" href="assets/fonts/material-icons.min.css">
<link rel="stylesheet" href="assets/fonts/simple-line-icons.min.css">
<link rel="stylesheet" href="assets/fonts/fontawesome5-overrides.min.css">
<link rel="stylesheet" href="assets/css/Footer-Dark.css">
<link rel="stylesheet" href="https://unpkg.com/@bootstrapstudio/bootstrap-better-nav/dist/bootstrap-better-nav.min.css">
<link rel="stylesheet" href="assets/css/Newsletter-Subscription-Form.css">
<link rel="stylesheet" href="assets/css/Paralax-Hero-Banner.css">
<link rel="stylesheet" href="assets/css/Paralax-Hero-Banner-1.css">
<link rel="stylesheet" href="assets/css/styles.css">
</head>
<body>
<nav class="navbar navbar-light navbar-expand-md sticky-top bg-white better-bootstrap-nav-left">
<div class="container"><a class="navbar-brand" href="index.html"><img class="img-fluid" src="assets/img/logo__.png" style="width: 140px;"></a><button data-toggle="collapse" class="navbar-toggler" data-target="#navcol-2"><span class="sr-only">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
<div
class="collapse navbar-collapse" id="navcol-2">
<ul class="nav navbar-nav mr-auto">
<li class="nav-item dropdown"><a class="dropdown-toggle nav-link" data-toggle="dropdown" aria-expanded="false" href="#">Man </a>
<div class="dropdown-menu"><a class="dropdown-item" href="product_list.html">Shirts</a>
<div class="dropdown-divider"></div><a class="dropdown-item" href="product_list.html">Pants</a>
<div class="dropdown-divider"></div><a class="dropdown-item" href="product_list.html">T-shirts</a></div>
</li>
<li class="nav-item dropdown"><a class="dropdown-toggle nav-link" data-toggle="dropdown" aria-expanded="false" href="#">Woman</a>
<div class="dropdown-menu"><a class="dropdown-item" href="product_list.html">Office</a>
<div class="dropdown-divider"></div><a class="dropdown-item" href="product_list.html">T-Shirts</a>
<div class="dropdown-divider"></div><a class="dropdown-item" href="product_list.html">Pants</a></div>
</li>
</ul>
<ul class="nav navbar-nav ml-auto">
<li class="nav-item"><a class="nav-link active text-center" href="index.html"><i class="icon-home" style="font-size: 18px;"></i><br></a></li>
<li class="nav-item dropdown"><a class="dropdown-toggle nav-link text-center" data-toggle="dropdown" aria-expanded="false" href="#"><i class="icon-user" style="font-size: 18px;"></i></a>
<div class="dropdown-menu"><a class="dropdown-item" href="my-profile.html"><strong>Nathaly Toledo</strong></a><a class="dropdown-item" href="my-profile.html" style="font-size: 12px;">[email protected]</a>
<div class="dropdown-divider"></div><a class="dropdown-item" href="#">Orders List</a><a class="dropdown-item" href="#">Wishlist</a><a class="dropdown-item" href="#">Bag</a><a class="dropdown-item" href="my-profile.html">My Address</a><a class="dropdown-item"
href="my-profile.html">My Saved Cards</a>
<div class="dropdown-divider"></div><a class="dropdown-item" href="my-profile.html">Edit Profile</a><a class="dropdown-item text-danger" href="#">Log Out</a></div>
</li>
<li class="nav-item"><a class="nav-link text-center" href="check-out.html"><i class="fa fa-bookmark-o" style="font-size: 18px;"></i><br></a></li>
<li class="nav-item"><a class="nav-link text-center" href="check-out.html"><i class="icon-bag" style="font-size: 18px;"></i><br></a></li>
</ul>
</div>
</div>
</nav>
<section>
<div class="container mt-5">
<div class="row justify-content-center align-items-start">
<div class="col-lg-6">
<div class="carousel slide" data-ride="carousel" id="carousel-1">
<div class="carousel-inner">
<div class="carousel-item active"><img class="w-100 d-block" src="assets/img/products/Women/woman-white-clothing-dress-neck-shoulder-1605198-pxhere.com.jpg" alt="Slide Image"></div>
<div class="carousel-item"><img class="w-100 d-block" src="assets/img/products/Women/woman-white-clothing-dress-robe-outerwear-1609012-pxhere.com.jpg" alt="Slide Image"></div>
<div class="carousel-item"><img class="w-100 d-block" src="assets/img/products/Women/woman-white-clothing-dress-shoulder-outerwear-1609009-pxhere.com.jpg" alt="Slide Image"></div>
<div class="carousel-item"><img class="w-100 d-block" src="assets/img/products/Women/woman-white-clothing-shoulder-sleeve-neck-1619140-pxhere.com.jpg" alt="Slide Image"></div>
</div>
<div><a class="carousel-control-prev" href="#carousel-1" role="button" data-slide="prev"><span class="carousel-control-prev-icon"></span><span class="sr-only">Previous</span></a><a class="carousel-control-next" href="#carousel-1" role="button"
data-slide="next"><span class="carousel-control-next-icon"></span><span class="sr-only">Next</span></a></div>
<ol class="carousel-indicators">
<li data-target="#carousel-1" data-slide-to="0" class="active"></li>
<li data-target="#carousel-1" data-slide-to="1"></li>
<li data-target="#carousel-1" data-slide-to="2"></li>
<li data-target="#carousel-1" data-slide-to="3"></li>
</ol>
</div>
</div>
<div class="col-lg-6">
<h3 class="mt-4"><strong>white clothing dress robe outerwear</strong></h3>
<div class="mb-5">
<p style="font-size: 25px;"><i class="la la-dollar" style="color: rgb(186,145,0);font-size: 25px;"></i>20</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor inci ut aliquip ex ea commodo consequat.<br></p>
<hr>
</div>
<h5>Color: WHITE</h5>
<div class="mt-3">
<form>
<div class="form-group">
<div class="custom-control custom-radio"><input class="custom-control-input" type="radio" id="formCheck-1" name="size" value="s"><label class="custom-control-label" for="formCheck-1">Small</label></div>
</div>
<div class="form-group">
<div class="custom-control custom-radio"><input class="custom-control-input" type="radio" id="formCheck-2" name="size" value="m"><label class="custom-control-label" for="formCheck-2">Medium</label></div>
</div>
<div class="form-group">
<div class="custom-control custom-radio"><input class="custom-control-input" type="radio" id="formCheck-3" name="size" value="l"><label class="custom-control-label" for="formCheck-3">Large</label></div>
</div>
<div class="form-group">
<div class="custom-control custom-radio"><input class="custom-control-input" type="radio" id="formCheck-4" name="size" value="xl"><label class="custom-control-label" for="formCheck-4">Extra Large</label></div>
</div>
</form>
</div>
<div><button class="btn btn-outline-dark btn-block" type="button"><i class="fa fa-bookmark-o"></i> Add to Wishlist</button></div>
<div class="mt-2">
<form>
<div class="alert alert-success" role="alert"><span>Shipping is available.</span></div>
<div class="form-row">
<div class="col-6"><a class="btn btn-outline-dark btn-block" role="button" data-toggle="tooltip" data-bs-tooltip="" title="Add this product to you shopping bag!" href="check-out.html"><i class="icon ion-bag" style="font-size: 18px;"></i></a></div>
<div
class="col-6"><button class="btn btn-primary btn-block" data-toggle="tooltip" data-bs-tooltip="" type="button" title="Buy is this now!"><i class="la la-shopping-cart" style="font-size: 24px;"></i></button></div>
</div>
</form>
</div>
</div>
</div>
</div>
</section>
<div class="footer-dark mt-5">
<footer>
<div class="container">
<div class="row">
<div class="col-sm-6 col-md-3 item">
<h3 class="text-white">collections</h3>
<ul>
<li><a href="#">Women</a></li>
<li><a href="#">Men</a></li>
<li><a href="#">Unisex</a></li>
</ul>
</div>
<div class="col-sm-6 col-md-3 item">
<h3 class="text-white">About</h3>
<ul>
<li><a href="#">Company</a></li>
<li><a href="#">Team</a></li>
<li><a href="#"></a></li>
</ul>
</div>
<div class="col-md-6 item text">
<h3 class="text-white">fashion estd</h3>
<p>Praesent sed lobortis mi. Suspendisse vel placerat ligula. Vivamus ac sem lacus. Ut vehicula rhoncus elementum. Etiam quis tristique lectus. Aliquam in arcu eget velit pulvinar dictum vel in justo.</p>
</div>
<div class="col item social"><a href="#"><i class="icon-social-facebook" style="font-size: 17px;"></i></a><a href="#"><i class="icon-social-twitter" style="font-size: 17px;"></i></a><a href="#"><i class="icon-social-instagram" style="font-size: 17px;"></i></a></div>
</div>
<p class="copyright">Nathaly Toledo © 2020</p>
</div>
</footer>
<div class="text-center"><a class="text-secondary" href="http://www.freepik.com" target="_blank">Logo designed by Designertale</a></div>
</div>
<script src="assets/js/jquery.min.js"></script>
<script src="assets/bootstrap/js/bootstrap.min.js"></script>
<script src="assets/js/bs-init.js"></script>
<script src="https://unpkg.com/@bootstrapstudio/bootstrap-better-nav/dist/bootstrap-better-nav.min.js"></script>
<script src="assets/js/Paralax-Hero-Banner.js"></script>
</body>
</html>