Skip to content

Commit f1763c9

Browse files
vaishali-sharma-20vaishali-sharma-20
authored
Replaced Contact section at Home page with the Form (#372)
* Create Github-Pages Created Github Page Blog. Please check it and review it. * added form home.html * Update home.html * Update home.html * Update home.html * Update home.html * Update home.html
1 parent 7511a07 commit f1763c9

File tree

1 file changed

+101
-69
lines changed

1 file changed

+101
-69
lines changed

‎home.html

Lines changed: 101 additions & 69 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,9 @@
77
<!--Style Sheets-->
88
<link rel="stylesheet" href="home.css">
99
<link rel="stylesheet" href="navbar.css">
10+
<link rel="stylesheet" href="form.css">
11+
<link rel="script" href="formScript.js">
12+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.3.1/dist/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
1013
<link rel="stylesheet"
1114
href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200" />
1215
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css"
@@ -22,7 +25,7 @@
2225
<!-- AOS.js -->
2326
<link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">
2427
<!--SEO Optimization-->
25-
28+
2629
<title>CSEdge Internship</title>
2730
<meta name="description"
2831
content="Learn about CSEdge Internship programs and how we're dedicated to helping students and professionals gain real-world experience in software development, coding, and more. Discover our AICTE-accredited programs and how we stand out in the industry.">
@@ -47,8 +50,8 @@
4750
<body>
4851
<button id="goTopBtn" title="Go to top"><i class="uil uil-arrow-up"></i></button>
4952
<!--Navigation Bar-->
50-
<nav class="fixed-top">
51-
53+
<nav class="fixed-top">
54+
5255
<h1 id="home">CSEdge</h1>
5356
<img style="outline: none;" src="./Images/Menu.svg" alt="Menu">
5457
<ul class="nav-item navbar">
@@ -68,14 +71,11 @@ <h1 id="home">CSEdge</h1>
6871
<span class="slider round"></span>
6972
</label>
7073
</nav>
71-
74+
7275
<!--Hero Section-->
73-
74-
7576
<section id="hero" class="hero">
7677
<div data-aos="fade-right"
7778
data-aos-duration="2000">
78-
7979
<h2>Unlock your<br> potential<br> with CSEdge </h2>
8080
<p>Where learning meets opportunity <br> in a month-long online internship<br>journey.</p>
8181
<a href="#internship" class="btn" data-aos="zoom-in">Apply Now</a>
@@ -86,9 +86,8 @@ <h2>Unlock your<br> potential<br> with CSEdge </h2>
8686
<section id="AboutUS">
8787
<h2 class="section-heading" data-aos="fade-up">ABOUT US</h2>
8888
<div class="about-content">
89-
<div>
90-
<p data-aos="fade-right"><span style="color: #22CFB9; font-weight: bold;"
91-
data-aos="fade-right">CSEdge</span> is an online internship platform that
89+
<div >
90+
<p data-aos="fade-right"><span style="color: #22CFB9; font-weight: bold;" data-aos="fade-right">CSEdge</span> is an online internship platform that
9291
provides students with the
9392
opportunity to gain practical experience in the field of software development. We offer a variety of
9493
internship programs that are designed to help students develop their skills and enhance their
@@ -98,12 +97,11 @@ <h2 class="section-heading" data-aos="fade-up">ABOUT US</h2>
9897
experience in the field of software development.</p> <br>
9998
<p data-aos="fade-right"><span style="color: #22CFB9; font-weight: bold;">MSME Registered</span>
10099
individuals on this journey of perpetual learning and boundless joy!</p> <br>
101-
102100
<p data-aos="fade-right"><span style="color: #22CFB9; font-weight: bold;">AICTE Approved</span> Our Internship Programs are
103101
endorsed By AICTE, ensuring
104102
top-notch quality and relevance.</p>
105-
106103
<button class="read-more-button" id="aboutpage" data-aos="fade-right">Read More</button>
104+
</div>
107105
<div class="about-image">
108106
<img src="./Images/AboutImage.png" style="scale: 1.5;" alt="About-US" data-aos="zoom-in">
109107
</div>
@@ -114,97 +112,70 @@ <h2 class="section-heading" data-aos="fade-up">ABOUT US</h2>
114112
<h2 class="section-heading" data-aos="fade-up">INTERNSHIPS</h2>
115113
<ul class="internship-program">
116114
<!--Python Internship-->
117-
118115
<li class="internships" data-aos="fade-up">
119-
120116
<img src="./Images/PythonLogo.png" alt="Python Internship" data-aos="zoom-in">
121-
<div style="transform: translateZ(20px)">
122-
<p class="program-title" data-aos="fade-up">Python Internship Program</p>
123-
<p class="program-duration" data-aos="fade-up">1 Month(online)</p>
124-
<p class="program-description" data-aos="fade-up">Join our Python Internship Program and gain
125-
practical experience in one
126-
of the most popular programming languages. Learn the fundamentals of Python, develop real-world
127-
projects, and enhance your coding skills. Get mentored by industry professionals and boost your
128-
career in the field of software development.</p>
129-
</div>
117+
<p class="program-title"data-aos="fade-up">Python Internship Program</p>
118+
<p class="program-duration"data-aos="fade-up">1 Month(online)</p>
119+
<p class="program-description"data-aos="fade-up">Join our Python Internship Program and gain practical experience in one
120+
of the most popular programming languages. Learn the fundamentals of Python, develop real-world
121+
projects, and enhance your coding skills. Get mentored by industry professionals and boost your
122+
career in the field of software development.</p>
130123
<div class="program-buttons">
131-
<button id="python" class="program-apply-button" data-aos="fade-up">Read More..!</button>
132-
<button id="python-form" class="program-apply-button" data-aos="fade-up">Apply Now</button>
124+
<button id="python" class="program-apply-button"data-aos="fade-up">Read More..!</button>
125+
<button id="python-form" class="program-apply-button"data-aos="fade-up">Apply Now</button>
133126
</div>
134127
</li>
135128
<!--Web Development Internship-->
136-
137129
<li class="internships" data-aos="fade-up">
138-
139130
<img src="./Images/HTMLLOGO.png" alt="Web Development Internship" data-aos="zoom-in">
140-
<div style="transform: translateZ(20px)">
141-
<p class="program-title" data-aos="fade-up">Web Development Internship Program</p>
142-
<p class="program-duration" data-aos="fade-up">1 Month(online)</p>
143-
<p class="program-description" data-aos="fade-up">Join our Web Development Internship Program and gain
144-
practical experience
131+
<p class="program-title"data-aos="fade-up">Web Development Internship Program</p>
132+
<p class="program-duration"data-aos="fade-up">1 Month(online)</p>
133+
<p class="program-description"data-aos="fade-up">Join our Web Development Internship Program and gain practical experience
145134
in one of the most popular programming languages. Learn the fundamentals of web development, develop
146135
real-world projects, and enhance your coding skills. Get mentored by industry professionals and
147136
boost your career in software development.</p>
148-
</div>
149137
<div class="program-buttons">
150-
<button id="webdev" class="program-apply-button" data-aos="fade-up">Read More..!</button>
151-
<button id="web-dev-form" class="program-apply-button" data-aos="fade-up">Apply Now</button>
138+
<button id="webdev" class="program-apply-button"data-aos="fade-up">Read More..!</button>
139+
<button id="web-dev-form" class="program-apply-button"data-aos="fade-up">Apply Now</button>
152140
</div>
153141
</li>
154142
<!--Java Internship-->
155-
156143
<li class="internships" data-aos="fade-up">
157-
158144
<img src="./Images/JavaLogo.png" alt="Java Internship" data-aos="zoom-in">
159-
<div style="transform: translateZ(20px)">
160-
<p class="program-title" data-aos="fade-up">Java Internship Program</p>
161-
<p class="program-duration" data-aos="fade-up">1 Month(online)</p>
162-
<p class="program-description" data-aos="fade-up">Join our Java Internship Program and gain practical
163-
experience in one of
145+
<p class="program-title"data-aos="fade-up">Java Internship Program</p>
146+
<p class="program-duration"data-aos="fade-up">1 Month(online)</p>
147+
<p class="program-description"data-aos="fade-up">Join our Java Internship Program and gain practical experience in one of
164148
the most popular programming languages. Learn Java fundamentals, develop real-world projects, and
165149
enhance your coding skills. Get mentored by industry professionals and boost your software
166150
development career.</p>
167-
</div>
168151
<div class="program-buttons">
169-
<button id="java" class="program-apply-button" data-aos="fade-up">Read More..!</button>
170-
<button id="java-form" class="program-apply-button" data-aos="fade-up">Apply Now</button>
152+
<button id="java" class="program-apply-button"data-aos="fade-up">Read More..!</button>
153+
<button id="java-form" class="program-apply-button"data-aos="fade-up">Apply Now</button>
171154
</div>
172155
</li>
173156
<!--UI Design Internship-->
174-
175-
<li data-aos="fade-up" data-tilt style="transform-style: preserve-3d; transform: perspective(1000px);">
176-
177157
<li class="internships" data-aos="fade-up">
178-
179158
<img src="./Images/UIUXLogo.png" alt="UI Design" data-aos="zoom-in">
180-
<div style="transform: translateZ(20px)">
181-
<p class="program-title" data-aos="fade-up">UI Design Internship Program</p>
182-
<p class="program-duration" data-aos="fade-up">1 Month(online)</p>
183-
<p class="program-description" data-aos="fade-up">Join our UI Design Internship Program and gain
184-
practical experience in
159+
<p class="program-title"data-aos="fade-up">UI Design Internship Program</p>
160+
<p class="program-duration"data-aos="fade-up">1 Month(online)</p>
161+
<p class="program-description"data-aos="fade-up">Join our UI Design Internship Program and gain practical experience in
185162
the field of user interface design. Learn the principles of UI design, develop interactive
186163
prototypes, and enhance your skills in creating visually appealing and user-friendly interfaces. Get
187164
mentored by industry professionals and kickstart your career in UI design.</p>
188-
</div>
189-
<div class="program-buttons" data-aos="fade-up">
165+
<div class="program-buttons"data-aos="fade-up">
190166
<button class="program-apply-button" data-aos="fade-up">Coming Soon..!</button>
191167
<!--<button class="program-apply-button">Coming Soon..!</button>-->
192168
</div>
193169
</li>
194170
<!--Data Science Internship-->
195-
196171
<li class="internships" data-aos="fade-up">
197-
198172
<img src="./Images/DatascienceLogo.png" alt="Data Science Internship" data-aos="zoom-in">
199-
<div style="transform: translateZ(20px)">
200173
<p class="program-title" data-aos="fade-up">Data Science Internship Program</p>
201174
<p class="program-duration" data-aos="fade-up">1 Month(online)</p>
202-
<p class="program-description" data-aos="fade-up">Join our Data Science Internship Program and gain
203-
practical experience in
175+
<p class="program-description" data-aos="fade-up">Join our Data Science Internship Program and gain practical experience in
204176
one of the most in-demand fields. Learn data analysis, machine learning, and statistical modeling.
205177
Develop real-world projects and enhance your skills in data science. Get mentored by industry
206178
professionals and kickstart your career in the field of data science.</p>
207-
</div>
208179
<div class="program-buttons" data-aos="fade-up">
209180
<button class="program-apply-button" data-aos="fade-up">Coming Soon..!</button>
210181
</div>
@@ -267,7 +238,7 @@ <h2 class="section-heading" data-aos="fade-up">Why CSEdge Internship?</h2>
267238
</table>
268239
</section>
269240
<!--Contact Section-->
270-
<section id="contact">
241+
<!-- <section id="contact">
271242
<h2 class="section-heading" data-aos="fade-up">Contact Us</h2>
272243
<p class="section-content" data-aos="fade-up">For more information or inquiries, please contact us:</p>
273244
<p class="section-content" data-aos="fade-up">Email: internship@csedge.courses</p>
@@ -283,7 +254,60 @@ <h2 class="section-heading" data-aos="fade-up">Contact Us</h2>
283254
style="color: #0085ff;"></i></a>
284255
<a href="https://youtube.com/@CSEdgeOfficial" target="_blank"><i class="fab fa-youtube fa-2x"
285256
style="color: #0085ff;"></i></a>
257+
</div>-->
258+
259+
<!--Form -->
260+
<section id="form" class="form">
261+
<div class="container">
262+
<div class="row">
263+
<div class="col-8">
264+
<form id="userinfo">
265+
<h3 class="FormHead"> Help Us Improve</h3>
266+
<div class="form-group">
267+
<label class="sr-only" for="email">Email:</label>
268+
<input type="email" class="form-control" id="email" placeholder="Enter email" name="email">
269+
</div>
270+
<div class="form-group">
271+
<label class="sr-only" for="name">Name</label>
272+
<input type="text" class="form-control" id="name" placeholder="Enter Name" name="name">
273+
</div>
274+
<div class="form-group">
275+
<label class="sr-only" for="comment">Comment</label>
276+
<input type="text" class="form-control" id="comment" placeholder="Comments" name="Comment" style="height: 50px">
277+
</div>
278+
<!-- Star Rating-->
279+
<div class="rating-box">
280+
<p class="experience">How was your experience?</p>
281+
<div class="rate">
282+
<input type="radio" id="star5" name="rate" value="5" />
283+
<label for="star5" title="text">5 stars</label>
284+
<input type="radio" id="star4" name="rate" value="4" />
285+
<label for="star4" title="text">4 stars</label>
286+
<input type="radio" id="star3" name="rate" value="3" />
287+
<label for="star3" title="text">3 stars</label>
288+
<input type="radio" id="star2" name="rate" value="2" />
289+
<label for="star2" title="text">2 stars</label>
290+
<input type="radio" id="star1" name="rate" value="1" />
291+
<label for="star1" title="text">1 star</label>
292+
</div>
293+
</div>
294+
<br>
295+
<br>
296+
<br>
297+
<!-- button-->
298+
<div class="btn-group">
299+
300+
301+
<input type="submit" class="btn btn-primary" value="Submit">
302+
</div>
303+
</form>
304+
</div>
305+
<div class="col-2">
306+
<img src="image/form.png" class="formImage" about="image">
307+
</div>
308+
</div>
286309
</div>
310+
287311
</section>
288312
<!--FAQ Section-->
289313
<section id="faq" class="faq">
@@ -454,10 +478,7 @@ <h4>Follow US</h4>
454478
</div>
455479
</div>
456480
</div>
457-
<p class="copyright">Copyright &copy;
458-
<script>document.write(new Date().getFullYear())</script> CSEdge.<br>All Rights Reserved Designed By Team
459-
CSEdge
460-
</p>
481+
<p class="copyright">Copyright &copy; <script>document.write(new Date().getFullYear())</script> CSEdge.<br>All Rights Reserved Designed By Team CSEdge</p>
461482
</footer>
462483

463484

@@ -637,7 +658,18 @@ <h4>Follow US</h4>
637658
duration: 1000
638659
});
639660
</script>
640-
<script src="vanilla-tilt.js"></script>
661+
<!-- Form-->
662+
<script>
663+
const form = document.querySelector("#userinfo");
664+
665+
form.addEventListener("submit", storeData);
666+
</script>
667+
668+
<!-- Optional JavaScript -->
669+
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
670+
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
671+
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.14.7/dist/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
672+
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.3.1/dist/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
641673
</body>
642674

643-
</html>
675+
</html>

0 commit comments

Comments
 (0)