Skip to content

Commit 399fc46

Browse files
prateekverma145prateekverma145
authored
Create index.html
added a asthetic product card
1 parent cd4aefa commit 399fc46

File tree

1 file changed

+77
-0
lines changed

1 file changed

+77
-0
lines changed

‎modern_chair/index.html‎

Lines changed: 77 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,77 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>Modern Chair</title>
7+
<link rel="stylesheet" href="styles.css">
8+
<link rel="shortcut icon" href="./images/favicon.ico" type="image/x-icon">
9+
</head>
10+
<body>
11+
<div class="section-fluid-main">
12+
<div class="section">
13+
<div class="info-wrap mob-margin">
14+
<p class="title-up">Modern Chair</p>
15+
<h2>Telford Longue</h2>
16+
<h4>$254<span>$530</span></h4>
17+
<div class="section-fluid">
18+
<input type="radio" name="desc-btn" class="desc-btn" id="desc-1" checked>
19+
<label for="desc-1">Description</label>
20+
<input type="radio" name="desc-btn" class="desc-btn" id="desc-2">
21+
<label for="desc-2">Details</label>
22+
<div class="section-fluid desc-sec accor-1">
23+
<p>
24+
Lorem ipsum dolor sit amet consectetur adipisicing elit.
25+
Dolorem nihil placeat non deleniti, aliquid voluptate.
26+
Delectus architecto magni consequatur culpa?
27+
</p>
28+
</div>
29+
<div class="section-fluid desc-sec accor-2">
30+
<div class="section-inline">
31+
<p><span>80</span>cm<br/>Length</p>
32+
</div>
33+
<div class="section-inline">
34+
<p><span>65</span>cm<br/>Width</p>
35+
</div>
36+
<div class="section-inline">
37+
<p><span>90</span>cm<br/>Height</p>
38+
</div>
39+
<div class="section-inline">
40+
<p><span>17.6</span>lbs<br/>Weight</p>
41+
</div>
42+
</div>
43+
</div>
44+
<h5>Choose color:</h5>
45+
</div>
46+
47+
<input type="radio" name="color-btn" id="color-1" class="color-btn for-color-1" checked/>
48+
<label class="first-color" for="color-1"></label>
49+
<input type="radio" name="color-btn" id="color-2" class="color-btn for-color-2"/>
50+
<label class="color-2" for="color-2"></label>
51+
<input type="radio" name="color-btn" id="color-3" class="color-btn for-color-3"/>
52+
<label class="color-3" for="color-3"></label>
53+
<input type="radio" name="color-btn" id="color-4" class="color-btn for-color-4"/>
54+
<label class="color-4" for="color-4"></label>
55+
<input type="radio" name="color-btn" id="color-5" class="color-btn for-color-5"/>
56+
<label class="color-5" for="color-5"></label>
57+
<input type="radio" name="color-btn" id="color-6" class="color-btn for-color-6"/>
58+
<label class="color-6" for="color-6"></label>
59+
<div class="info-wrap">
60+
<a href="#" class="btn"><i class="uil-shopping-cart icon"></i>Add To Cart</a>
61+
</div>
62+
<div class="img-wrap chair-1"></div>
63+
<div class="img-wrap chair-2"></div>
64+
<div class="img-wrap chair-3"></div>
65+
<div class="img-wrap chair-4"></div>
66+
<div class="img-wrap chair-5"></div>
67+
<div class="img-wrap chair-6"></div>
68+
<div class="back-color"></div>
69+
<div class="back-color chair-2"></div>
70+
<div class="back-color chair-3"></div>
71+
<div class="back-color chair-4"></div>
72+
<div class="back-color chair-5"></div>
73+
<div class="back-color chair-6"></div>
74+
</div>
75+
</div>
76+
</body>
77+
</html>

0 commit comments

Comments
 (0)