From 5f9f2efee76b7bf5a9b2b7a28cbe4c41e4a8567c Mon Sep 17 00:00:00 2001
From: Wolvan <wolvan1@gmail.com>
Date: Wed, 29 Dec 2021 19:46:47 +0100
Subject: [PATCH] Continue refining frontend for poll creation

---
 frontend/html/index.html     | 19 ++++++++++++++++---
 frontend/static/css/main.css | 30 ++++++++++++++++++++++++++++++
 2 files changed, 46 insertions(+), 3 deletions(-)

diff --git a/frontend/html/index.html b/frontend/html/index.html
index 257ce95..a8463c5 100644
--- a/frontend/html/index.html
+++ b/frontend/html/index.html
@@ -18,9 +18,9 @@
         <section class="notepad">
             <div class="notepad-border"></div>
             <section class="poll-title">
-                <input type="text" maxlength="300" placeholder="Enter your question here">
+                <input id="poll-title" type="text" maxlength="300" placeholder="Enter your question here">
             </section>
-            <section class="poll-options">
+            <section id="poll-options" class="poll-options">
                 <div class="poll-option">
                     <input type="text" maxlength="300" placeholder="Enter your option here">
                 </div>
@@ -31,7 +31,20 @@
                     <input type="text" maxlength="300" placeholder="Enter your option here">
                 </div>
             </section>
-            <section class="poll-footer"></section>
+            <section class="poll-footer">
+                <select id="dupe-check">
+                    <option value="ip" selected>IP-based duplication checking</option>
+                    <option value="cookie">Cookie-based duplication checking</option>
+                    <option value="none">No duplication checking</option>
+                </select>
+                <br>
+                <label>
+                    <input type="checkbox" id="multiple">
+                    <span>Allow multiple answers to be selected</span>
+                </label>
+                <br>
+                <button id="create-poll">Create poll</button>
+            </section>
         </section>
     </main>
     <footer>
diff --git a/frontend/static/css/main.css b/frontend/static/css/main.css
index fd59b17..d8baba9 100644
--- a/frontend/static/css/main.css
+++ b/frontend/static/css/main.css
@@ -66,6 +66,9 @@ main .notepad .poll-option {
 }
 main .notepad .poll-footer {
     height: 180px;
+    padding: 10px;
+    padding-bottom: 0;
+    font-family: Arial, sans-serif;
 }
 main .notepad .poll-title,
 main .notepad .poll-option,
@@ -84,7 +87,34 @@ main .notepad-border {
     border-right: 2px solid red;
 }
 /* #endregion notepad */
+/* #region notepad-footer */
+main .notepad .poll-footer button {
+    padding: 0 30px;
+    height: 50px;
+    border-radius: 10px;
+    border: none;
+    background-color: #a8a8a8;
+    cursor: pointer;
+    font-size: 1.25em;
+    transition: background-color 0.2s;
+    color: #fff;
+    margin-right: 5px;
+}
+main .notepad .poll-footer button:hover {
+    background-color: #b6b6b6;
+}
 
+#create-poll {
+    background-color: #cf2828;
+}
+#create-poll:hover {
+    background-color: #e94747;
+}
+main .notepad .poll-footer input[type="checkbox"] {
+    margin: 10px 0;
+    margin-right: 5px;
+}
+/* #endregion notepad-footer */
 /* #endregion Main */
 /* #region Footer */
 footer {