Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Added Contact Us Page #35

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
159 changes: 159 additions & 0 deletions public/css/cp.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,159 @@
body{
background-image: url(../img/bg6.jpg);
color: black;
background-repeat: no-repeat;
background-size: cover;
color: white;
background-position: fixed;
background-attachment: fixed;
}

.but{
/*float: left;*/
margin-right: 20%;
margin-bottom: 2%;
background-color: rgb(255,255,,255);
color: black;
}

h1{
/*color: rgb(229, 229, 204);*/
color: rgb(246, 246, 239);
font-weight: bold;
text-transform: uppercase;
text-shadow: 2px 2px 4px #000000;
letter-spacing: 0.1em;
}


h3{
color: white;
/*color: rgb(246, 246, 239);*/
font-weight: bold;
text-transform: uppercase;
letter-spacing: 0.1em;
text-shadow: 2px 2px 4px #000000;
}


hr{
width: 40%;
border-top: 1px solid #f8f8f8;
border-bottom:1px solid rgba(0,0,0,.2);
}

.content{
/*color: rgb(246, 246, 239);*/
text-shadow: 2px 2px 4px #000000;
text-align: center;
}

.social{
width: 30%;
padding-bottom: 3%;
}

a{
display: inline-block;
margin: 5%;
font-size: 2.5rem;
color: white;
transition: transform .2s;
}

a:hover{
color: red;
font-size: 4rem;
margin: 0;
-webkit-transform: scale(1.2);
}

.wrap{
width: 30%;
float: left;
margin: 1.66%;
text-align: center;
background-color: rgba(0,0,0,0.3);
color: white;
/*color: rgb(246, 246, 239);*/
border-radius: 20px;
font-size: 1.3rem;
}

.wrap:hover{
background-color: rgba(0,0,0,0.7);
-webkit-transform: scale(1.2);
}


#conOne{
width: 45%;
/* padding-left: 50px;
padding-right: 50px; */
background-color: rgba(0,0,0,0.3);
/* margin: 5%; */
margin-top: 2%;
margin-bottom: 2%;
border-radius: 20px;
}

#conTwo{
width: 45%;
/* padding-left: 50px;
padding-right: 50px; */
float: right;
background-color: rgba(0,0,0,0.3);
/* float: left; */
/* margin: 5%; */
border-radius: 20px;
margin-top: 2%;
margin-bottom: 2%;
margin-bottom: 5%;
}

#formButton1 {
display: block;
margin-right: auto;
margin-left: auto;
}

#formButton2 {
display: block;
margin-right: auto;
margin-left: auto;
}
/*
#box{
display: flex;
} */

@media only screen and (max-width: 800px) {
#conOne{
margin: auto;
width: 75%;

}

#conTwo{
margin: auto;
width: 75%;
float: none;

}
body {
/*background-color: lightblue;*/
font-size: 12px;
}
}

#form1{
display: none;
}

#form2{
display: none;
}




Binary file added public/img/bg6.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
24 changes: 24 additions & 0 deletions public/js/pg.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@

function mybutton1() {
var x = document.getElementById("form1");
if (x.style.display === "none") {
x.style.display = "block";

} else {
x.style.display = "none";
}
}

function mybutton2() {
var x = document.getElementById("form2");
var b=document.getElementById("formButton2");
if (x.style.display === "none") {
x.style.display = "block";
b.color="red";
} else {
x.style.display = "none";
}
}



138 changes: 138 additions & 0 deletions views/cp.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,138 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>Contact Us</title>
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">

<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

<link rel="stylesheet" type="text/css" href="../public/css/cp.css">

<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Montserrat&display=swap" rel="stylesheet">


</head>
<body>
<div class="container">
<div class="row">

<div class="content">
<h1>Reach Out To Us</h1>
<p>Hope it has been a <em><b>smooth learning experience</b></em> for you at <em><b>One Stop Help</b></em>. We would love to hear your feedback, if in any case you have any queries we would love to help you.</p>
</div>


<div id="box" class="row">


<div id="conOne" class="col-sm-6 ">
<button class="btn btn-default btn-lg" type="button" onclick="mybutton1()" id="formButton1">Leave your feedback here !</button>

