Merge pull request #18 from Aquaveo/html-and-style-fixes

Addresses several structure and style issues with TOTP and Email dialogs

mfa/templates/Email/Add.html

@@ -2,18 +2,15 @@
 {% block head %}
 {% endblock %}
 {% block content %}
-    <br/>
+<br/>
-    <br/>
+<br/>
-
+<div class="container">
   <div class="panel panel-default">
     <div class="panel-heading">
       <strong> Activate Token by email</strong>
     </div>
     <div class="panel-body">
-
       <FORM METHOD="POST" ACTION="{% url 'start_email' %}" Id="formLogin"  onSubmit="" name="FrontPage_Form1">
-
-
         {% csrf_token %}
         {%  if invalid %}
         <div class="alert alert-danger">
@@ -28,10 +25,9 @@
         <fieldset>
           <div class="row">
             <div class="col-sm-12 col-md-12">
-        <p>Enter the 6-digits sent to your email.</p>
+              <p>Enter the code sent to your email.</p>
             </div>
           </div>
-
           <div class="row">
             <div class="col-sm-12 col-md-12">
               <div class="form-group">
@@ -40,16 +36,16 @@
                   <i class="glyphicon glyphicon-lock"></i>
                   </span>
                   <input class="form-control" size="6" MaxLength="6" value="" placeholder="e.g 55552" name="otp" type="text" id="otp" autofocus>
-
                 </div>
               </div>
-
               <div class="form-group">
-
                 <input type="submit" class="btn btn-lg btn-success btn-block" value="Verify">
               </div>
             </div>
+          </div>
         </fieldset>
       </FORM>
     </div>
+  </div>
+</div>
 {% endblock %}

mfa/templates/Email/recheck.html

@@ -39,7 +39,7 @@
       <fieldset>
       <div class="row">
       <div class="col-sm-12 col-md-12">
-        <p>Enter the 6-digits sent to your email.</p>
+        <p>Enter the code sent to your email.</p>
       </div>
       </div>
 

mfa/templates/MFA.html

@@ -66,7 +66,7 @@
                 {% endif %}
             </ul>
             </div>
-
+        </div>
     <br/>
     <br/>
        <table class="table table-striped">

mfa/templates/TOTP/Add.html

@@ -2,7 +2,7 @@
 {% extends "base.html" %}
 {% load static %}
 {% block head %}
-    <style>
+<style>
     #two-factor-steps {
 	border: 1px solid #ccc;
 	border-radius: 3px;
@@ -12,8 +12,8 @@
         margin: 0px;
     }
     </style>
-    <script src="{% static 'mfa/js/qrious.min.js' %}" type="text/javascript"></script>
+<script src="{% static 'mfa/js/qrious.min.js' %}" type="text/javascript"></script>
-    <script type="text/javascript">
+<script type="text/javascript">
     var key="";
     $(document).ready(function addToken() {
         $.ajax({
@@ -61,16 +61,16 @@
     </script>
 {% endblock %}
 {% block content %}
-    <br/>
+<br/>
-    <br/>
+<br/>
-    <div class="container">
+<div class="container">
     <div class="col-md-6 col-md-offset-3" id="two-factor-steps">
         <div class="row" align="center">
             <h4>Adding Authenticator</h4>
         </div>
         <div class="row">
 
-        <p>Scan the image below with the two-factor authentication app on your <a href="javascript:void(0)" onclick="showTOTP()">phone/PC</a> phone/PC. If you can’t use a barcode,
+            <p>Scan the image below with the two-factor authentication app on your <a href="javascript:void(0)" onclick="showTOTP()">phone/PC</a>. If you can’t use a barcode,
                 <a href="javascript:void(0)" onclick="showKey()">enter this text</a> instead. </p>
         </div>
 
@@ -93,7 +93,7 @@
                 <input style="display: inline;width: 95%" maxlength="6" size="6" class="form-control" id="answer" placeholder="e.g 785481"/>
 
             </div>
-        <div class="row">
+            <div class="row" style="padding-top: 10px;">
                 <div class="col-md-6" style="padding-left: 0px">
                     <button class="btn btn-success" onclick="verify()">Enable</button>
                 </div>
@@ -104,6 +104,6 @@
         </div>
 
     </div>
-        </div>
+</div>
-    {% include "modal.html" %}
+{% include "modal.html" %}
 {% endblock %}