generated from Code-Institute-Org/gitpod-full-template
-
Notifications
You must be signed in to change notification settings - Fork 1
/
contact.html
87 lines (74 loc) · 3.67 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 name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Meta tags for search engines -->
<meta name="description"
content="Test your knowledge of the Indian Sign Language (ISL) alphabet in this fun and interactive quiz game. Can you correctly identify the signs for English alphabets? Challenge yourself and learn more about ISL!">
<meta name="keywords" content="Indian Sign Language, ISL, ISL alphabet, quiz, interactive game">
<!-- Title of the website -->
<title>Indian Sign Language Alphabet Quiz</title>
<!-- Favicon -->
<link rel="apple-touch-icon" sizes="180x180" href="assets/favicon/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="assets/favicon/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="assets/favicon/favicon-16x16.png">
<link rel="manifest" href="assets/favicon/site.webmanifest">
<!-- Stylesheet -->
<link rel="stylesheet" href="assets/css/style.css">
</head>
<body>
<!-- Header -->
<header>
<h1>Guess ISL alphabet!</h1>
</header>
<main>
<!-- Contact container -->
<div class="box-container">
<div class="contact">
<section id="contact-us">
<!-- Contact form -->
<form id="contact-form">
<div class="contact-head">
<h2>Report a Bug <i class="fa-solid fa-bug"></i></h2>
<a id="close-button" href="index.html"><i class="fa-solid fa-x"></i></a>
</div>
<div id="contact-align">
<label for="first_name" class="lblcolor">First Name:</label>
<input type="text" name="first_name" id="first_name" class="text-input" required>
<br>
<label for="last_name" class="lblcolor">Last Name:</label>
<input type="text" name="last_name" id="last_name" class="text-input" required>
<br>
<label for="email_address" class="lblcolor">Email Address:</label>
<input type="email" name="email_address" id="email_address" class="text-input" required>
<br>
<label for="message" class="lblcolor">Your message:</label>
<br>
<textarea name="message" id="message" class="text-input" placeholder="Write your message"
required></textarea>
</div>
<div class="submit-button">
<button type="submit" id="submit-msg-button"
aria-label="Submit your contact form to the site owner"><i
class="fa-solid fa-paper-plane"></i>
Submit!</button>
</div>
</form>
</section>
</div>
</div>
<!-- Thank you message container appears once the form is submitted as this is done by JS event handler -->
<div class="thanks-container"></div>
</main>
<!-- Footer -->
<footer>
<!-- Copyright -->
<p>© Guess ISL Alphabet</p>
</footer>
<!-- Link to JavaScript contact form file -->
<script src="assets/js/contactForm.js"></script>
<!-- FontAwesome kit -->
<script src="https://kit.fontawesome.com/be0d508cf4.js" crossorigin="anonymous"></script>
</body>
</html>