-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathcontact.html
87 lines (86 loc) · 4.54 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Match the Cards</title>
<!-- Bootstrap CDN -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-eOJMYsd53ii+scO/bJGFsiCZc+5NDVN2yr8+0RDqr0Ql0h+rP48ckxlpbzKgwra6" crossorigin="anonymous">
<link rel="stylesheet" href="assets/css/style.css">
<!-- Email JS-->
<script src="https://cdn.jsdelivr.net/npm/emailjs-com@3/dist/email.min.js"></script>
<!-- Favicon icon -->
<link rel="shortcut icon" href="assets/images/favicon.ico" type="image/x-icon">
<link rel="icon" href="assets/images/favicon.ico" type="image/x-icon">
<!-- Fontawesome CDN -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css" integrity="sha512-iBBXm8fW90+nuLcSKlbmrPcLa0OT92xO1BIsZ+ywDWZCvqsWgccV3gFoRBv0z+8dLJgyAHIhR35VZc2oM/gI1w==" crossorigin="anonymous" />
<link rel="stylesheet" href="assets/css/style.css">
</head>
<body>
<!-- Header section. JavaScript used to indicate to users location on website -->
<header id="introduction-header" class="mb-5">
<nav id="nav">
<div class="container-fluid text-center">
<h1 class="mt-2">MATCH THE FRUITS</h1>
<h2 class="mt-3 mb-3">CARD MEMORY GAME</h2>
<ul>
<li>
<a href="index.html">Home</a>
</li>
<li>
<a href="contact.html">Contact</a>
</li>
</ul>
</div>
</nav>
</header>
<main>
<h1 class="text-center my-5">Get in touch</h1>
<p class="text-center">We'd love to hear your feedback about the game. Let us know what you enjoyed or didn't enjoy and we'll factor your feedback into our next round of game development for future releases.</p>
<div class="container">
<form id="contact-form" onsubmit="return validateForm()" name="contactForm" novalidate>
<div id="name-error" class="text-center"></div>
<input type="text" id="fromName" class="my-5 form-elem" placeholder="Your name">
<div id="email-error" class="text-center"></div>
<input type="email" id="email" class="my-5 form-elem" placeholder="Your email address">
<div id="msg-error" class="text-center"></div>
<textarea id="message" class="my-5 form-elem" placeholder="Your message"></textarea>
<button type="submit" class="my-5 form-elem" id='message-button'>Send message</button>
</form>
</div>
</main>
<footer class="text-center footer">
<ul>
<!-- Credit for accessibility measures in social media icons: Mário Gusman -->
<!-- Credit for social media icons: Font awesome -->
<li>
<a href="https://www.instagram.com/" target="_blank" rel="noopener">
<i aria-hidden="true" class="fab fa-instagram"></i>
<span class="sr-only">Instagram</span>
</a>
</li>
<li>
<a href="https://www.facebook.com/" target="_blank" rel="noopener">
<i aria-hidden="true" class="fab fa-facebook"></i>
<span class="sr-only">Facebook</span>
</a>
</li>
<li>
<a href="https://twitter.com/" target="_blank" rel="noopener">
<i aria-hidden="true" class="fab fa-twitter"></i>
<span class="sr-only">Twitter</span>
</a>
</li>
<li>
<a href="https://www.youtube.com/" target="_blank" rel="noopener">
<i aria-hidden="true" class="fab fa-youtube"></i>
<span class="sr-only">YouTube</span>
</a>
</li>
</ul>
</footer>
<script src="assets/js/main.js"></script>
<script src="assets/js/email.js"></script>
</body>
</html>