Register UI improvements:

* Success and failed feedback

apps/kassa/templates/kassa/register.html

@@ -1,16 +1,20 @@
 {% extends "base.html" %}
 {% load i18n bootstrap %}
 {% block content %}
-<div class="row">
-    <div class="col-xs-12">
-        <h2>{% trans "Register membership card" %}</h2>
-    </div>
-</div>
 <div class="row">
     <div class="col-sm-5">
         <form class="register-card-form" autocomplete="off">
             {% csrf_token %}
             <h3>{% trans "Register card" %}</h3>
+            <ul>
+                <li>Register card to existing user [DONE]</li>
+                <li>Replace card for existing user [DONE]</li>
+            </ul>
+            <ul>
+                <li>Renew membership for existing user</li>
+                <li>Register membership for existing user</li>
+                <li>Register membership for new user</li>
+            </ul>
             <div class="register-card-form--selected-user-wrap">
                 <!-- Placeholder -->
                 <div class="list-group-item search-result placeholder">
@@ -23,7 +27,8 @@
             </div>
             {{ add_card_form|bootstrap }}
             <p><em>Registering a card number with a phone number already tied to an existing user, will add the card to that user.</em></p>
-            <button id="register-submit-btn" type="submit" class="btn btn-primary btn-lg">{% trans "Register" %}</button>
+            <button id="register-submit-btn" type="submit" class="btn btn-primary btn-lg">{% trans "Register card" %}</button>
+            <button type="reset" class="register-reset-btn btn btn-default">{% trans "Reset" %}</button>
         </form>
     </div>
     <div class="col-sm-7">

static/app/scripts/app.js

@@ -20,35 +20,36 @@ function getParameterByName(name) {
         results = regex.exec(location.search);
     return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
 }
