social icons, form connection

This commit is contained in:
2022-07-22 13:10:54 +00:00
parent b8681bb110
commit 98bc8a92b5
6 changed files with 47 additions and 42 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 1007 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 560 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 752 B

View File

@@ -73,7 +73,7 @@
</nav> </nav>
<!-----------------------------------------------> <!----------------------------------------------->
<!-- WELCOME --> <!-- WELCOME -->
<section data-jarallax data-speed=".8" class="height" style="background-image: url(assets/img/Lp-banner-img.png);padding-top: 3rem;padding-bottom: 2rem;"> <section data-jarallax data-speed=".8" class="height mb-10 mb-md-0" style="background-image: url(assets/img/Lp-banner-img.png);padding-top: 3rem;padding-bottom: 2rem;">
<div class="container"> <div class="container">
<div class="row align-items-center"> <div class="row align-items-center">
<div class="col-12 col-md-6 pb-sm-0"> <div class="col-12 col-md-6 pb-sm-0">
@@ -85,22 +85,22 @@
with a sub title with a sub title
</h1> </h1>
<div class='col-12 col-md-11 col-lg-9 pb-md-10'> <div class='col-12 col-md-11 col-lg-9 pb-md-10'>
<div class="shadow-light-lg mb-6 form mx-2 mx-md-0 mt-13 mt-md-0 linear"> <div class="shadow-light-lg mb-6 form mx-2 mx-md-0 mt-12 mt-md-0 linear">
<div style='padding:14px 30px 6px 30px'> <div style='padding:14px 30px 6px 30px;'>
<h1 class='sub display-sm-5 display-md-3 d-block d-md-none'><span class="display-sm-5 display-md-2 header">Two line header</span><br/> <h1 class='sub display-sm-5 display-md-3 d-block d-md-none'><span class="display-sm-5 display-md-2 header">Two line header</span><br/>with a sub title </h1>
with a sub title
</h1>
<p style='color:#273B7B' class="ptext"><span style='font-weight:700'>Sign Up for Free Career</span> Counseling</p> <p style='color:#273B7B' class="ptext"><span style='font-weight:700'>Sign Up for Free Career</span> Counseling</p>
<div class="alert alert-danger" id="warning" style="display: none;">Fill all the fields!</div>
<div class="alert alert-success" id="success" style="display: none;">Thanks for sharing your information our counselor will get in touch with you soon</div> <div class="alert-danger" id="warning" style="margin-top:-12px;margin-bottom:4px;display: none;">Fill all the fields!</div>
<div class="alert-success" id="success" style="margin-top:-12px;margin-bottom:4px;display: none;">Thanks for information</div>
<!-- Form --> <!-- Form -->
<form class="" role="form" method="post"> <form role="form" method="post">
<div class="form-group mb-3"> <div class="form-group mb-3">
<!-- Input --> <!-- Input -->
<input type="text" aria-required="true" name="widget-contact-form-name" style='width:100%;background-color:#dfe2ea;border:none;border-radius:3px' required <input type="text" aria-required="true" name="widget-contact-form-name" style='width:100%;background-color:#dfe2ea;border:none;border-radius:3px' required
class="required name" id="name1" placeholder="&nbsp;&nbsp;&nbsp;Name"> class="required name" id="name1" placeholder="&nbsp;&nbsp;&nbsp;Name">
</div> </div>
<div class="form-group mb-3"> <!-- <input type="text"> -->
<div class="form-group mb-3" >
<!-- Input --> <!-- Input -->
<input id="phn" type="number" name="telephone" placeholder="&nbsp;&nbsp;&nbsp;Phone" style='width:100%;background-color:#dfe2ea;border:none;border-radius:3px' required> <input id="phn" type="number" name="telephone" placeholder="&nbsp;&nbsp;&nbsp;Phone" style='width:100%;background-color:#dfe2ea;border:none;border-radius:3px' required>
<p id="phnError" style="color: red; display: none;">Enter a valid phone number</p> <p id="phnError" style="color: red; display: none;">Enter a valid phone number</p>
@@ -124,7 +124,7 @@ with a sub title
</div> <!-- / .container --> </div> <!-- / .container -->
</section> </section>
<!----------------------------------------------> <!---------------------------------------------->
<div style='background-color:#273B7B;border-radius:0px 0px 20px 20px' class='mx-0 mx-lg-13 mt-10 mt-md-0'> <div style='background-color:#273B7B;border-radius:0px 0px 20px 20px' class='mx-0 mx-lg-13'>
<div class="container pt-14 pt-md-10 pb-8 pl-4 pr-4 pl-md-2 pr-md-2 pl-lg-8 pr-lg-8"> <div class="container pt-14 pt-md-10 pb-8 pl-4 pr-4 pl-md-2 pr-md-2 pl-lg-8 pr-lg-8">
<div class="row align-items-center"> <div class="row align-items-center">
<div class="col-12 col-md-7 pb-sm-0 text-white"> <div class="col-12 col-md-7 pb-sm-0 text-white">
@@ -171,17 +171,17 @@ professional guidance.</div>
<div class="col-12 col-md-6 pl-sm-0 pr-sm-0 pl-md-2 pr-md-2 pl-lg-10 pr-lg-8"> <div class="col-12 col-md-6 pl-sm-0 pr-sm-0 pl-md-2 pr-md-2 pl-lg-10 pr-lg-8">
<div style='background-color:#273B7B;border-radius:20px;' class="pt-5 pb-8"> <div style='background-color:#273B7B;border-radius:20px;' class="pt-5 pb-8">
<h3><div class='text-white text-center'>Graduate Diploma in<br> Montessori Teacher Training</div></h3> <h3><div class='text-white text-center'>Graduate Diploma in<br> Montessori Teacher Training</div></h3>
<div style="display:flex;justify-content:space-between" class='pl-2 pr-2 pl-md-3 pr-md-3 pl-lg-7 pr-lg-7 pb-4'> <div style="display:flex;justify-content:space-between" class='pl-2 pr-2 pl-md-3 pr-md-3 pl-lg-7 pr-lg-7 pb-4 py-lg-3'>
<div style="display:flex"> <div style="display:flex">
<div><img src='./assets/img/bag-icon.png' style="width:25px"></div> <div><img src='./assets/img/bag-icon.png' style="width:25px"></div>
<div class="text-white p">&nbsp;6 months - 1 Year</div> <div class="text-white p">&nbsp;6 months - 1 Year</div>
</div> </div>
<div style="display:flex"> <div style="display:flex">
<div><img src='./assets/img/certificate-icon.png' style="width:25px"></div> <div style="border-left:1px solid #FA6B05"><img src='./assets/img/certificate-icon.png' style="width:25px"></div>
<div class="text-white p">&nbsp;Online Program</div> <div class="text-white p">&nbsp;Online Program</div>
</div> </div>
</div> </div>
<div class="pl-5"> <div class="pl-5 pl-lg-7">
<div style='display:flex' class="pb-2 p"><div style="height:20px; width:20px;background-color:#FA6B05;margin-top:3px;border-radius:10px;margin-right:10px"></div><div class="text-white">Weekday in-class program</div></div> <div style='display:flex' class="pb-2 p"><div style="height:20px; width:20px;background-color:#FA6B05;margin-top:3px;border-radius:10px;margin-right:10px"></div><div class="text-white">Weekday in-class program</div></div>
<div style='display:flex' class="pb-2 p"><div style="height:20px; width:20px;background-color:#FA6B05;margin-top:3px;border-radius:10px;margin-right:10px"></div><div class="text-white">Weekend in-class program</div></div> <div style='display:flex' class="pb-2 p"><div style="height:20px; width:20px;background-color:#FA6B05;margin-top:3px;border-radius:10px;margin-right:10px"></div><div class="text-white">Weekend in-class program</div></div>
<div style='display:flex' class="pb-2 p"><div style="height:20px; width:20px;background-color:#FA6B05;margin-top:3px;border-radius:10px;margin-right:10px"></div><div class="text-white">Certification</div></div> <div style='display:flex' class="pb-2 p"><div style="height:20px; width:20px;background-color:#FA6B05;margin-top:3px;border-radius:10px;margin-right:10px"></div><div class="text-white">Certification</div></div>
@@ -193,17 +193,17 @@ professional guidance.</div>
<div class="col-12 col-md-6 pl-sm-0 pr-sm-0 pl-md-2 pr-md-2 pl-lg-10 pr-lg-8 pt-6 pt-md-0"> <div class="col-12 col-md-6 pl-sm-0 pr-sm-0 pl-md-2 pr-md-2 pl-lg-10 pr-lg-8 pt-6 pt-md-0">
<div style='background-color:#273B7B;border-radius:20px;' class="pt-5 pb-8"> <div style='background-color:#273B7B;border-radius:20px;' class="pt-5 pb-8">
<h3><div class='text-white text-center'>Post Graduate Diploma in<br> Montessori Teacher Training</div></h3> <h3><div class='text-white text-center'>Post Graduate Diploma in<br> Montessori Teacher Training</div></h3>
<div style="display:flex;justify-content:space-between" class='pl-2 pr-2 pl-md-3 pr-md-3 pl-lg-7 pr-lg-7 pb-4'> <div style="display:flex;justify-content:space-between" class='pl-2 pr-2 pl-md-3 pr-md-3 pl-lg-7 pr-lg-7 pb-4 py-lg-3'>
<div style="display:flex"> <div style="display:flex">
<div><img src='./assets/img/bag-icon.png' style="width:25px"></div> <div><img src='./assets/img/bag-icon.png' style="width:25px"></div>
<div class="text-white p">&nbsp;6 months - 1 Year</div> <div class="text-white p">&nbsp;6 months - 1 Year</div>
</div> </div>
<div style="display:flex"> <div style="display:flex">
<div><img src='./assets/img/certificate-icon.png' style="width:25px"></div> <div style="border-left:1px solid #FA6B05"><img src='./assets/img/certificate-icon.png' style="width:25px"></div>
<div class="text-white p">&nbsp;Online Program</div> <div class="text-white p">&nbsp;Online Program</div>
</div> </div>
</div> </div>
<div class="pl-5"> <div class="pl-5 pl-lg-7">
<div style='display:flex' class="pb-2 p"><div style="height:20px; width:20px;background-color:#FA6B05;margin-top:3px;border-radius:10px;margin-right:10px"></div><div class="text-white">Weekday in-class program</div></div> <div style='display:flex' class="pb-2 p"><div style="height:20px; width:20px;background-color:#FA6B05;margin-top:3px;border-radius:10px;margin-right:10px"></div><div class="text-white">Weekday in-class program</div></div>
<div style='display:flex' class="pb-2 p"><div style="height:20px; width:20px;background-color:#FA6B05;margin-top:3px;border-radius:10px;margin-right:10px"></div><div class="text-white">Weekend in-class program</div></div> <div style='display:flex' class="pb-2 p"><div style="height:20px; width:20px;background-color:#FA6B05;margin-top:3px;border-radius:10px;margin-right:10px"></div><div class="text-white">Weekend in-class program</div></div>
<div style='display:flex' class="pb-2 p"><div style="height:20px; width:20px;background-color:#FA6B05;margin-top:3px;border-radius:10px;margin-right:10px"></div><div class="text-white">Certification</div></div> <div style='display:flex' class="pb-2 p"><div style="height:20px; width:20px;background-color:#FA6B05;margin-top:3px;border-radius:10px;margin-right:10px"></div><div class="text-white">Certification</div></div>
@@ -322,36 +322,41 @@ professional guidance.</div>
</div> </div>
<!------------------------------------------------------------> <!------------------------------------------------------------>
<div style="background-image: linear-gradient(#1b2a4e, black);margin: 0;padding: 0;"> <div style="background-color:#273B7B;margin: 0;padding: 0;">
<div class="row"> <div class="row">
<div class="col-12 col-md-4" style="color:#A5A5A5;margin: 0;text-align: center;padding-bottom: 10px;padding-top: 10px;font-size:14px;"> © 2020 IIMTT. All Rights Reserved.</div> <!-- <div class="col-12 col-md-4" style="color:#A5A5A5;margin: 0;text-align: center;padding-bottom: 10px;padding-top: 10px;font-size:14px;"> © 2020 IIMTT. All Rights Reserved.</div> -->
<div class="col-12 col-md-4" style="color:#A5A5A5;margin: 0;text-align: center;justify-content:center;padding-bottom: 10px;padding-top: 10px;font-size:14px;"> <div class="col-12 col-md-12" style="color:#A5A5A5;margin: 0;text-align: center;justify-content:center;padding-bottom: 10px;padding-top: 10px;font-size:14px;">
<ul class="list-unstyled list-inline list-social mb-6 mb-md-0"> <ul class="list-unstyled list-inline list-social mb-6 mb-md-0">
<li class="list-inline-item list-social-item mr-3"> <li class="list-inline-item list-social-item mr-2 ml-2 mr-lg-8 ml-lg-0">
<a href="https://www.instagram.com/iimtt.corporate/" class="text-decoration-none" target="_blank"> <a href="https://www.instagram.com/iimtt.corporate/" class="text-decoration-none" target="_blank">
<img src="./assets/img/icons/social/instagram.svg" class="list-social-icon" alt="..."> <img src="./assets/img/Vector11.png" class="list-social-icon" alt="...">
</a> </a>
</li> </li>
<li class="list-inline-item list-social-item mr-3"> <li class="list-inline-item list-social-item mr-2 ml-2 mr-lg-8 ml-lg-8">
<a href="https://www.facebook.com/IIMTT/" class="text-decoration-none" target="_blank"> <a href="https://www.facebook.com/IIMTT/" class="text-decoration-none" target="_blank">
<img src="./assets/img/icons/social/facebook.svg" class="list-social-icon" alt="..."> <img src="./assets/img/Vector12.png" class="list-social-icon" alt="...">
</a> </a>
</li> </li>
<li class="list-inline-item list-social-item mr-3"> <li class="list-inline-item list-social-item mr-2 ml-2 mr-lg-8 ml-lg-8">
<a href="https://twitter.com/iimtt_corporate" class="text-decoration-none" target="_blank"> <a href="https://twitter.com/iimtt_corporate" class="text-decoration-none" target="_blank">
<img src="./assets/img/icons/social/twitter.svg" class="list-social-icon" alt="..."> <img src="./assets/img/Vector13.png" class="list-social-icon" alt="...">
</a> </a>
</li> </li>
<li class="list-inline-item list-social-item mr-3"> <li class="list-inline-item list-social-item mr-2 ml-2 mr-lg-8 ml-lg-8">
<a href="https://www.linkedin.com/showcase/international-institute-of-montessori-teacher-training/" class="text-decoration-none" target="_blank"> <a href="https://www.linkedin.com/showcase/international-institute-of-montessori-teacher-training/" class="text-decoration-none" target="_blank">
<img src="/assets/img/icons/social/linkedin.svg" class="list-social-icon" alt="logo"> <img src="./assets/img/Vector14.png" class="list-social-icon" alt="logo">
</a>
</li>
<li class="list-inline-item list-social-item mr-2 ml-2 mr-lg-0 ml-lg-8">
<a href="https://www.linkedin.com/showcase/international-institute-of-montessori-teacher-training/" class="text-decoration-none" target="_blank">
<img src="./assets/img/Vector15.png" class="list-social-icon" style="width:200px" alt="logo">
</a> </a>
</li> </li>
</ul> </ul>
</div> </div>
<div class="col-12 col-md-4" style="color:#A5A5A5;margin: 0;text-align: center;justify-content:center;padding-bottom: 10px;padding-top: 10px;font-size:14px;"><div class="f1"> <!-- <div class="col-12 col-md-4" style="color:#A5A5A5;margin: 0;text-align: center;justify-content:center;padding-bottom: 10px;padding-top: 10px;font-size:14px;"><div class="f1">
<a href="#" class="new1 btn btn-xs right bt ttop">Register Now</a> <a href="#" class="new1 btn btn-xs right bt ttop">Register Now</a>
</div></div> </div></div> -->
</div> </div>
</div> </div>
</section> </section>
@@ -382,7 +387,7 @@ professional guidance.</div>
var warning = document.getElementById('warning'); var warning = document.getElementById('warning');
var success = document.getElementById('success'); var success = document.getElementById('success');
var emailError = document.getElementById('emailError'); var emailError = document.getElementById('emailError');
var req = document.getElementById("req"); // var req = document.getElementById("req");
function setOptions(s) { function setOptions(s) {
// console.log(s[s.selectedIndex].value); // get value // console.log(s[s.selectedIndex].value); // get value
option = s[s.selectedIndex].value; option = s[s.selectedIndex].value;
@@ -391,12 +396,12 @@ professional guidance.</div>
function submitForm() { function submitForm() {
name = document.getElementById("name1").value; name = document.getElementById("name1").value;
phn = document.getElementById("phn").value; phn = document.getElementById("phn").value;
addr = document.getElementById("addr").value; // addr = document.getElementById("addr").value;
email = document.getElementById("email").value; email = document.getElementById("email").value;
success.style.display = "none"; success.style.display = "none";
subject = req.options[req.selectedIndex].value; // subject = req.options[req.selectedIndex].value;
// console.log(name+phn+addr+email+subject); // console.log(name+phn+addr+email+subject);
if (name == '' || addr == '' || phn == '' || email == '' || subject == '') { if (name == '' || phn == '' || email == '') {
warning.style.display = "block"; warning.style.display = "block";
} else { } else {
var reg = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/; var reg = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
@@ -415,9 +420,9 @@ professional guidance.</div>
formData.append('Name', name); formData.append('Name', name);
formData.append('Email', email); formData.append('Email', email);
formData.append('Phone', phn); formData.append('Phone', phn);
formData.append('Field', subject); // formData.append('Field', subject);
formData.append('Address', addr); // formData.append('Address', addr);
formData.append('MessageDetails', addr + " Field:" + subject); // formData.append('MessageDetails', addr + " Field:" + subject);
fetch('https://api.teenybeans.in/API/contactFormProcessor/v1/', { fetch('https://api.teenybeans.in/API/contactFormProcessor/v1/', {
method: 'POST', method: 'POST',
body: formData body: formData
@@ -433,7 +438,7 @@ professional guidance.</div>
success.style.display = "block"; success.style.display = "block";
document.getElementById("name1").value = ""; document.getElementById("name1").value = "";
document.getElementById("phn").value = ""; document.getElementById("phn").value = "";
document.getElementById("addr").value = ""; // document.getElementById("addr").value = "";
document.getElementById("email").value = ""; document.getElementById("email").value = "";
// document.getElementById("message").value = ""; // document.getElementById("message").value = "";
@@ -464,10 +469,10 @@ professional guidance.</div>
email + email +
"</td></tr><tr><th>Phone:- </th><td>:- " + "</td></tr><tr><th>Phone:- </th><td>:- " +
phn + phn +
"</td></tr><tr><th>Address:- </th><td>:- " + // "</td></tr><tr><th>Address:- </th><td>:- " +
addr + // addr +
"</td></tr><tr><th>Service:- </th><td>:- " + // "</td></tr><tr><th>Service:- </th><td>:- " +
subject + // subject +
// "</td></tr><tr><th>Message:- </th><td>:- " + // "</td></tr><tr><th>Message:- </th><td>:- " +
// message + // message +
"</td></tr></table></body></html>" "</td></tr></table></body></html>"