Skip to content

Commit 5ca9a85

Browse files
Merge pull request #857 from Giftzzz/patch-2
Create cancel.html
2 parents afd42b7 + 96c2b08 commit 5ca9a85

File tree

1 file changed

+102
-0
lines changed

1 file changed

+102
-0
lines changed

cancel.html

Lines changed: 102 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,102 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>Feedback Form</title>
7+
<style>
8+
body {
9+
font-family: Arial, sans-serif;
10+
margin: 0;
11+
padding: 0;
12+
display: flex;
13+
justify-content: center;
14+
align-items: center;
15+
height: 100vh;
16+
background-color: #f0f0f0;
17+
}
18+
19+
.feedback-form {
20+
background-color: white;
21+
padding: 20px;
22+
border-radius: 8px;
23+
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
24+
max-width: 400px;
25+
width: 100%;
26+
}
27+
28+
.feedback-form h2 {
29+
margin-bottom: 15px;
30+
font-size: 24px;
31+
}
32+
33+
.feedback-form label {
34+
font-size: 16px;
35+
margin-bottom: 5px;
36+
display: block;
37+
}
38+
39+
.feedback-form input,
40+
.feedback-form textarea {
41+
width: 100%;
42+
padding: 10px;
43+
margin-bottom: 10px;
44+
border: 1px solid #ccc;
45+
border-radius: 4px;
46+
}
47+
48+
.feedback-form textarea {
49+
resize: vertical;
50+
}
51+
52+
.feedback-form button {
53+
padding: 10px 15px;
54+
border: none;
55+
border-radius: 4px;
56+
cursor: pointer;
57+
}
58+
59+
.submit-btn {
60+
background-color: #4CAF50;
61+
color: white;
62+
margin-right: 10px;
63+
}
64+
65+
.cancel-btn {
66+
background-color: #f44336;
67+
color: white;
68+
}
69+
70+
.feedback-form button:hover {
71+
opacity: 0.9;
72+
}
73+
</style>
74+
</head>
75+
<body>
76+
77+
<form class="feedback-form" id="feedback-form">
78+
<h2>Feedback Form</h2>
79+
<label for="name">Name:</label>
80+
<input type="text" id="name" name="name" placeholder="Your name..." required>
81+
82+
<label for="email">Email:</label>
83+
<input type="email" id="email" name="email" placeholder="Your email..." required>
84+
85+
<label for="message">Message:</label>
86+
<textarea id="message" name="message" rows="4" placeholder="Your message..." required></textarea>
87+
88+
<button type="submit" class="submit-btn">Submit</button>
89+
<button type="button" class="cancel-btn" id="cancel-btn">Cancel</button>
90+
</form>
91+
92+
<script>
93+
const cancelButton = document.getElementById('cancel-btn');
94+
const form = document.getElementById('feedback-form');
95+
96+
cancelButton.addEventListener('click', () => {
97+
form.reset(); // Clears all form fields
98+
});
99+
</script>
100+
101+
</body>
102+
</html>

0 commit comments

Comments
 (0)