2024-06-26 13:55:39 +02:00
<!DOCTYPE html>
< html >
< head >
< meta name = "viewport" content = "width=device-width, initial-scale=1, shrink-to-fit=no" >
< title > AIL-Framework< / title >
< link rel = "icon" href = "{{ url_for('static', filename='image/ail-icon.png')}}" >
<!-- Core CSS -->
< link href = "{{ url_for('static', filename='css/bootstrap4.min.css') }}" rel = "stylesheet" >
< link href = "{{ url_for('static', filename='css/font-awesome.min.css') }}" rel = "stylesheet" >
<!-- JS -->
< script src = "{{ url_for('static', filename='js/jquery.js')}}" > < / script >
< script src = "{{ url_for('static', filename='js/bootstrap4.min.js')}}" > < / script >
< / head >
< body class = "text-center" >
< img class = "mb-4" src = "{{ url_for('static', filename='image/ail-project.png')}}" width = "200" >
< h1 class = "text-secondary" > 2FA: OTP Setup< / h1 >
< div class = "row" >
< div class = "col-lg-6" >
2024-06-27 17:06:05 +02:00
< h3 class = "text-secondary mb-0" > < b > TOTP< / b > < / h3 >
2024-06-26 13:55:39 +02:00
< img src = "data:image/png;base64, {{ qr_code }}" >
< div style = "font-size: 20px;" > - Install an < b > authenticator application< / b > on your mobile.< / div >
< div style = "font-size: 20px;" > - < b > Scan< / b > the QRCode< / div >
2024-06-27 17:06:05 +02:00
< p >
< button class = "btn btn-sm btn-info" type = "button" data-toggle = "collapse" data-target = "#collapseExample" aria-expanded = "false" aria-controls = "collapseExample" >
< i class = "fas fa-link" > < / i > < b > TOTP URL< / b >
< / button >
< / p >
< div class = "collapse" id = "collapseExample" >
< div class = "card card-body" >
{{ otp_url }}
< / div >
< / div >
< / div >
2024-06-26 13:55:39 +02:00
< div class = "col-lg-6" >
2024-06-27 17:06:05 +02:00
< h3 class = "text-secondary" > < b > HOTP< / b > < / h3 >
2024-06-26 13:55:39 +02:00
{% for code in hotp_codes %}
< div > < i > {{ code[:-6] }}< / i > < b > {{ code[-6:] }}< / b > < / div >
{% endfor %}
< / div >
< / div >
< form class = "form-signin" action = "{{ url_for('root.setup_2fa')}}" method = "post" >
{# < h1 class = "h3 mb-3 text-secondary" > 2FA: Please Enter your TOTP or HOTP< / h1 > #}
< div class = "mx-4" >
< input type = "text" id = "otp" name = "otp" class = "form-control {% if error %}is-invalid{% endif %}" placeholder = "OTP Code" autocomplete = "off" required autofocus >
{% if error %}
< div class = "invalid-feedback" >
{{error}}
< / div >
{% endif %}
< button class = "btn btn-lg btn-primary btn-block mb-4" type = "submit" > Once you have scanned the QRCode or copied the HOTP codes, Please Enter your TOTP or HOTP< / button >
< / div >
< / form >
< / body >
