-
Notifications
You must be signed in to change notification settings - Fork 0
/
Contact.html
146 lines (133 loc) · 6.24 KB
/
Contact.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>SumIT - Everything you need for IT</title>
<link rel="stylesheet" href="bootstrap-4.1.3-dist/css/bootstrap.min.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
<link rel="stylesheet" href="Contact.css">
</head>
<body>
<!--- Navigation Bar -->
<nav class="navbar navbar-expand-md navbar-dark bg-dark fixed-top">
<a class="navbar-brand" href="Home.html"><img src="img/Sumit.png"></a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#theNavbar">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="theNavbar">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="Home.html">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="Summaries.html">Summaries</a>
</li>
<li class="nav-item">
<a class="nav-link" href="Tutorials.html">Tutorials</a>
</li>
<li class="nav-item">
<a class="nav-link" href="Self-help.html">Self-help</a>
</li>
<li class="nav-item">
<a class="nav-link" href="Testimonials.html">Testimonials</a>
</li>
<li class="nav-item">
<a class="nav-link" href="Contact.html">Contact</a>
</li>
</ul>
</div>
</nav> <!--- End Navigation Bar -->
<div class="container"> <!-- Start Container -->
<div class="row"> <!-- Start Row -->
<div class="col-lg-7 col-md-6 col-sm-12 col-12"> <!-- Start Left Descriptions -->
<h1 id="Title">Contact Us</h1>
<p class="lead" id="Paragraph">
Want to save other IT newbs?
<br>
Have a lot of crazy ideas?
<br><br>
What are you waiting for?
<br>
Enter your details and contact us, <ins>right now</ins>
</p>
</div> <!-- End Left Descriptions -->
<div id="FormBackground" class="col-lg-5 col-md-6 col-sm-12 col-12"> <!-- Start Registration Form -->
<div class="row FormHeading"> <!-- Start Form Heading-->
<div class="col-md-10 col-sm-10 col-8">
<h1 id="FormTitle">This, is me!</h1>
</div>
<div class="col-md-2 col-sm-2 col-4">
<i class="fas fa-pencil-alt fa-2x" style="color: white; float: right"></i>
</div>
<hr>
</div> <!-- End Form Heading-->
<div class="row"> <!-- Start Email -->
<div class="col-lg-3 col-md-4 col-sm-3 col-4">
<label class="LeftLabels">Email</label>
</div>
<div class="col-lg-9 col-md-8 col-sm-9 col-8">
<input list="RMITemails" type="email" name="Email" class="UserInput" placeholder="Your E-mail">
<datalist id="RMITemails">
<option value="[email protected]">
<option value="[email protected]">
<option value="[email protected]">
<option value="[email protected]">
<option value="[email protected]">
</datalist>
</div>
</div> <!-- End Email-->
<div class="row"> <!-- Begin Ideas-->
<div class="col-lg-3 col-md-4 col-sm-3 col-4">
<label class="LeftLabels">Ideas</label>
</div>
<div class="col-lg-9 col-md-8 col-sm-9 col-8">
<textarea class="UserInput" name="ideas" cols="30" rows="3" placeholder="Your ideas"></textarea>
</div>
</div> <!-- End Ideas -->
<div class="row"> <!-- Start Details -->
<div class="col-lg-3 col-md-4 col-sm-3 col-4">
<label class="LeftLabels">Details</label>
</div>
<div class="col-lg-9 col-md-8 col-sm-9 col-8">
<input class="FileButton" type="file" name="Details">
</div>
</div> <!-- End Details-->
<div class="row"> <!-- Start Location -->
<div class="col-lg-3 col-md-4 col-sm-3 col-4">
<label class="LeftLabels">Location</label>
</div>
<div class="col-lg-9 col-md-8 col-sm-9 col-8">
<button onclick="getLocation()" id="LocateMe">Locate me</button>
<p id="Location"></p>
</div>
</div> <!-- End Location-->
<a href="#"><div class="btn btn-info">Send</div></a>
</div> <!-- End Registration Form -->
</div> <!-- End Row -->
</div> <!-- End Container -->
</body>
<!--- Script Source Files -->
<script src="js/jquery-3.3.1.min.js"></script>
<script src="bootstrap-4.1.3-dist/js/bootstrap.min.js"></script>
<script src="https://use.fontawesome.com/releases/v5.5.0/js/all.js"></script>
<script>
var x = document.getElementById("Location");
var y = document.getElementById('LocateMe');
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
x.innerHTML = "Geolocation is not supported by this browser.";
}
}
function showPosition(position) {
y.parentNode.removeChild(y);
x.innerHTML = "Latitude: " + position.coords.latitude +
"<br>Longitude: " + position.coords.longitude;
x.style.color = "white";
}
</script>
<!--- End of Script Source Files -->
</html>