-function update_with_card_details(results) {
+function update_user_with_card_details(user) {
     /* Cards with a number lower than this is legacy as of 2015-08 */
     var legacy_card_limit = 100000000;
-
-    for(var i=0; i<results.length; i++) {
-        var res = results[i];
-        if(res.cards === '') {
-            continue;
-        }
-
-        for(var j=0; j<res.cards.length; j++) {
-            if(parseInt(res.cards[j].card_number, 10) < legacy_card_limit) {
-                res.cards[j].is_legacy = "1";
-            }
-            if(res.cards[j].is_active == "1") {
-                res.card_number_active = res.cards[j].card_number;
-            }
-        }
+    if(user.cards === '') {
+        return user;
     }
 
-    return results;
+    for(var j=0; j<user.cards.length; j++) {
+        if(parseInt(user.cards[j].card_number, 10) < legacy_card_limit) {
+            user.cards[j].is_legacy = "1";
+        }
+        if(user.cards[j].is_active == "1") {
+            user.card_number_active = user.cards[j].card_number;
+        }
+    }
+    return user;
 }
 function format_results(results) {
-    return nunjucks.render('search_results.html', {'results': update_with_card_details(results)});
+    results = _.map(results, update_user_with_card_details);
+    return nunjucks.render('search_results.html', {'results': results});
 }
 function render_selected_user(user_data) {
-    user_data = update_with_card_details(user_data);
-    user_data.checked = true;
-    var selected_user_html = nunjucks.render('search_result.html', user_data);
+    var context;
+    if(user_data === undefined) {
+        context = {placeholder: true};  // dummy card
+    } else {
+        user_data = update_user_with_card_details(user_data);
+        context = {res: user_data, checked: true};
+    }
+    var selected_user_html = nunjucks.render('search_result.html', context);
     _dom.selectedUserWrap.html(selected_user_html);
 }
 function set_toast(message) {
@@ -116,6 +117,18 @@ function set_field_state(field_element, state, help_text) {
         form_group.find('.help-block').remove();
     }
 }
+function resetCardForm(reset_native) {
+    if(reset_native) {
+        _dom.registerCardForm.get(0).reset();
+    }
+    /* Clear field states */
+    set_field_state(_dom.phoneNumberField, '');
+    cardForm.fields.phoneNumber = false;
+    set_field_state(_dom.cardNumberField, '');
+    cardForm.fields.cardNumber = false;
+    selectedUser = null;
+    _dom.userIdField.val('').trigger('change');
+}
 
 function cardFormIsValid() {
     return _.all(_.values(cardForm.fields));
@@ -123,10 +136,10 @@ function cardFormIsValid() {
 
 function update_submit_button() {
     if( cardFormIsValid() ) {
-        _dom.registerButton.prop('disabled', false);
+        _dom.registerSubmitButton.prop('disabled', false);
         return;
     }
-    _dom.registerButton.prop('disabled', true);
+    _dom.registerSubmitButton.prop('disabled', true);
 }
 function validatePhoneNumber(val) {
     if(val.length === 0) {
@@ -189,11 +202,12 @@ $(document).ready(function(){
         phoneNumberField: $('#id_phone_number'),
         cardNumberField: $('#id_card_number'),
         registerCardForm: $('.register-card-form'),
-        registerButton: $('#register-submit-btn'),
+        registerSubmitButton: $('#register-submit-btn'),
         usernameField: $('#id_username'),
         userIdField: $('#id_user_id'),
         selectedUserWrap: $('.register-card-form--selected-user-wrap'),
-        toastWrap: $('.toast-wrap')
+        toastWrap: $('.toast-wrap'),
+        registerResetButton: $('.register-reset-btn')
     };
     var urls = {
         insideUserApi: '/inside/user/',
@@ -303,7 +317,7 @@ $(document).ready(function(){
         _dom.phoneNumberField.val(number).trigger('input');
     });
 
-    _dom.registerButton.on('click', function(e) {
+    _dom.registerSubmitButton.on('click', function(e) {
         e.preventDefault();
         // TODO on error output validation status
         // TODO on success:
@@ -331,6 +345,7 @@ $(document).ready(function(){
         }).success(function(data){
             console.log("success", data);
             set_toast('Success :-)');
+            resetCardForm(true);
 
         }).fail(function(data) {
             console.log("failed", data);
@@ -342,16 +357,19 @@ $(document).ready(function(){
     _dom.userIdField.on('change', function() {
         /* Render selected user in search form */
         if(selectedUser) {
-            render_selected_user({res: selectedUser});
+            render_selected_user(selectedUser);
             return;
         }
-        render_selected_user({placeholder: true});
+        render_selected_user();
+    });
+    _dom.registerResetButton.on('click', function() {
+        console.log('reset!');
+        resetCardForm();
     });
 
     /* Ninja add some icons to bootstrap form */
-    var inputGroup = '<div class="input-group">';
     var iconMobile = '<span class="input-group-addon"><span class="glyphicon glyphicon-phone"></span></span>';
-    _dom.phoneNumberField.wrap(inputGroup);
+    _dom.phoneNumberField.parent().addClass('input-group');
     _dom.phoneNumberField.before(iconMobile);
 
     /* Initial focus */
@@ -362,7 +380,7 @@ $(document).ready(function(){
         _dom.phoneNumberField.focus();
     }
     /* Initial submit button state disabled */
-    _dom.registerButton.attr('disabled','disabled');
+    _dom.registerSubmitButton.attr('disabled','disabled');
 
     /* Load query params */
     /* FIXME: does not trigger validation and selected user preview */

static/app/styles/app.scss

@@ -1,4 +1,5 @@
 $icon-font-path: '../fonts/';
+$green: #5cb85c;
 
 /* Vendor styles */
 @import "../../bower_components/bootstrap-sass/assets/stylesheets/_bootstrap.scss";
@@ -26,6 +27,12 @@ input[type=number] {
   text-align: right;
   margin-top: 10px;
 }
+.query-form input {
+    height: 46px;
+    padding: 10px 16px;
+    font-size: 18px;
+    line-height: 1.3333333;
+}
 .register-card-form {
 
   input[type=tel],
@@ -68,6 +75,9 @@ input[type=number] {
     border: 1px solid #555;
     color: #555;
   }
+  .label-card-yes {
+    color: $green;
+  }
   .label-is-active {
     background-color: darkred;
   }
@@ -91,7 +101,7 @@ input[type=number] {
   bottom: 48px;
   position: relative;
   font-size: 1.5em;
-  color: #5cb85c;
+  color: $green;
 }
 
 /* Footer */

static/app/templates/search_result.html

@@ -7,7 +7,7 @@
         <div class="list-group-item search-result has-card{% if res.is_member %} member{% else %}not-member{% endif %}">
     {% endif %}
     <!-- Name -->
-    {{ res.firstname }} {{ res.lastname }}
+    <span class="glyphicon glyphicon-user"></span> {{ res.firstname }} {{ res.lastname }}
     <div class="labels">
         <!-- Membership -->
         {% if res.is_member == "1" %}
@@ -18,10 +18,10 @@
             <span class="label label-warning">Expired: {{ res.expires }}</span>
         {% endif %}
         <!-- Card -->
-        {% if not res.card_is_legacy %}
-            <span class="label label-card "><span class="glyphicon glyphicon-user"></span> {{ res.card_number_active|default('No card') }}</span>
+        {% if res.card_number_active and res.card_is_legacy != '' %}
+            <span class="label label-card label-card-yes"><span class="glyphicon glyphicon-ok"></span> {{ res.card_number_active }}</span>
         {% else %}
-            <span class="label label-card "><span class="glyphicon glyphicon-user"></span> No card</span>
+            <span class="label label-card label-card-no"><span class="glyphicon glyphicon-remove"></span> No card</span>
         {% endif %}
         <!-- Is active -->
         {% if res.is_active == "1" %}

static/dist/scripts/app.js

@@ -20,35 +20,36 @@ function getParameterByName(name) {
         results = regex.exec(location.search);
     return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
 }
-function update_with_card_details(results) {
+function update_user_with_card_details(user) {
     /* Cards with a number lower than this is legacy as of 2015-08 */
     var legacy_card_limit = 100000000;
-
-    for(var i=0; i<results.length; i++) {
-        var res = results[i];
-        if(res.cards === '') {
-            continue;
-        }
-
-        for(var j=0; j<res.cards.length; j++) {
-            if(parseInt(res.cards[j].card_number, 10) < legacy_card_limit) {
-                res.cards[j].is_legacy = "1";
-            }
-            if(res.cards[j].is_active == "1") {
-                res.card_number_active = res.cards[j].card_number;
-            }
-        }
+    if(user.cards === '') {
+        return user;
     }
 
-    return results;
+    for(var j=0; j<user.cards.length; j++) {
+        if(parseInt(user.cards[j].card_number, 10) < legacy_card_limit) {
+            user.cards[j].is_legacy = "1";
+        }
+        if(user.cards[j].is_active == "1") {
+            user.card_number_active = user.cards[j].card_number;
+        }
+    }
+    return user;
 }
 function format_results(results) {
-    return nunjucks.render('search_results.html', {'results': update_with_card_details(results)});
+    results = _.map(results, update_user_with_card_details);
+    return nunjucks.render('search_results.html', {'results': results});
 }
 function render_selected_user(user_data) {
-    user_data = update_with_card_details(user_data);
-    user_data.checked = true;
-    var selected_user_html = nunjucks.render('search_result.html', user_data);
+    var context;
+    if(user_data === undefined) {
+        context = {placeholder: true};  // dummy card
+    } else {
+        user_data = update_user_with_card_details(user_data);
+        context = {res: user_data, checked: true};
+    }
+    var selected_user_html = nunjucks.render('search_result.html', context);
     _dom.selectedUserWrap.html(selected_user_html);
 }
 function set_toast(message) {
@@ -116,6 +117,18 @@ function set_field_state(field_element, state, help_text) {
         form_group.find('.help-block').remove();
     }
 }
+function resetCardForm(reset_native) {
+    if(reset_native) {
+        _dom.registerCardForm.get(0).reset();
+    }
+    /* Clear field states */
+    set_field_state(_dom.phoneNumberField, '');
+    cardForm.fields.phoneNumber = false;
+    set_field_state(_dom.cardNumberField, '');
+    cardForm.fields.cardNumber = false;
+    selectedUser = null;
+    _dom.userIdField.val('').trigger('change');
+}
 
 function cardFormIsValid() {
     return _.all(_.values(cardForm.fields));
@@ -123,10 +136,10 @@ function cardFormIsValid() {
 
 function update_submit_button() {
     if( cardFormIsValid() ) {
-        _dom.registerButton.prop('disabled', false);
+        _dom.registerSubmitButton.prop('disabled', false);
         return;
     }
-    _dom.registerButton.prop('disabled', true);
+    _dom.registerSubmitButton.prop('disabled', true);
 }
 function validatePhoneNumber(val) {
     if(val.length === 0) {
@@ -189,11 +202,12 @@ $(document).ready(function(){
         phoneNumberField: $('#id_phone_number'),
         cardNumberField: $('#id_card_number'),
         registerCardForm: $('.register-card-form'),
-        registerButton: $('#register-submit-btn'),
+        registerSubmitButton: $('#register-submit-btn'),
         usernameField: $('#id_username'),
         userIdField: $('#id_user_id'),
         selectedUserWrap: $('.register-card-form--selected-user-wrap'),
-        toastWrap: $('.toast-wrap')
+        toastWrap: $('.toast-wrap'),
+        registerResetButton: $('.register-reset-btn')
     };
     var urls = {
         insideUserApi: '/inside/user/',
@@ -303,7 +317,7 @@ $(document).ready(function(){
         _dom.phoneNumberField.val(number).trigger('input');
     });
 
-    _dom.registerButton.on('click', function(e) {
+    _dom.registerSubmitButton.on('click', function(e) {
         e.preventDefault();
         // TODO on error output validation status
         // TODO on success:
@@ -330,11 +344,12 @@ $(document).ready(function(){
             headers: {'X-CSRFToken': getCookie('csrftoken')}
         }).success(function(data){
             console.log("success", data);
-            set_toast('Success! '+ data);
+            set_toast('Success :-)');
+            resetCardForm(true);
 
         }).fail(function(data) {
             console.log("failed", data);
-            set_toast('Failed! '+ data);
+            set_toast('Failed!');
         });
     });
 
@@ -342,16 +357,19 @@ $(document).ready(function(){
     _dom.userIdField.on('change', function() {
         /* Render selected user in search form */
         if(selectedUser) {
-            render_selected_user({res: selectedUser});
+            render_selected_user(selectedUser);
             return;
         }
-        render_selected_user({placeholder: true});
+        render_selected_user();
+    });
+    _dom.registerResetButton.on('click', function() {
+        console.log('reset!');
+        resetCardForm();
     });
 
     /* Ninja add some icons to bootstrap form */
-    var inputGroup = '<div class="input-group">';
     var iconMobile = '<span class="input-group-addon"><span class="glyphicon glyphicon-phone"></span></span>';
-    _dom.phoneNumberField.wrap(inputGroup);
+    _dom.phoneNumberField.parent().addClass('input-group');
     _dom.phoneNumberField.before(iconMobile);
 
     /* Initial focus */
@@ -362,7 +380,7 @@ $(document).ready(function(){
         _dom.phoneNumberField.focus();
     }
     /* Initial submit button state disabled */
-    _dom.registerButton.attr('disabled','disabled');
+    _dom.registerSubmitButton.attr('disabled','disabled');
 
     /* Load query params */
     /* FIXME: does not trigger validation and selected user preview */

static/dist/scripts/templates.js

@@ -44,7 +44,7 @@ output += "not-member";
 output += "\">\n    ";
 ;
 }
-output += "\n    <!-- Name -->\n    ";
+output += "\n    <!-- Name -->\n    <span class=\"glyphicon glyphicon-user\"></span> ";
 output += runtime.suppressValue(runtime.memberLookup((runtime.contextOrFrameLookup(context, frame, "res")),"firstname", env.opts.autoescape), env.opts.autoescape);
 output += " ";
 output += runtime.suppressValue(runtime.memberLookup((runtime.contextOrFrameLookup(context, frame, "res")),"lastname", env.opts.autoescape), env.opts.autoescape);
@@ -69,14 +69,14 @@ output += "</span>\n        ";
 ;
 }
 output += "\n        <!-- Card -->\n        ";
-if(!runtime.memberLookup((runtime.contextOrFrameLookup(context, frame, "res")),"card_is_legacy", env.opts.autoescape)) {
-output += "\n            <span class=\"label label-card \"><span class=\"glyphicon glyphicon-user\"></span> ";
-output += runtime.suppressValue(env.getFilter("default").call(context, runtime.memberLookup((runtime.contextOrFrameLookup(context, frame, "res")),"card_number_active", env.opts.autoescape),"No card"), env.opts.autoescape);
+if(runtime.memberLookup((runtime.contextOrFrameLookup(context, frame, "res")),"card_number_active", env.opts.autoescape) && runtime.memberLookup((runtime.contextOrFrameLookup(context, frame, "res")),"card_is_legacy", env.opts.autoescape) != "") {
+output += "\n            <span class=\"label label-card label-card-yes\"><span class=\"glyphicon glyphicon-ok\"></span> ";
+output += runtime.suppressValue(runtime.memberLookup((runtime.contextOrFrameLookup(context, frame, "res")),"card_number_active", env.opts.autoescape), env.opts.autoescape);
 output += "</span>\n        ";
 ;
 }
 else {
-output += "\n            <span class=\"label label-card \"><span class=\"glyphicon glyphicon-user\"></span> No card</span>\n        ";
+output += "\n            <span class=\"label label-card label-card-no\"><span class=\"glyphicon glyphicon-remove\"></span> No card</span>\n        ";
 ;
 }
 output += "\n        <!-- Is active -->\n        ";

static/dist/styles/app.css

@@ -1 +1 @@
-html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}b,strong{font-weight:700}dfn{font-style:italic}h1{margin:.67em 0}mark{background:#ff0;color:#000}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}hr{box-sizing:content-box;height:0}pre{overflow:auto}samp{font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver}textarea{overflow:auto}optgroup{font-weight:700}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}@media print{*,*:before,*:after{background:transparent!important;color:#000!important;box-shadow:none!important;text-shadow:none!important}a,a:visited{text-decoration:underline}a[href]:after{content:" (" attr(href)")"}abbr[title]:after{content:" (" attr(title)")"}a[href^="#"]:after,a[href^="javascript:"]:after{content:""}pre,blockquote{border:1px solid #999;page-break-inside:avoid}thead{display:table-header-group}tr,img{page-break-inside:avoid}img{max-width:100%!important}p,h2,h3{orphans:3;widows:3}h2,h3{page-break-after:avoid}.navbar{display:none}.btn>.caret,.dropup>.btn>.caret{border-top-color:#000!important}.label{border:1px solid #000}.table{border-collapse:collapse!important}.table td,.table th{background-color:#fff!important}.table-bordered th,.table-bordered td{border:1px solid #ddd!important}}@font-face{font-family:'Glyphicons Halflings';src:url("../fonts/glyphicons-halflings-regular.eot");src:url("../fonts/glyphicons-halflings-regular.eot?#iefix") format("embedded-opentype"),url("../fonts/glyphicons-halflings-regular.woff2") format("woff2"),url("../fonts/glyphicons-halflings-regular.woff") format("woff"),url("../fonts/glyphicons-halflings-regular.ttf") format("truetype"),url("../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular") format("svg")}.glyphicon{position:relative;top:1px;display:inline-block;font-family:'Glyphicons Halflings';font-style:normal;font-weight:400;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.glyphicon-asterisk:before{content:"\2a"}.glyphicon-plus:before{content:"\2b"}.glyphicon-euro:before,.glyphicon-eur:before{content:"\20ac"}.glyphicon-minus:before{content:"\2212"}.glyphicon-cloud:before{content:"\2601"}.glyphicon-envelope:before{content:"\2709"}.glyphicon-pencil:before{content:"\270f"}.glyphicon-glass:before{content:"\e001"}.glyphicon-music:before{content:"\e002"}.glyphicon-search:before{content:"\e003"}.glyphicon-heart:before{content:"\e005"}.glyphicon-star:before{content:"\e006"}.glyphicon-star-empty:before{content:"\e007"}.glyphicon-user:before{content:"\e008"}.glyphicon-film:before{content:"\e009"}.glyphicon-th-large:before{content:"\e010"}.glyphicon-th:before{content:"\e011"}.glyphicon-th-list:before{content:"\e012"}.glyphicon-ok:before{content:"\e013"}.glyphicon-remove:before{content:"\e014"}.glyphicon-zoom-in:before{content:"\e015"}.glyphicon-zoom-out:before{content:"\e016"}.glyphicon-off:before{content:"\e017"}.glyphicon-signal:before{content:"\e018"}.glyphicon-cog:before{content:"\e019"}.glyphicon-trash:before{content:"\e020"}.glyphicon-home:before{content:"\e021"}.glyphicon-file:before{content:"\e022"}.glyphicon-time:before{content:"\e023"}.glyphicon-road:before{content:"\e024"}.glyphicon-download-alt:before{content:"\e025"}.glyphicon-download:before{content:"\e026"}.glyphicon-upload:before{content:"\e027"}.glyphicon-inbox:before{content:"\e028"}.glyphicon-play-circle:before{content:"\e029"}.glyphicon-repeat:before{content:"\e030"}.glyphicon-refresh:before{content:"\e031"}.glyphicon-list-alt:before{content:"\e032"}.glyphicon-lock:before{content:"\e033"}.glyphicon-flag:before{content:"\e034"}.glyphicon-headphones:before{content:"\e035"}.glyphicon-volume-off:before{content:"\e036"}.glyphicon-volume-down:before{content:"\e037"}.glyphicon-volume-up:before{content:"\e038"}.glyphicon-qrcode:before{content:"\e039"}.glyphicon-barcode:before{content:"\e040"}.glyphicon-tag:before{content:"\e041"}.gLine truncated
+html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}b,strong{font-weight:700}dfn{font-style:italic}h1{margin:.67em 0}mark{background:#ff0;color:#000}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}hr{box-sizing:content-box;height:0}pre{overflow:auto}samp{font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver}textarea{overflow:auto}optgroup{font-weight:700}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}@media print{*,*:before,*:after{background:transparent!important;color:#000!important;box-shadow:none!important;text-shadow:none!important}a,a:visited{text-decoration:underline}a[href]:after{content:" (" attr(href)")"}abbr[title]:after{content:" (" attr(title)")"}a[href^="#"]:after,a[href^="javascript:"]:after{content:""}pre,blockquote{border:1px solid #999;page-break-inside:avoid}thead{display:table-header-group}tr,img{page-break-inside:avoid}img{max-width:100%!important}p,h2,h3{orphans:3;widows:3}h2,h3{page-break-after:avoid}.navbar{display:none}.btn>.caret,.dropup>.btn>.caret{border-top-color:#000!important}.label{border:1px solid #000}.table{border-collapse:collapse!important}.table td,.table th{background-color:#fff!important}.table-bordered th,.table-bordered td{border:1px solid #ddd!important}}@font-face{font-family:'Glyphicons Halflings';src:url("../fonts/glyphicons-halflings-regular.eot");src:url("../fonts/glyphicons-halflings-regular.eot?#iefix") format("embedded-opentype"),url("../fonts/glyphicons-halflings-regular.woff2") format("woff2"),url("../fonts/glyphicons-halflings-regular.woff") format("woff"),url("../fonts/glyphicons-halflings-regular.ttf") format("truetype"),url("../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular") format("svg")}.glyphicon{position:relative;top:1px;display:inline-block;font-family:'Glyphicons Halflings';font-style:normal;font-weight:400;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.glyphicon-asterisk:before{content:"\2a"}.glyphicon-plus:before{content:"\2b"}.glyphicon-euro:before,.glyphicon-eur:before{content:"\20ac"}.glyphicon-minus:before{content:"\2212"}.glyphicon-cloud:before{content:"\2601"}.glyphicon-envelope:before{content:"\2709"}.glyphicon-pencil:before{content:"\270f"}.glyphicon-glass:before{content:"\e001"}.glyphicon-music:before{content:"\e002"}.glyphicon-search:before{content:"\e003"}.glyphicon-heart:before{content:"\e005"}.glyphicon-star:before{content:"\e006"}.glyphicon-star-empty:before{content:"\e007"}.glyphicon-user:before{content:"\e008"}.glyphicon-film:before{content:"\e009"}.glyphicon-th-large:before{content:"\e010"}.glyphicon-th:before{content:"\e011"}.glyphicon-th-list:before{content:"\e012"}.glyphicon-ok:before{content:"\e013"}.glyphicon-remove:before{content:"\e014"}.glyphicon-zoom-in:before{content:"\e015"}.glyphicon-zoom-out:before{content:"\e016"}.glyphicon-off:before{content:"\e017"}.glyphicon-signal:before{content:"\e018"}.glyphicon-cog:before{content:"\e019"}.glyphicon-trash:before{content:"\e020"}.glyphicon-home:before{content:"\e021"}.glyphicon-file:before{content:"\e022"}.glyphicon-time:before{content:"\e023"}.glyphicon-road:before{content:"\e024"}.glyphicon-download-alt:before{content:"\e025"}.glyphicon-download:before{content:"\e026"}.glyphicon-upload:before{content:"\e027"}.glyphicon-inbox:before{content:"\e028"}.glyphicon-play-circle:before{content:"\e029"}.glyphicon-repeat:before{content:"\e030"}.glyphicon-refresh:before{content:"\e031"}.glyphicon-list-alt:before{content:"\e032"}.glyphicon-lock:before{content:"\e033"}.glyphicon-flag:before{content:"\e034"}.glyphicon-headphones:before{content:"\e035"}.glyphicon-volume-off:before{content:"\e036"}.glyphicon-volume-down:before{content:"\e037"}.glyphicon-volume-up:before{content:"\e038"}.glyphicon-qrcode:before{content:"\e039"}.glyphicon-barcode:before{content:"\e040"}.glyphicon-tag:before{content:"\e041"}.gLine truncated