mirror of
https://github.com/ail-project/ail-framework.git
synced 2024-09-19 23:48:23 +00:00
62 lines
2.6 KiB
HTML
62 lines
2.6 KiB
HTML
<!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">
|
|
<h3 class="text-secondary mb-0"><b>TOTP</b></h3>
|
|
<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>
|
|
<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>
|
|
<div class="col-lg-6">
|
|
<h3 class="text-secondary"><b>HOTP</b></h3>
|
|
{% 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>
|