<form id="form1" action="mailto:[email protected]" method="post" enctype="text/plain">
<center>
<h2>Give Your Valuable Feedback </h2>
</center>
<div class="form-group">
<label for="exampleFormControlInput1">Name</label>
<input type="text" class="form-control" id="exampleFormControlInput1" placeholder="Your Name" required="">
</div>
<div class="form-group">
<label for="exampleFormControlInput1">Email Address</label>
<input type="email" class="form-control" id="exampleFormControlInput1" placeholder="[email protected]" required="">
</div>
<div class="form-group">
<label for="exampleFormControlSelect1">Overall Experience</label>
<select class="form-control" id="exampleFormControlSelect1" required="">
<option value="" disabled selected hidden >How was your experience with us?</option>
<option>Poor</option>
<option>Bad</option>
<option>Average</option>
<option>Good</option>
<option>Outstanding</option>
</select>
</div>
<div class="form-group">
<label for="exampleFormControlTextarea1">Your Review</label>
<textarea class="form-control" id="exampleFormControlTextarea1" rows="3" placeholder="Is there anything you would like to tell us? " required=""></textarea>
</div>
<input class="but btn btn-success btn-sm" type="submit" value="Send">
<input class="but btn btn-warning btn-sm" type="reset" value="Reset">
</form>
</div>



<div id="conTwo" class="col-sm-6 ">

<button type="button" class="btn btn-default btn-lg" onclick="mybutton2()" id="formButton2">Have a question? Drop here !</button>
<form id="form2" action="mailto:[email protected]" method="post" enctype="text/plain">
<center>
<h2>Tell Us About Your Query</h2>
</center>
<div class="form-group">
<label for="exampleFormControlInput1">Name</label>
<input type="text" class="form-control" id="exampleFormControlInput1" placeholder="Your Name" required="">
</div>
<div class="form-group">
<label for="exampleFormControlInput1">Email Address</label>
<input type="email" class="form-control" id="exampleFormControlInput1" placeholder="[email protected]" required="">
</div>
<div class="form-group">
<label for="exampleFormControlInput1">Contact Number</label>
<input type="text" class="form-control" id="exampleFormControlInput1" placeholder="Your Number" required="">
</div>

<div class="form-group">
<label for="exampleFormControlTextarea1">Your Query</label>
<textarea class="form-control" id="exampleFormControlTextarea1" rows="3" placeholder="Write detailed description of query, we will get back to you at the earliest!" required=""></textarea>
</div>
<input class="but btn btn-success btn-sm" type="submit" value="Send">
<input class="but btn btn-warning btn-sm" type="reset" value="Reset">

</form>
</div>


</div>
<hr>
<br>
<div class="wrap ">
<h3 class="fa fa-map-marker" style="font-size:20px"> Address</h3>
<p>Indira Gandhi Delhi Technical University fow Women</p>
</div>
<div class=" wrap ">
<h3 class="fa fa-phone" style="font-size:20px"> Phone</h3>
<p>+91 87009-11111 , +91 87009-22222 </p>
</div>
<div class="wrap ">
<h3 class="fa fa-envelope" style="font-size:20px"> Email</h3>
<p> [email protected]</p>
</div>


<center>
<div class="social">
<div class="buttons">
<a href="#" class="fb" title="Join us on Facebook"><i class="fa fa-facebook" ></i></a>
<a href="#" class="tw" title="Join us on Twitter"><i class="fa fa-twitter" aria-hidden="true"></i></a>
<a href="https://www.instagram.com/dsc_igdtuw/" class="insta" title="Join us on Instagram"><i class="fa fa-instagram" aria-hidden="true"></i></a>
<a href="https://www.linkedin.com/company/dscigdtuw/mycompany/" class="in" title="Join us on Linked In"><i class="fa fa-linkedin" aria-hidden="true"></i></a>
<a href="https://github.com/dscigdtuw/Indulge" class="in" title="Join us on GitHub"><i class="fa fa-github" aria-hidden="true"></i></a>
</div>
</div>
</center>

</div>
<script type="text/javascript" src="../public/js/pg.js"></script>
</div>
</body>
</html>