From 5536c1fe50b67540d0865f1cc4b43f064b9575d7 Mon Sep 17 00:00:00 2001
From: CchristiNana <139203070+CchristiNana@users.noreply.github.com>
Date: Sun, 28 Apr 2024 16:32:52 +1000
Subject: [PATCH] feedback form creation

---
 public/feedbackform.html                   | 92 ++++++++++++++++++++++
 public/submitsuccess.html                  | 46 +++++++++++
 src/content/docs/feedback/feedback form.md |  4 +-
 3 files changed, 140 insertions(+), 2 deletions(-)
 create mode 100644 public/feedbackform.html
 create mode 100644 public/submitsuccess.html
diff --git a/public/feedbackform.html b/public/feedbackform.html
new file mode 100644
index 00000000..78c8f287
--- /dev/null
+++ b/public/feedbackform.html
@@ -0,0 +1,92 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<title>Feedback Form</title>
+<style>
+    body {
+        font-family: Arial, sans-serif;
+        background: #f4f4f4;
+        margin: 0;
+        padding: 0;
+    }
+    .container {
+        max-width: 600px;
+        margin: 50px auto;
+        background: #fff;
+        padding: 20px;
+    }
+    h1, p {
+        text-align: center;
+    }
+    .star-rating {
+        text-align: center;
+        font-size: 0;
+    }
+    .star-rating input {
+        display: none;
+    }
+    .star-rating label {
+        font-size: 40px;
+        padding: 10px;
+        color: #d3d3d3;
+    }
+    .star-rating input:checked ~ label {
+        color: #ffd700;
+    }
+    .feedback-form {
+        text-align: center;
+    }
+    .feedback-form input[type="text"],
+    .feedback-form input[type="email"],
+    .feedback-form textarea {
+        width: 90%;
+        padding: 10px;
+        margin: 10px 0;
+        border: 1px solid #ddd;
+        border-radius: 5px;
+    }
+    .feedback-form input[type="submit"] {
+        background-color: #5f27cd;
+        color: white;
+        padding: 10px 20px;
+        border: none;
+        border-radius: 5px;
+        cursor: pointer;
+        font-size: 16px;
+    }
+    .feedback-form input[type="submit"]:hover {
+        background-color: #341f97;
+    }
+</style>
+</head>
+<body>
+<div class="container">
+    <h1>Feedback Page</h1>
+    <p>We would love your feedback</p>
+    <p>Our goal is to make a platform that simplifies your workday. You’ve been using Thoth Tech Documentation Website for a while now, and we’d love to know what you think about it. We really appreciate your feedback!</p>
+    
+    <div class="star-rating">
+        <input type="radio" id="star5" name="rating" value="5" /><label for="star5">★</label>
+        <input type="radio" id="star4" name="rating" value="4" /><label for="star4">★</label>
+        <input type="radio" id="star3" name="rating" value="3" /><label for="star3">★</label>
+        <input type="radio" id="star2" name="rating" value="2" /><label for="star2">★</label>
+        <input type="radio" id="star1" name="rating" value="1" /><label for="star1">★</label>
+    </div>
+
+    <form class="feedback-form" action="/submitsuccess.html" method="post">
+        <input type="text" name="name" placeholder="Name" required>
+        <input type="email" name="email" placeholder="Email" required>
+        <div>
+            <input type="radio" id="suggestion" name="feedback_type" value="suggestion" checked>
+            <label for="suggestion">Suggestion</label>
+            <input type="radio" id="improvement" name="feedback_type" value="improvement">
+            <label for="improvement">Improvement Idea</label>
+        </div>
+        <textarea name="comment" placeholder="Add your feedback" rows="4" required></textarea>
+        <input type="submit" value="SUBMIT">
+    </form>
+</div>
+</body>
+</html>
diff --git a/public/submitsuccess.html b/public/submitsuccess.html
new file mode 100644
index 00000000..90e069c5
--- /dev/null
+++ b/public/submitsuccess.html
@@ -0,0 +1,46 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<title>Feedback Submitted</title>
+<style>
+    body {
+        font-family: Arial, sans-serif;
+        background: #f4f4f4;
+        margin: 0;
+        padding: 0;
+    }
+    .container {
+        max-width: 600px;
+        margin: 50px auto;
+        background: #fff;
+        padding: 20px;
+    }
+    h1, p {
+        text-align: center;
+    }
+    .feedback-message {
+        background-color: #ffc0cb; /* Light pink background */
+        color: #333;
+        padding: 20px;
+        margin: 30px 0;
+        border-radius: 8px;
+        text-align: center;
+    }
+</style>
+</head>
+<body>
+<div class="container">
+    <h1>Feedback Submitted</h1>
+    <p>We would love your feedback</p>
+    <p>Our goal is to make a platform that simplifies your workday. You’ve been using Thoth Tech Documentation Website for a while now, and we’d love to know what you think about it. We really appreciate your feedback!</p>
+    
+    <div class="feedback-message">
+        <h2>Thanks for sharing your feedback with us</h2>
+        <p>Your feedback has been submitted successfully.</p>
+        <p>Your input is valuable to us and will help us improve our services.</p>
+    </div>
+</div>
+</body>
+</html>
diff --git a/src/content/docs/feedback/feedback form.md b/src/content/docs/feedback/feedback form.md
index a62c1f45..08311432 100644
--- a/src/content/docs/feedback/feedback form.md	
+++ b/src/content/docs/feedback/feedback form.md	
@@ -14,8 +14,8 @@ You have several options for sending us your feedback. Please choose the one tha
 
 ##### Option 1: Fill Out Our Online Form
 
-Please fill out our detailed feedback form available at [Our Feedback Form](link). It only takes a
-few minutes!
+Please fill out our detailed feedback form available at [Our Feedback Form](/feedbackform.html). It
+only take a few minutes!
 
 ##### Option 2: Contact your team leader or senior students
 
