From 4953f1e68560dd4ecf5013c16e3df36366188d58 Mon Sep 17 00:00:00 2001
From: bitscuit <thomas@bitscuit.be>
Date: Sat, 13 Mar 2021 19:23:18 +0100
Subject: [PATCH] Changed layout of voting screen and made input wider

---
 html/css/extra.css |  1 +
 html/index.html    | 23 ++++++++++++++---------
 2 files changed, 15 insertions(+), 9 deletions(-)

diff --git a/html/css/extra.css b/html/css/extra.css
index 7a1f838..baf550b 100644
--- a/html/css/extra.css
+++ b/html/css/extra.css
@@ -26,3 +26,4 @@ tr.clickable:hover{
 .story h5{
 	margin: 0px;
 }
+
diff --git a/html/index.html b/html/index.html
index 6f267d0..8b86528 100644
--- a/html/index.html
+++ b/html/index.html
@@ -139,7 +139,7 @@ socket.on("WRITE", function(data){
 	page += "</div>";
 
 	page += "<p>Enter the "+(data.lineNr == 1 ? "first" : "next")+" line.</p>";
-	page += "<input type='text' placeholder='The "+(data.lineNr == 1 ? "First" : "Next")+" Line' id='input_write' /><br/>";
+	page += "<input type='text' placeholder='The "+(data.lineNr == 1 ? "First" : "Next")+" Line' id='input_write' style='width: 100%; max-width: 500px;'/><br/>";
 	page += "<p id='text_write_error' style='display: none; color: #BB2266; '></p>";
 	page += "<button id='button_ok' class='button button-primary' onclick='button_write()'><i class='fas fa-check'></i>&nbsp;&nbsp;&nbsp;Submit</button>";
 
@@ -188,17 +188,22 @@ socket.on("PICK", function(data){
 
 	page += "<div id='pick_buttons'>";
 	page += "<p>Select the line you prefer.</p>";
-	for(y=0; y<data.submissions.length/3+1; y++){
+	for(y=0; y<data.submissions.length; y++){
 		page += "<div class='row'>";
-		for(x=0; x<Math.min(3, data.submissions.length-y*3); x++){
-			page += "<div class='four columns'>";
+		page += "<div class='ten columns'>";
 
-			page += "<button class='button button-primary u-full-width' onclick='button_pick("+(y*3+x)+")'>";
-			page += data.submissions[y*3+x];
-			page += "</button>";
+		page += "<h5 style='text-align: left;'>";
+		page += data.submissions[y];
+		page += "</h5>";
 
-			page += "</div>";
-		}
+		page += "</div>";
+		page += "<div class='two columns'>";
+
+		page += "<button class='button button-primary u-full-width' onclick='button_pick("+(y)+")'>";
+		page += "<i class='fas fa-check'></i>";
+		page += "</button>";
+
+		page += "</div>";
 		page += "</div>";
 	}
 	page += "</div>";