ezidam/crates/ezidam/templates/pages/settings/security.html.tera

210 lines
7.9 KiB
Text

{% extends "shell" %}
{% block content %}
<!-- Page header -->
<div class="page-header d-print-none">
<div class="container-xl">
<div class="row g-2 align-items-center">
<div class="col">
<h2 class="page-title">
Settings
</h2>
</div>
</div>
</div>
</div>
<!-- Page body -->
<div class="page-body">
<div class="container-xl">
{% if flash %}
<div class="alert alert-{{flash.0}}" role="alert">
<h4 class="alert-title">{{ flash.1 | safe }}</h4>
</div>
{% endif %}
<div class="card">
<div class="row g-0">
<div class="col-3 d-none d-md-block border-end">
<div class="card-body">
<div class="list-group list-group-transparent">
<a href="./personal"
class="list-group-item list-group-item-action d-flex align-items-center">Personal</a>
<a href="./security"
class="list-group-item list-group-item-action d-flex align-items-center active">Security</a>
<a href="./visual"
class="list-group-item list-group-item-action d-flex align-items-center">Visual</a>
</div>
</div>
</div>
<div class="col d-flex flex-column">
<div class="card-body">
<h2 class="mb-4">Security</h2>
<!-- Password -->
<div class="mb-4">
<h3 class="card-title">Password</h3>
<div>
<a class="btn" data-bs-toggle="modal" data-bs-target="#modal-password">
Set new password
</a>
</div>
</div>
<!-- Paper key -->
<div class="mb-4">
<h3 class="card-title">Paper key</h3>
<p class="card-subtitle">
You can use your paper key to reset your password if you forget it.</p>
<div>
<a class="btn" data-bs-toggle="modal" data-bs-target="#modal-paper-key">
Generate new paper key
</a>
</div>
</div>
<!-- Logout everywhere -->
<div class="mb-4">
<h3 class="card-title">Logout everywhere</h3>
<p class="card-subtitle">Logout from every application you signed in with your account.</p>
<div>
<a class="btn btn-danger" data-bs-toggle="modal" data-bs-target="#modal-logout-confirm">
Logout everywhere
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Password modal -->
<div class="modal modal-blur" tabindex="-1" id="modal-password">
<div class="modal-dialog modal-sm modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-status bg-info"></div>
<div class="modal-header">
<h5 class="modal-title">Set new password</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<form action="./security/password" method="post">
<div class="modal-body py-4">
<div class="mb-2">
<label class="form-label required" for="password">Password</label>
<div class="input-group input-group-flat">
<input id="password" name="password" type="password" class="form-control"
placeholder="Your password"
autocomplete="off" required>
</div>
</div>
</div>
<div class="modal-footer">
<a href="#" class="btn btn-link link-secondary" data-bs-dismiss="modal">
Cancel
</a>
<button type="submit" class="btn btn-primary ms-auto">
Save password
</button>
</div>
</form>
</div>
</div>
</div>
<!-- Paper key modal -->
<div class="modal modal-blur" tabindex="-1" id="modal-paper-key">
<div class="modal-dialog modal-sm modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-status bg-info"></div>
<div class="modal-body text-center py-4">
<div class="text-info mb-2">
{% include "icons/paperclip-large" %}
</div>
<h3>Generate new paper key</h3>
<div class="mt-2">A new paper key will be generated for your account.</div>
<div class="mt-2">This action will revoke your previous paper key if you had one.</div>
<div class="mt-2">Keep your paper key in a safe place!</div>
</div>
<div class="modal-footer">
<div class="w-100">
<div class="row">
<div class="col">
<a href="#" class="btn w-100" data-bs-dismiss="modal">Cancel</a>
</div>
<div class="col">
<form action="./security/paper_key" method="post">
<button type="submit" name="generate_paper_key" value="true"
class="btn btn-primary w-100">
Generate
</button>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Logout everywhere modal -->
<div class="modal modal-blur" tabindex="-1" id="modal-logout-confirm">
<div class="modal-dialog modal-sm modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-status bg-danger"></div>
<div class="modal-body text-center py-4">
<div class="text-danger mb-2">
{% include "icons/alert-triangle-large" %}
</div>
<h3>Do you want to log out everywhere?</h3>
<div class="mt-2">You will need to log in again in all applications.</div>
<div class="mt-2">This action can take up to {{ logout_time_effective }} minutes to be effective.</div>
</div>
<div class="modal-footer">
<div class="w-100">
<div class="row">
<div class="col">
<a href="#" class="btn w-100" data-bs-dismiss="modal">Cancel</a>
</div>
<div class="col">
<form action="./security/logout_everywhere" method="post">
<button type="submit" name="logout_everywhere" value="true"
class="btn btn-danger w-100">
Logout everywhere
</button>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
{% endblock content %}