Change actions in vote page

#420

css/colors.scss

@@ -27,5 +27,5 @@ $fg-yes: #49bc49;
 	@include icon-color('close','actions',$fg-no,1,true)
 }
 .icon-maybe {
-	@include icon-color('maybe-vote','polls',$fg-maybe)
+	@include icon-color('maybe-vote-variant','polls',$fg-maybe)
 }

css/vote.scss

@@ -103,7 +103,7 @@ $user-column-width: 265px;
 
 		.vote, .poll-cell {
 			flex-grow: 1;
-			width: 85px;
+			max-width: 85px;
 			margin: 2px;
 			align-items:center;
 		}
@@ -121,6 +121,7 @@ $user-column-width: 265px;
 	background-repeat: no-repeat;
 	background-size: 32px;
 	height: 44px;
+	display: flex;
 
 	&.yes {
 		background-color: $bg-yes;
@@ -153,13 +154,24 @@ $user-column-width: 265px;
 	}
 
 	&.active {
+
 		cursor: pointer;
-		border: 2px solid;
+		// border: 2px solid;
 		border-radius: var(--border-radius);
 		box-sizing: border-box;
+		width: 25px;
+		height: 25px;
+		background-size: 20px;
+		margin: auto !important;
+		background-color: var(--color-main-background);
+		color: var(--color-primary);
+		flex-grow: 0 !important;
+		&.icon-no {
+			background-image: initial;
+		}
 		&.unvoted {
-		background-color: $bg-maybe;
-		color: $fg-maybe;
+			background-color: $bg-maybe;
+			color: $fg-maybe;
 		}
 	}
 }
@@ -193,7 +205,11 @@ $user-column-width: 265px;
 
 
 .current-user {
-	background-color: var(--color-background-dark);
+	background-color: var(--color-primary-element-light);
+	.name {
+		color: var(--color-primary-text);
+		font-weight: bold;
+	}
 }
 
 #switchDetails {

img/maybe-vote-variant.svg

@@ -0,0 +1,79 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   id="svg4"
+   version="1.1"
+   width="16"
+   height="16"
+   sodipodi:docname="maybe-vote-variant.svg"
+   inkscape:version="0.92.2 (5c3e80d, 2017-08-06)">
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1920"
+     inkscape:window-height="1017"
+     id="namedview6"
+     showgrid="false"
+     inkscape:zoom="14.75"
+     inkscape:cx="8"
+     inkscape:cy="14.865201"
+     inkscape:window-x="-8"
+     inkscape:window-y="-8"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg4" />
+  <metadata
+     id="metadata10">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs8" />
+  <text
+     xml:space="preserve"
+     style="font-style:normal;font-weight:normal;font-size:14.98380184px;line-height:1.25;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#ffc107;fill-opacity:1;stroke:none;stroke-width:1.02162278;"
+     x="0.77818924"
+     y="12.577933"
+     id="text818"
+     transform="scale(1.0918594,0.91586886)"><tspan
+       sodipodi:role="line"
+       id="tspan816"
+       x="0.77818924"
+       y="12.577933"
+       style="font-size:12.25947285px;stroke-width:1.02162278;fill:#ffc107;fill-opacity:1;">(</tspan></text>
+  <path
+     inkscape:connector-curvature="0"
+     d="M 10.763664,5.3910095 7.1556639,8.8052614 5.0868428,6.86113 4.0524322,7.8311347 7.1556639,10.745958 11.811974,6.3733798 10.763664,5.3896356 Z"
+     id="path2-4"
+     style="fill:#ffc107;fill-opacity:1;stroke-width:0.70891041" />
+  <text
+     xml:space="preserve"
+     style="font-style:normal;font-weight:normal;font-size:40.86491394px;line-height:1.25;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#ffc107;fill-opacity:1;stroke:none;stroke-width:1.02162278;"
+     x="9.0928421"
+     y="12.577932"
+     id="text828"
+     transform="scale(1.0918594,0.91586885)"><tspan
+       sodipodi:role="line"
+       id="tspan826"
+       x="9.0928421"
+       y="12.577932"
+       style="font-size:12.2594738px;stroke-width:1.02162278;fill:#ffc107;fill-opacity:1;">)</tspan></text>
+</svg>

lib/Controller/PageController.php

@@ -240,7 +240,7 @@ class PageController extends Controller {
 			$notification = null;
 		}
 		if ($this->hasUserAccess($poll)) {
-			return new TemplateResponse('polls', 'goto.tmpl', [
+			return new TemplateResponse('polls', 'vote.tmpl', [
 				'poll' => $poll,
 				'options' => $options,
 				'comments' => $comments,

templates/vote.tmpl.php

@@ -270,7 +270,7 @@
 						print_unescaped('		<div class="toggle"></div>');
 						print_unescaped('	</div>');
 						print_unescaped('</div>');
-						print_unescaped('<ul class="flex-row">');
+						print_unescaped('<div class="flex-row">');
 
 						$i_tot = 0;
 						foreach ($options as $optionElement) {
@@ -293,11 +293,13 @@
 								$updatedPoll = true;
 							}
 
-							print_unescaped('<li id="voteid_' . $optionElement->getId() . '" class="flex-column active poll-cell ' . $class . '" data-value="' . $optionElement->getPollOptionText() . '" data-unvoted="' . $dataUnvoted . '"></li>');
+							print_unescaped('<div class="poll-cell">');
+							print_unescaped('    <div id="voteid_' . $optionElement->getId() . '" class="flex-column poll-cell active  ' . $class . '" data-value="' . $optionElement->getPollOptionText() . '" data-unvoted="' . $dataUnvoted . '"></div>');
+							print_unescaped('</div>');
 
 							$i_tot++;
 						}
-						print_unescaped('</ul>');
+						print_unescaped('</div>');
 						print_unescaped('</li>');
 					}
 					?>