-
Notifications
You must be signed in to change notification settings - Fork 48
Expand file tree
/
Copy pathblog.html
More file actions
206 lines (185 loc) · 8.54 KB
/
blog.html
File metadata and controls
206 lines (185 loc) · 8.54 KB
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
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>STYLÉKA</title>
<!-- <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.4/css/all.css" /> -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css">
<link rel="stylesheet" href="style.css">
</head>
<body>
<section id="header">
<!-- <a href="#"><img src="img/Untitled_design__1_-removebg-preview.png" class="logo" alt=""></a> -->
<!-- <h1>STYLÉKA</h1> -->
<span class="site-title">STYLÉKA</span>
<div>
<ul id="navbar">
<li><a href="index.html">Home</a></li>
<li><a href="shop.html">Shop</a></li>
<li><a class="active" href="blog.html">Blog</a></li>
<li><a href="about.html">About</a></li>
<li><a href="contact.html">Contact</a></li>
<li id="lg-bag"><a href="cart.html"><i class="fa fa-shopping-cart" aria-hidden="true"></i></a></li>
<a href="#" id="close"><i class="fa-solid fa-xmark"></i></a>
</ul>
</div>
<div id="mobile">
<a href="cart.html"><i class="fa-solid fa-bag-shopping"></i></a>
<i id="bar" class="fas fa-outdent"></i>
</div>
</section>
<section id="page-header" class="blog-header">
<div class="hero-content">
<h2>Fashion Stories & Style Insights</h2>
<p>Discover the latest trends, styling tips, and fashion inspiration from our expert team. Stay ahead of the curve with our curated collection of fashion stories.</p>
<div class="hero-features">
<div class="feature">
<i class="fas fa-star"></i>
<span>Expert Style Tips</span>
</div>
<div class="feature">
<i class="fas fa-trending-up"></i>
<span>Latest Trends</span>
</div>
<div class="feature">
<i class="fas fa-palette"></i>
<span>Fashion Inspiration</span>
</div>
</div>
</div>
</section>
<section id="blog">
<div class="blog-box">
<div class="blog-img">
<img src="https://images.pexels.com/photos/996329/pexels-photo-996329.jpeg?auto=compress&cs=tinysrgb&w=500&h=400&fit=crop" alt="Fashion Blog Post">
</div>
<div class="blog-details">
<h4>The Cotton-Jersey Zip-Up Trend</h4>
<p>Discover the latest trends in cotton-jersey zip-ups and how to style them for any occasion.
Perfect for layering and creating effortless looks...
</p>
<a href="#">CONTINUE READING</a>
</div>
<h1>13/01</h1>
</div>
<div class="blog-box">
<div class="blog-img">
<img src="https://images.pexels.com/photos/1040945/pexels-photo-1040945.jpeg?auto=compress&cs=tinysrgb&w=500&h=400&fit=crop" alt="Men's Fashion">
</div>
<div class="blog-details">
<h4>How to Style A Classic Look</h4>
<p>Master the art of timeless menswear with our comprehensive guide to classic styling.
From formal to casual, learn the essentials...
</p>
<a href="#">CONTINUE READING</a>
</div>
<h1>13/04</h1>
</div>
<div class="blog-box">
<div class="blog-img">
<img src="https://images.pexels.com/photos/1656684/pexels-photo-1656684.jpeg?auto=compress&cs=tinysrgb&w=500&h=400&fit=crop" alt="Street Style Fashion">
</div>
<div class="blog-details">
<h4>Must Have Street Style Items</h4>
<p>Explore the essential pieces every fashion-forward individual needs in their wardrobe.
Street style inspiration and shopping tips...
</p>
<a href="#">CONTINUE READING</a>
</div>
<h1>12/01</h1>
</div>
<div class="blog-box">
<div class="blog-img">
<img src="https://images.pexels.com/photos/1240892/pexels-photo-1240892.jpeg?auto=compress&cs=tinysrgb&w=500&h=400&fit=crop" alt="Runway Fashion">
</div>
<div class="blog-details">
<h4>Runway Inspired Trends</h4>
<p>Bring high fashion to your everyday wardrobe with runway-inspired looks that are
accessible and stylish for real life...
</p>
<a href="#">CONTINUE READING</a>
</div>
<h1>16/01</h1>
</div>
<div class="blog-box">
<div class="blog-img">
<img src="https://images.pexels.com/photos/1620695/pexels-photo-1620695.jpeg?auto=compress&cs=tinysrgb&w=500&h=400&fit=crop" alt="Fashion Trends">
</div>
<div class="blog-details">
<h4>AW20 Fashion Trends</h4>
<p>Get ahead of the curve with autumn/winter fashion trends. From cozy textures to
bold patterns, discover what's trending...
</p>
<a href="#">CONTINUE READING</a>
</div>
<h1>10/03</h1>
</div>
</section>
<section id="pagination" class="section-p1">
<a href="#">1</a>
<a href="#">2</a>
<a href="#"><i class="fa-solid fa-arrow-right-long"></i></a>
</section>
<section id="newsletter" class="section-p1 section-m1">
<div class="newstext">
<h4>Sign Up For Newsletter</h4>
<p>Get E-mail updates about our latest shop and <span>special offers.</span></p>
</div>
<div class="form">
<input type="text" placeholder="Your email address">
<button class="normal">Sign Up</button>
</div>
</section>
<footer class="section-p1">
<div class="col">
<img src="https://images.pexels.com/photos/5632371/pexels-photo-5632371.jpeg?auto=compress&cs=tinysrgb&w=200&h=100&fit=crop" alt="STYLÉKA Logo" width="200px">
<h4>Contact</h4>
<p><strong>Address :</strong> Guru Nanak Dev University , Amritsar</p>
<p><strong>Phone :</strong> (+91) - 8507566667</p>
<p><strong>Hours :</strong> 10:00 - 18:00 , Mon - Sat</p>
<div class="follow">
<h4>Follow Us</h4>
<div class="icon">
<i class="fa-brands fa-facebook"></i>
<i class="fa-brands fa-twitter"></i>
<i class="fa-brands fa-instagram"></i>
<i class="fa-brands fa-pinterest-p"></i>
<i class="fa-brands fa-youtube"></i>
</div>
</div>
</div>
<div class="col">
<h4>About</h4>
<a href="#">About us</a>
<a href="#">Delivery Information</a>
<a href="#">Privacy Policy</a>
<a href="#">Terms & Conditions</a>
<a href="#">Contact us</a>
</div>
<div class="col">
<h4>My Account</h4>
<a href="#">Sign In</a>
<a href="#">View Cart</a>
<a href="#">My Wishlist</a>
<a href="#">Track My Orders</a>
<a href="#">Help</a>
</div>
<div class="col install">
<h4>Install App</h4>
<p>From App Store or Google Play</p>
<div class="row">
<img src="https://developer.apple.com/assets/elements/badges/download-on-the-app-store.svg" alt="Download on App Store" style="height: 40px;">
<img src="https://upload.wikimedia.org/wikipedia/commons/7/78/Google_Play_Store_badge_EN.svg" alt="Get it on Google Play" style="height: 40px;">
</div>
<p>Secure Payment Gateways</p>
<img src="https://images.pexels.com/photos/6963098/pexels-photo-6963098.jpeg?auto=compress&cs=tinysrgb&w=300&h=60&fit=crop" alt="Payment Methods" style="height: 40px;">
</div>
<div class="copyright">
<p>© 2025 , Powered By STYLÉKA</p>
</div>
</footer>
<script src="script.js"></script>
</body>
</html>