-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathProduct Catalog.html
141 lines (138 loc) · 7.45 KB
/
Product Catalog.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Product Catalog</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<style>
.product-card {
margin-bottom: 20px;
}
.product-card img {
height: fit-content;
object-fit: cover;
}
.product-card .card-body {
text-align: center;
}
img{
height: 100%;
}
</style>
</head>
<body>
<div class="container mt-4">
<div class="row">
<!-- Product 1 -->
<div class="col-md-4">
<div class="card product-card">
<img src="https://s3.ap-south-1.amazonaws.com/happimobiles/product-main-images/happi_mobiles_vivo_x_fold3_pro_celestial%20black_main_image.webp" class="card-img-top" alt="Product 1">
<div class="card-body">
<h5 class="card-title">Vivo X Fold3 </h5>
<p class="card-text">₹1,60,100.00</p>
<p class="card-text">X Fold3 Pro, while significantly enhancing its features and staying ahead of competitors, still maintains .</p>
</div>
</div>
</div>
<!-- Product 2 -->
<div class="col-md-4">
<div class="card product-card">
<img src="https://s3.ap-south-1.amazonaws.com/happimobiles/product-main-images/happi_mobiles_samsung_galaxy_f55_5g_apricot_main_image1.webp" class="card-img-top" alt="Product 2">
<div class="card-body">
<h5 class="card-title">SAMSUNG Galaxy F55 5G </h5>
<p class="card-text"> ₹26,999.00</p>
<p class="card-text">Classy vegan leather finish with a unique saddle stitch pattern, crafted to perfection by the masters. A work of .</p>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card product-card">
<img src="https://s3.ap-south-1.amazonaws.com/happimobiles/product-main-images/oppo_a18_black_main_img.webp" class="card-img-top" alt="Product 4">
<div class="card-body">
<h5 class="card-title">Oppo A18 4G Glowing Black</h5>
<p class="card-text"> ₹9,099.00 </p>
<p class="card-text">This smartphone keeps pace with all your scrolling, snapping, watching, and working. Tech smarts translate </p>
</div>
</div>
</div>
<!-- Product 3 -->
<div class="col-md-4">
<div class="card product-card">
<img src="https://assets.unlayer.com/projects/123867/1672926343574-happi_mobiles_apple_ipad_10th_gen_11.webp" class="card-img-top" alt="Product 3">
<div class="card-body">
<h5 class="card-title">Apple iPad 10th Gen Wifi Only 10.9 Inch Blue 64GB</h5>
<p class="card-text"> ₹54,499.00 </p>
<p class="card-text">Model Number
MPQ13HN/A
Model Name
iPad (10th Gen)
Color
Blue
Connectivity </p>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card product-card">
<img src="https://s3.ap-south-1.amazonaws.com/happimobiles/product-main-images/na-thin-and-light-laptop-lenovo-original-imagyk4hedcydqx5.webp" class="card-img-top" alt="Product 3">
<div class="card-body">
<h5 class="card-title">Lenovo 82FE00QLIN IP Slim i5</h5>
<p class="card-text"> ₹52,499.00 </p>
<p class="card-text">11th Generation Intel® Core™ i5 processor, Windows 10 Home 64, 35.56 cm (14") diagonal, </p>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card product-card">
<img src="https://s3.ap-south-1.amazonaws.com/happimobiles/product-main-images/na-thin-and-light-laptop-lenovo-original-imag5jy6fsm2yx4q.webp" class="card-img-top" alt="Product 3">
<div class="card-body">
<h5 class="card-title">Lenovo IdeaPad 3 Core i3 11th Gen</h5>
<p class="card-text"> ₹34,499.00 </p>
<p class="card-text">Model Number
Ideapad Slim 5i
Brand
Lenovo
Sales Package
Laptop, Power Adaptor, User Guide
Model Name
15 ITL 05
</p>
</div>
</div>
</div>
<!-- Product 4 -->
<div class="col-md-4">
<div class="card product-card">
<img src="https://happimobiles.s3.ap-south-1.amazonaws.com/happi/UVCATBXE-1598523563399.jpg" class="card-img-top" alt="Product 4">
<div class="card-body">
<h5 class="card-title">TCL 75P715 Ultra HD LED TV 75 Inch</h5>
<p class="card-text"> ₹1,09,999.00</p>
<p class="card-text">TCL 2 5G, with a 6.5-inch (234.0 mm) AMOLED display, 120Hz refresh rate, 100% sRGB, 12MP + 5MP + 5MP + 2MP </p>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card product-card">
<img src="https://happimobiles.s3.amazonaws.com/product/446b5100-2789-11ed-b130-33d52fa55ed0/8188a056-758d-413a-a00e-383860289c76.webp" class="card-img-top" alt="Product 4">
<div class="card-body">
<h5 class="card-title">Conekt Buds Mini Truly Wireless</h5>
<p class="card-text"> ₹2,499.00</p>
<p class="card-text">Happi Mobiles an online mobile store, is a one-stop solution for all your Mobiles, Tablets,Integrating a MEMC chip, the Mi TV 4X offers blur-free rendering of </p>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card product-card">
<img src="https://i01.appmifile.com/webfile/globalimg/products/pc/mi-tv-4x-65_1/pw3-tv.png" style="padding-top: 100px; padding-bottom: 60px;" class="card-img-top" alt="Product 4">
<div class="card-body">
<h5 class="card-title">TCL HD Smart Tv 43 Inch Black</h5>
<p class="card-text"> ₹22,990.00</p>
<p class="card-text" style="margin-bottom: 20px;">Powered by Vivid Picture Engine, the display delivers exceptional colour accuracy and colour vibrancy. </p>
</div>
</div>
</div>
</div>
</div>
</body>
</html>