forked from ASP124/E-Learning-Website
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
286 lines (260 loc) · 14 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
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
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
<!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>ChaloPadhe - Learn with Us, Anytime, Anywhere.</title>
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
<link rel="stylesheet" href="styles.css">
</head>
<body>
<header>
<div class="navbar">
<a href="index.html" class="logo">
<img src="./assets/images/logoo.png" alt="ChaloPadhe logo">
</a>
<input type="checkbox" id="menu-toggle" class="menu-toggle">
<label for="menu-toggle" class="hamburger">
<i class="fas fa-bars"></i>
</label>
<div class="menu">
<ul class="navbar-list">
<li class="navbar-item"><a href="#home" class="navbar-link">Home</a></li>
<li class="navbar-item"><a href="courses.html" class="navbar-link">Courses</a></li>
<li class="navbar-item"><a href="contact-us.html" class="navbar-link">Contact</a></li>
<li class="navbar-item"><a href="about-us.html" class="navbar-link">About</a></li>
</ul>
<div class="icons">
<a href="#" class="notification-icon"><i class="fas fa-bell"></i></a>
<a href="#" class="profile-icon"><i class="fas fa-user"></i></a>
</div>
</div>
</div>
</header>
<main>
<section class="hero" id="home">
<div class="container">
<div class="textnbutton">
<h1>Welcome To <span class="titlename"> ChaloPadhe! </span></h1>
<h2>Learn with Us, Anytime, Anywhere.</h2>
<p>Unlock your potential with flexible and accessible education, tailored to your pace and
convenience.</p>
<a href="#popcourse">
<button class="courseButton">Check Our Popular Courses</button>
</a>
</div>
<div class="mainImg">
<img src="./assets/images/Landing page image.svg" alt="hero banner">
</div>
</div>
</section>
<section class="introSection">
<div class="container">
<h2>What Are We? Know About Us!!</h2>
<div class="introContent">
<img src="./assets/images/logoo.png" alt="ChaloPadhe logo">
<p>ChaloPadhe is a comprehensive platform designed to enhance your learning journey.
We offer a wide range of educational programs, from online degrees to non-degree and off-campus
courses.
Our goal is to provide flexible and accessible learning options that fit your lifestyle and
career
goals.
Whether you're looking to advance your career, explore new fields, or simply learn something
new,
ChaloPadhe is here to support your educational aspirations with high-quality resources and
expert
guidance.</p>
</div>
</div>
</section>
<section class="progSection">
<div class="container">
<h2>ChaloPadhe Programs Overview</h2>
<div class="cards">
<div class="progCard">
<h3>Online Degree Programs</h3>
<p>Lorem ipsum dolor consec tur elit adicing sed umod tempor.</p>
<span>7 Courses</span>
</div>
<div class="progCard">
<h3>Non-Degree Programs</h3>
<p>Lorem ipsum dolor consec tur elit adicing sed umod tempor.</p>
<span>5 Courses</span>
</div>
<div class="progCard">
<h3>Off-Campus Programs</h3>
<p>Lorem ipsum dolor consec tur elit adicing sed umod tempor.</p>
<span>3 Courses</span>
</div>
<div class="progCard">
<h3>Hybrid Distance Programs</h3>
<p>Lorem ipsum dolor consec tur elit adicing sed umod tempor.</p>
<span>4 Courses</span>
</div>
</div>
</div>
</section>
<section>
<div class="container">
<h2 id="popcourse">Our Popular Courses</h2>
<ul class="gridlist">
<li>
<a href="/detailspages/dsdetails.html" class="course-link">
<div class="courseCards">
<figure>
<img src="/assets/images/python.jpg" alt="pythonLogo">
</figure>
<div class="cardContent">
<span class="badge">Intermediate</span>
<h3 class="h3">
Python for Data Science And Development</h3>
<p class="card-description">Python programming fundamentals and its powerful
applications in data science, web development, and automation. This course
teaches data analysis, visualization, and essential development skills.</p>
<div class="rating">
<svg class="star-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"
fill="#FFD700" width="16px" height="16px">
<path
d="M12 17.27L18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z" />
</svg>
<p class="rating-star">4.7<span class="rating-reviews"> (6.4K Reviews)</span>
</p>
</div>
<data class="price" value="699">₹699</data>
<ul class="contentOverview">
<li>
<span class="overview">42 total hours</span>
<span class="overview">186 lectures</span>
</li>
</ul>
</div>
</div>
</a>
</li>
<li>
<a href="/detailspages/javadetails.html" class="course-link">
<div class="courseCards">
<figure>
<img src="/assets/images/java.webp" alt="javaLogo">
</figure>
<div class="cardContent">
<span class="badge">Advanced</span>
<h3 class="h3">
Java Programming Masterclass for Software
Developers</h3>
<p class="card-description">Gain expertise in Java programming with this in-depth
course. Explore advanced topics such as Java 8 features, multi-threading, and
design patterns, and learn to build practical, real-world applications.</p>
<div class="rating">
<svg class="star-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"
fill="#FFD700" width="16px" height="16px">
<path
d="M12 17.27L18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z" />
</svg>
<p class="rating-star">4.2<span class="rating-reviews"> (3.2K Reviews)</span>
</p>
</div>
<data class="price" value="899">₹899</data>
<ul class="contentOverview">
<li>
<span class="overview">52 total hours</span>
<span class="overview">192 lectures</span>
</li>
</ul>
</div>
</div>
</a>
</li>
<li>
<a href="/detailspages/aidetails.html" class="course-link">
<div class="courseCards">
<figure>
<img src="/assets/images/AI.jpg" alt="AIimage">
</figure>
<div class="cardContent">
<span class="badge">Beginner</span>
<h3 class="h3 card-title">
Introduction to Artificial Intelligence (AI)</h3>
<p class="card-description">Start your AI journey with this introductory course.
Learn the basics of artificial intelligence, machine learning, neural
networks,
and natural language processing, and understand their applications in
various
fields.</p>
<div class="rating">
<svg class="star-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"
fill="#FFD700" width="16px" height="16px">
<path
d="M12 17.27L18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z" />
</svg>
<p class="rating-star">4.5<span class="rating-reviews"> (8.2K Reviews)</span>
</p>
</div>
<data class="price" value="599">₹599</data>
<ul class="contentOverview">
<li>
<span class="overview">21 total hours</span>
<span class="overview">112 lectures</span>
</li>
</ul>
</div>
</div>
</a>
</li>
</ul>
</div>
</section>
</main>
<footer>
<div class="footergrid">
<div class="footer-list">
<div class="compLogo">
<img src="/assets/images/logoo.png" class="logo1" alt="ChaloPadhe Logo">
<p class="compBrief">
ChaloPadhe is a dynamic e-learning platform dedicated to providing flexible and accessible
education for learners of all ages, anytime, anywhere.
</p>
</div>
</div>
<div class="footer-list">
<h3>Office</h3>
<p class="add">Katai Pipeline Road,</p>
<p class="add">Near Nevali-phata, Dombivli</p>
<p class="add">Maharashtra, PIN:421203, India</p>
<p class="email-id">[email protected]</p>
<h5>+91-87791 55512</h5>
<h5>+91-99874 93899</h5>
</div>
<div class="footer-list">
<h3>Links</h3>
<ul>
<li><a href="#">Home</a></li>
<li><a href="/courses.html">Courses</a></li>
<li><a href="/contact-us.html">Contact Us</a></li>
<li><a href="/about-us.html">About Us</a></li>
</ul>
</div>
<div class="footer-list">
<h3>Newsletter</h3>
<form action="" class="newsletter-form">
<input type="email" name="email_address" placeholder="Your email" required class="input-field">
<button type="submit" class="subButton">
<span class="span">Subscribe</span>
</button>
</form>
<ul class="social-list">
<li><a href="https://www.instagram.com" target="_blank"><i class="fab fa-instagram"></i></a></li>
<li><a href="https://www.linkedin.com" target="_blank"><i class="fab fa-linkedin"></i></a></li>
<li><a href="https://www.facebook.com" target="_blank"><i class="fab fa-facebook"></i></a></li>
</ul>
</div>
</div>
<hr>
<p class="copyright">
© 2024 ChaloPadhe - All Rights Reserved
</p>
</footer>
</body>
</html>