-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathcontact.html
119 lines (102 loc) · 4.66 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
<html>
<head>
<title>Contact</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css">
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css">
</head>
<body>
<nav class="navbar navbar-expand-sm my-2">
<a class="navbar-brand ml-5" href="#">DoNation</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsibleNavbar">
</button>
<div class="collapse navbar-collapse" id="collapsibleNavbar">
<ul class="navbar-nav ml-auto">
<li class="nav-item active"><a class="nav-link" href="index.html">Home</a></li>
<li class="nav-item"><a class="nav-link" href="#">About Us</a></li>
<li class="nav-item"><a class="nav-link" href="contact.html">Contact Us</a></li>
</ul>
</div>
</nav>
<!-- ======= Contact Section ======= -->
<section id="contact" class="contact">
<div class="container" data-aos="fade-up">
<div class="section-header">
<h2>Contact</h2>
<p>Drop a message and we will get in touch with you soon !!!</p>
</div>
<div class="row gx-lg-0 gy-4">
<div class="col-lg-4">
<div class="info-container d-flex flex-column align-items-center justify-content-center">
<div class="info-item d-flex">
<i class="bi bi-geo-alt flex-shrink-0"></i>
<div>
<h4>Location:</h4>
<p>Anywhere , Everywhere</p>
</div>
</div><!-- End Info Item -->
<div class="info-item d-flex">
<i class="bi bi-envelope-fill flex-shrink-0"></i>
<div>
<h4>Email:</h4>
<p>[email protected]</p>
</div>
</div><!-- End Info Item -->
<div class="info-item d-flex">
<i class="bi bi-phone flex-shrink-0"></i>
<div>
<h4>Call:</h4>
<p>+91-123456789</p>
</div>
</div><!-- End Info Item -->
<div class="info-item d-flex">
<i class="bi bi-clock flex-shrink-0"></i>
<div>
<h4>Open Hours:</h4>
<p>Mon-Sat: 12:00AM - 11:59PM</p>
</div>
</div><!-- End Info Item -->
</div>
</div>
<div class="col-lg-8">
<form action="#" method="post" role="form" class="php-email-form">
<div class="row">
<div class="col-md-6 form-group">
<input type="text" name="name" class="form-control" id="name" placeholder="Your Name" required>
</div>
<div class="col-md-6 form-group mt-3 mt-md-0">
<input type="email" class="form-control" name="email" id="email" placeholder="Your Email" required>
</div>
</div>
<div class="form-group mt-3">
<input type="text" class="form-control" name="subject" id="subject" placeholder="Subject" required>
</div>
<div class="form-group mt-3">
<textarea class="form-control" name="message" rows="7" placeholder="Message" required></textarea>
</div>
<div class="my-3">
<div class="loading">Loading</div>
<div class="error-message"></div>
<div class="sent-message">Your message has been sent. Thank you!</div>
</div>
<div class="text-center"><button type="submit">Send Message</button></div>
</form>
</div><!-- End Contact Form -->
</div>
</div>
</section><!-- End Contact Section -->
<script >
$('.js-tilt').tilt({
scale: 1.1
})
</script>
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<!-- Popper JS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script>
<script src="https://kit.fontawesome.com/c252d9c8b4.js" crossorigin="anonymous"></script>
<script src="js/main.js"></script>
</body>
</html>