prettier form errors oh my (bug 806419)

Author: potch

media/css/pay/pay.less

@@ -62,6 +62,9 @@ body {
 h2 {
     margin: 0;
     text-align: center;
+    &.error {
+      color: #800;
+    }
 }
 
 section.pay {

media/js/pin/pin.js

@@ -35,6 +35,7 @@
     }
 
     $(window).on('focus', '.pinbox input', function(e) {
+        this.value = '';
         watchInput(this);
     }).on('blur', '.pinbox input', function(e) {
         stopWatching();

webpay/pin/templates/pin/includes/verify_form.html

@@ -1,9 +1,11 @@
-<h2>{{ _('Enter payment PIN:') }}</h2>
+{% if form.pin.errors %}
+  <h2 class="error">{{ form.pin.errors[0] }}</h2>
+{% else %}
+  <h2>{{ _('Enter payment PIN:') }}</h2>
+{% endif %}
 <p>
   <form id="pin" action="{{ url('pin.verify') }}" method="post">
     {{ csrf() }}
-    {{ form.errors }}
-    {{ form.non_field_errors() }}
     <div class="pinbox">
       {{ form.pin }}
     </div>