nicer buttons, lighter text, clearer submission

benadida · Jan 15, 2022 · ab322e5 · ab322e5
1 parent 849564f
commit ab322e5
Show file tree

Hide file tree

Showing 6 changed files with 19 additions and 13 deletions.
diff --git a/helios/templates/_castconfirm_password.html b/helios/templates/_castconfirm_password.html
@@ -1,4 +1,3 @@
-Please provide the voter ID and password you received by email.<br /><br />
 <form method="post" action="{% url "election@password-voter-login" election.uuid %}" onsubmit="show_waiting()">
 <input type="hidden" name="csrf_token" value="{{csrf_token}}" />
 <input type="hidden" name="return_url" value="{{return_url}}" />
@@ -12,10 +11,10 @@
 </p>
 {% endif %}
 {% if cast_ballot == "1" %}
+<input type="submit" class="button" value="authenticate &amp; cast ballot" />
 <p class="small">
-You may cast as many ballots as you wish:<br />only the last one counts.
+Cast as many ballots as you wish: only the last one counts.
 </p>
-<input type="submit" class="button" value="cast ballot" />
 {% else %}
 <input type="submit" class="button" value="log in" />
 {% endif %}

diff --git a/helios/templates/election_cast_confirm.html b/helios/templates/election_cast_confirm.html
@@ -92,7 +92,7 @@ <h1>Sorry!<h1>
 {% endif %}
 <br />
 Your ballot tracker is:<br /><br />
-    <tt style="font-size:1.3em; font-weight: bold; padding-left: 20px;">  {{vote_fingerprint}}</tt>
+    <tt style="font-weight: bold;">  {{vote_fingerprint}}</tt>
 </p>
 {# this closes the IF ELSE of this being password_only #}
 {% endif %}

diff --git a/heliosbooth/css/forms.css b/heliosbooth/css/forms.css
@@ -18,12 +18,19 @@ form.prettyform br {
     clear: left;
 }
 
-form.prettyform input, form.prettyform textarea, button {
+form.prettyform input, form.prettyform textarea {
     border: 1px solid black;
     margin: 5px;
     font-size: 16pt;
 }
 
+button {
+    background: lightblue;
+    margin: 5px;
+    padding: 5px 20px 5px 20px;
+    font-size: 18pt;
+}
+
 input.pretty {
     font-size: 16pt;
     border: 1px solid black;

diff --git a/heliosbooth/templates/audit.html b/heliosbooth/templates/audit.html
@@ -25,9 +25,9 @@ <h3>Your audited ballot</h3>
 <br /><br />
 <b>Even if you post your audited ballot, you must go back to voting and choose "cast" if you want your vote to count.</b>
 <br /><br />
-<input type="button" value="back to voting" onclick="BOOTH.reset_ciphertexts();BOOTH.seal_ballot();" class="pretty" />
+<button onclick="BOOTH.reset_ciphertexts();BOOTH.seal_ballot(); return false;" class="pretty">back to voting</button>
 &nbsp; &nbsp;&nbsp;
-<input type="button" value="post audited ballot to tracking center" onclick="$(this).attr('disabled', 'disabled');BOOTH.post_audited_ballot();" id="post_audited_ballot_button" class="pretty" style="font-size:0.8em;"/>
+<button onclick="$(this).attr('disabled', 'disabled');BOOTH.post_audited_ballot(); return false;" id="post_audited_ballot_button" class="pretty" style="font-size:0.8em;">post audited ballot to tracking center</button>
 
 </form>
 

diff --git a/heliosbooth/templates/question.html b/heliosbooth/templates/question.html
@@ -47,17 +47,17 @@
 
 {#if $T.show_reviewall}
 <div style="float: right;">
-<input type="button" onclick="BOOTH.validate_and_confirm({$T.question_num});" value="Proceed" />
+<button onclick="BOOTH.validate_and_confirm({$T.question_num});">Proceed</button>
 </div>
 {#/if}
 
 {#if $T.question_num != 0}
-<input type="button" onclick="BOOTH.previous({$T.question_num})" value="Previous" />
+<button onclick="BOOTH.previous({$T.question_num});">Previous</button>
 &nbsp;
 {#/if}
 
 {#if $T.question_num < $T.last_question_num}
-<input type="button" onclick="BOOTH.next({$T.question_num})" value="Next" />
+<button onclick="BOOTH.next({$T.question_num});">Next</button>
 &nbsp;
 {#/if}
 

diff --git a/heliosbooth/templates/seal.html b/heliosbooth/templates/seal.html
@@ -11,9 +11,9 @@ <h3>Review your Ballot</h3>
 <div style="margin-left: 15px;">&#x2713; {$T.choice}</div>
 {#/for}
 {#if $T.choices[$T.question$index].length < $T.question.max}
-[you selected {$T.choices[$T.question$index].length} candidates; you may select from {$T.question.min} to {$T.question.max}]
+[{$T.choices[$T.question$index].length} selections out of possible {$T.question.min}-{$T.question.max}]<br />
 {#/if}
-[<a onclick="BOOTH.show_question({$T.question$index}); return false;" href="#">edit responses</a>]
+[<a onclick="BOOTH.show_question({$T.question$index}); return false;" href="#">change</a>]
 {#if !$T.question$last}<br><br>{#/if}
 {#/for}
 </div>
@@ -44,7 +44,7 @@ <h4 style="padding: 0px; margin:0px;"><a onclick="$('#auditbody').slideToggle(25
 <p>
 You will then be guided to re-encrypt your choices for final casting.
 </p>
-<input type="button" value="Spoil &amp; Audit" onclick="BOOTH.audit_ballot();" class="pretty" />
+<button onclick="BOOTH.audit_ballot();" class="pretty">Spoil &amp; Audit</button>
 </p>
 </div>
 </div>