diff --git a/uffd/invite/templates/invite/use.html b/uffd/invite/templates/invite/use.html
index d31f23d467126fb7aaa3ef1171ba57d5b32181a7..687153f9ab969b34507f8c4f55c91d24fbbe2388 100644
--- a/uffd/invite/templates/invite/use.html
+++ b/uffd/invite/templates/invite/use.html
@@ -1,51 +1,43 @@
-{% extends 'base.html' %}
+{% extends 'base_narrow.html' %}
{% block body %}
+ <div class="col-12 mb-3">
+ <h2 class="text-center">{{_('Invite Link')}}</h2>
+ </div>
+ {% if not request.user %}
+ <p>{{_('Welcome to the %(org_name)s Single-Sign-On!', org_name=config.ORGANISATION_NAME)}}</p>
+ {% endif %}
-<div class="row mt-2 justify-content-center">
- <div class="col-lg-6 col-md-10" style="background: #f7f7f7; box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3); padding: 30px;">
- <div class="text-center">
- <img alt="branding logo" src="{{ config.get("BRANDING_LOGO_URL") }}" class="col-lg-8 col-md-12" >
- </div>
- <div class="col-12 mb-3">
- <h2 class="text-center">{{_('Invite Link')}}</h2>
- </div>
- {% if not request.user %}
- <p>{{_('Welcome to the %(org_name)s Single-Sign-On!', org_name=config.ORGANISATION_NAME)}}</p>
+ {% if invite.roles and invite.allow_signup %}
+ <p>{{_('With this link you can register a new user account with the following roles or add the roles to an existing account:')}}</p>
+ {% elif invite.roles %}
+ <p>{{_('With this link you can add the following roles to an existing account:')}}</p>
+ {% elif invite.allow_signup %}
+ <p>{{_('With this link you can register a new user account.')}}</p>
+ {% endif %}
+ {% if invite.roles %}
+ <ul>
+ {% for role in invite.roles %}
+ <li>{{ role.name }}{% if role.description %}: {{ role.description }}{% endif %}</li>
+ {% endfor %}
+ </ul>
+ {% endif %}
+ {% if request.user %}
+ {% if invite.roles %}
+ <form method="POST" action="{{ url_for("invite.grant", token=invite.token) }}" class="mb-2">
+ <button type="submit" class="btn btn-primary btn-block">{{_('Add the roles to your account now')}}</button>
+ </form>
+ <a href="{{ url_for("session.logout", ref=url_for("session.login", ref=request.full_path)) }}" class="btn btn-secondary btn-block">{{_('Logout and switch to a different account')}}</a>
{% endif %}
-
- {% if invite.roles and invite.allow_signup %}
- <p>{{_('With this link you can register a new user account with the following roles or add the roles to an existing account:')}}</p>
- {% elif invite.roles %}
- <p>{{_('With this link you can add the following roles to an existing account:')}}</p>
- {% elif invite.allow_signup %}
- <p>{{_('With this link you can register a new user account.')}}</p>
+ {% if invite.allow_signup %}
+ <a href="{{ url_for("session.logout", ref=url_for("invite.signup_start", token=invite.token)) }}" class="btn btn-secondary btn-block">{{_('Logout to register a new account')}}</a>
{% endif %}
- {% if invite.roles %}
- <ul>
- {% for role in invite.roles %}
- <li>{{ role.name }}{% if role.description %}: {{ role.description }}{% endif %}</li>
- {% endfor %}
- </ul>
+ {% else %}
+ {% if invite.allow_signup %}
+ <a href="{{ url_for("invite.signup_start", token=invite.token) }}" class="btn btn-primary btn-block">{{_('Register a new account')}}</a>
{% endif %}
- {% if request.user %}
- {% if invite.roles %}
- <form method="POST" action="{{ url_for("invite.grant", token=invite.token) }}" class="mb-2">
- <button type="submit" class="btn btn-primary btn-block">{{_('Add the roles to your account now')}}</button>
- </form>
- <a href="{{ url_for("session.logout", ref=url_for("session.login", ref=request.full_path)) }}" class="btn btn-secondary btn-block">{{_('Logout and switch to a different account')}}</a>
- {% endif %}
- {% if invite.allow_signup %}
- <a href="{{ url_for("session.logout", ref=url_for("invite.signup_start", token=invite.token)) }}" class="btn btn-secondary btn-block">{{_('Logout to register a new account')}}</a>
- {% endif %}
- {% else %}
- {% if invite.allow_signup %}
- <a href="{{ url_for("invite.signup_start", token=invite.token) }}" class="btn btn-primary btn-block">{{_('Register a new account')}}</a>
- {% endif %}
- {% if invite.roles %}
- <a href="{{ url_for("session.login", ref=request.full_path) }}" class="btn btn-primary btn-block">{{_('Login and add the roles to your account')}}</a>
- {% endif %}
+ {% if invite.roles %}
+ <a href="{{ url_for("session.login", ref=request.full_path) }}" class="btn btn-primary btn-block">{{_('Login and add the roles to your account')}}</a>
{% endif %}
- </div>
-</div>
+ {% endif %}
{% endblock %}
diff --git a/uffd/mfa/templates/mfa/auth.html b/uffd/mfa/templates/mfa/auth.html
index c17e99f6d9de88a3dd31800905ddfb6f86770620..31e92dcc7019f08a0e2cae3cb0516e060fe03add 100644
--- a/uffd/mfa/templates/mfa/auth.html
+++ b/uffd/mfa/templates/mfa/auth.html
@@ -1,45 +1,37 @@
-{% extends 'base.html' %}
+{% extends 'base_narrow.html' %}
{% block body %}
-
<form action="{{ url_for("mfa.auth_finish", ref=ref) }}" method="POST">
-<div class="row mt-2 justify-content-center">
- <div class="col-lg-6 col-md-10" style="background: #f7f7f7; box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3); padding: 30px;">
- <div class="text-center">
- <img alt="branding logo" src="{{ config.get("BRANDING_LOGO_URL") }}" class="col-lg-8 col-md-12" >
- </div>
- <div class="col-12 mb-3">
- <h2 class="text-center">{{_("Two-Factor Authentication")}}</h2>
- </div>
- {% if request.user_pre_mfa.mfa_webauthn_methods %}
- <noscript>
- <div class="form-group col-12">
- <div id="webauthn-nojs" class="alert alert-warning" role="alert">{{_("Enable javascript for authentication with U2F/FIDO2 devices")}}</div>
- </div>
- </noscript>
- <div id="webauthn-unsupported" class="form-group col-12 d-none">
- <div class="alert alert-warning" role="alert">{{_("Authentication with U2F/FIDO2 devices is not supported by your browser")}}</div>
- </div>
- <div class="form-group col-12 d-none webauthn-group">
- <div id="webauthn-alert" class="alert alert-warning d-none" role="alert"></div>
- <button type="button" id="webauthn-btn" class="btn btn-primary btn-block">
- <span id="webauthn-spinner" class="spinner-border spinner-border-sm d-none" role="status" aria-hidden="true"></span>
- <span id="webauthn-btn-text">{{_("Authenticate with U2F/FIDO2 device")}}</span>
- </button>
- </div>
- <div class="text-center text-muted d-none webauthn-group mb-3">- {{_("or")}} -</div>
- {% endif %}
- <div class="form-group col-12 mb-2">
- <input type="text" class="form-control" id="mfa-code" name="code" required="required" placeholder="{{_("Code from your authenticator app or recovery code")}}" autocomplete="off" autofocus>
- </div>
- <div class="form-group col-12">
- <button type="submit" class="btn btn-primary btn-block">{{_("Verify")}}</button>
- </div>
+ <div class="col-12 mb-3">
+ <h2 class="text-center">{{_("Two-Factor Authentication")}}</h2>
+ </div>
+ {% if request.user_pre_mfa.mfa_webauthn_methods %}
+ <noscript>
<div class="form-group col-12">
- <a href="{{ url_for("session.logout") }}" class="btn btn-secondary btn-block">{{_("Cancel")}}</a>
+ <div id="webauthn-nojs" class="alert alert-warning" role="alert">{{_("Enable javascript for authentication with U2F/FIDO2 devices")}}</div>
</div>
+ </noscript>
+ <div id="webauthn-unsupported" class="form-group col-12 d-none">
+ <div class="alert alert-warning" role="alert">{{_("Authentication with U2F/FIDO2 devices is not supported by your browser")}}</div>
+ </div>
+ <div class="form-group col-12 d-none webauthn-group">
+ <div id="webauthn-alert" class="alert alert-warning d-none" role="alert"></div>
+ <button type="button" id="webauthn-btn" class="btn btn-primary btn-block">
+ <span id="webauthn-spinner" class="spinner-border spinner-border-sm d-none" role="status" aria-hidden="true"></span>
+ <span id="webauthn-btn-text">{{_("Authenticate with U2F/FIDO2 device")}}</span>
+ </button>
+ </div>
+ <div class="text-center text-muted d-none webauthn-group mb-3">- {{_("or")}} -</div>
+ {% endif %}
+ <div class="form-group col-12 mb-2">
+ <input type="text" class="form-control" id="mfa-code" name="code" required="required" placeholder="{{_("Code from your authenticator app or recovery code")}}" autocomplete="off" autofocus>
+ </div>
+ <div class="form-group col-12">
+ <button type="submit" class="btn btn-primary btn-block">{{_("Verify")}}</button>
+ </div>
+ <div class="form-group col-12">
+ <a href="{{ url_for("session.logout") }}" class="btn btn-secondary btn-block">{{_("Cancel")}}</a>
</div>
-</div>
</form>
{% if webauthn_supported and request.user_pre_mfa.mfa_webauthn_methods %}
diff --git a/uffd/oauth2/templates/oauth2/logout.html b/uffd/oauth2/templates/oauth2/logout.html
index f048ccdfc93ab9a670b7df603ca11dcec20994eb..e45a92686f1ae669164559ed882400123eb7e205 100644
--- a/uffd/oauth2/templates/oauth2/logout.html
+++ b/uffd/oauth2/templates/oauth2/logout.html
@@ -1,45 +1,38 @@
-{% extends 'base.html' %}
+{% extends 'base_narrow.html' %}
{% block body %}
-<div class="row mt-2 justify-content-center">
- <div class="col-lg-6 col-md-10" style="background: #f7f7f7; box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3); padding: 30px;">
- <div class="text-center">
- <img alt="branding logo" src="{{ config.get("BRANDING_LOGO_URL") }}" class="col-lg-8 col-md-12" >
- </div>
- <div class="col-12">
- <h2 class="text-center">{{_('Logout')}}</h2>
- </div>
+<div class="col-12">
+ <h2 class="text-center">{{_('Logout')}}</h2>
+</div>
- <div class="col-12">
- <noscript>
- <div class="alert alert-warning" role="alert">{{_('Javascript is required for automatic logout')}}</div>
- </noscript>
- <p>{{_('While you successfully logged out of the Single-Sign-On service, you may still be logged in on these services:')}}</p>
- <ul>
- {% for client in clients if client.logout_urls %}
- <li class="client" data-urls='{{ client.logout_urls|tojson }}'>
- {{ client.client_id }}
- <span class="status-active spinner-border spinner-border-sm d-none" role="status" aria-hidden="true"></span>
- <i class="status-success fas fa-check d-none"></i>
- <i class="status-failed fas fa-exclamation d-none"></i>
- </li>
- {% endfor %}
- </ul>
+<div class="col-12">
+ <noscript>
+ <div class="alert alert-warning" role="alert">{{_('Javascript is required for automatic logout')}}</div>
+ </noscript>
+ <p>{{_('While you successfully logged out of the Single-Sign-On service, you may still be logged in on these services:')}}</p>
+ <ul>
+ {% for client in clients if client.logout_urls %}
+ <li class="client" data-urls='{{ client.logout_urls|tojson }}'>
+ {{ client.client_id }}
+ <span class="status-active spinner-border spinner-border-sm d-none" role="status" aria-hidden="true"></span>
+ <i class="status-success fas fa-check d-none"></i>
+ <i class="status-failed fas fa-exclamation d-none"></i>
+ </li>
+ {% endfor %}
+ </ul>
- <p>
- {{_('Please wait until you have been automatically logged out of all services or make sure of this yourself.')}}
- </p>
+ <p>
+ {{_('Please wait until you have been automatically logged out of all services or make sure of this yourself.')}}
+ </p>
- <button id="retry-button" class="btn btn-block btn-primary d-none" disabled>
- <span id="cont-text">{{_('Logging you out on all services ...')}}</span>
- </button>
+ <button id="retry-button" class="btn btn-block btn-primary d-none" disabled>
+ <span id="cont-text">{{_('Logging you out on all services ...')}}</span>
+ </button>
- <a href="{{ request.values.get('ref') or '/' }}" class="btn btn-block btn-secondary">
- <span>{{_('Skip this and continue')}}</span>
- </a>
+ <a href="{{ request.values.get('ref') or '/' }}" class="btn btn-block btn-secondary">
+ <span>{{_('Skip this and continue')}}</span>
+ </a>
- </div>
- </div>
</div>
<script>
diff --git a/uffd/selfservice/templates/selfservice/forgot_password.html b/uffd/selfservice/templates/selfservice/forgot_password.html
index 6997f4a7b7f26f3e75c06759e020fcd21bbfca4a..9792f15b471d058f385e3c55b6fb82c732755e86 100644
--- a/uffd/selfservice/templates/selfservice/forgot_password.html
+++ b/uffd/selfservice/templates/selfservice/forgot_password.html
@@ -1,27 +1,20 @@
-{% extends 'base.html' %}
+{% extends 'base_narrow.html' %}
{% block body %}
<form action="{{ url_for("selfservice.forgot_password") }}" method="POST">
-<div class="row mt-2 justify-content-center">
- <div class="col-lg-6 col-md-10" style="background: #f7f7f7; box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3); padding: 30px;">
- <div class="text-center">
- <img alt="branding logo" src="{{ config.get("BRANDING_LOGO_URL") }}" class="col-lg-8 col-md-12" >
- </div>
- <div class="col-12">
- <h2 class="text-center">{{_("Forgot password")}}</h2>
- </div>
- <div class="form-group col-12">
- <label for="user-loginname">{{_("Login Name")}}</label>
- <input type="text" class="form-control" id="user-loginname" name="loginname" required="required" tabindex = "1">
- </div>
- <div class="form-group col-12">
- <label for="user-mail">{{_("Mail Address")}}</label>
- <input type="text" class="form-control" id="user-mail" name="mail" required="required" tabindex = "2">
- </div>
- <div class="form-group col-12">
- <button type="submit" class="btn btn-primary btn-block" tabindex = "3">{{_("Send password reset mail")}}</button>
- </div>
+ <div class="col-12">
+ <h2 class="text-center">{{_("Forgot password")}}</h2>
+ </div>
+ <div class="form-group col-12">
+ <label for="user-loginname">{{_("Login Name")}}</label>
+ <input type="text" class="form-control" id="user-loginname" name="loginname" required="required" tabindex = "1">
+ </div>
+ <div class="form-group col-12">
+ <label for="user-mail">{{_("Mail Address")}}</label>
+ <input type="text" class="form-control" id="user-mail" name="mail" required="required" tabindex = "2">
+ </div>
+ <div class="form-group col-12">
+ <button type="submit" class="btn btn-primary btn-block" tabindex = "3">{{_("Send password reset mail")}}</button>
</div>
-</div>
</form>
{% endblock %}
diff --git a/uffd/selfservice/templates/selfservice/self.html b/uffd/selfservice/templates/selfservice/self.html
index 158e3f3dfbc92176b87bb1ceac50960e54690f2c..79f4b0da87e39126acb89262663171482d1ac30e 100644
--- a/uffd/selfservice/templates/selfservice/self.html
+++ b/uffd/selfservice/templates/selfservice/self.html
@@ -9,7 +9,7 @@
</div>
{% endif %}
-<div class="row mt-3">
+<div class="row">
<div class="col-12 col-md-5">
<h5>{{_("Profile")}}</h5>
<p>{{_("Your profile information is used by all services that are integrated into the Single-Sign-On. Your e-mail address is also used for password recovery.")}}</p>
diff --git a/uffd/selfservice/templates/selfservice/set_password.html b/uffd/selfservice/templates/selfservice/set_password.html
index ff4c447895b3c52a3beb927e090403e89ed4d567..743b76333db6edf6db20bc0c5c1323b381a55c58 100644
--- a/uffd/selfservice/templates/selfservice/set_password.html
+++ b/uffd/selfservice/templates/selfservice/set_password.html
@@ -1,30 +1,23 @@
-{% extends 'base.html' %}
+{% extends 'base_narrow.html' %}
{% block body %}
<form action="{{ url_for("selfservice.token_password", token=token) }}" method="POST" onInput="password2.setCustomValidity(password1.value != password2.value ? 'Passwords do not match.' : '') ">
-<div class="row mt-2 justify-content-center">
- <div class="col-lg-6 col-md-10" style="background: #f7f7f7; box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3); padding: 30px;">
- <div class="text-center">
- <img alt="branding logo" src="{{ config.get("BRANDING_LOGO_URL") }}" class="col-lg-8 col-md-12" >
- </div>
- <div class="col-12">
- <h2 class="text-center">{{_("Reset password")}}</h2>
- </div>
- <div class="form-group col-12">
- <label for="user-password1">{{_("New Password")}}</label>
- <input type="password" class="form-control" id="user-password1" name="password1" tabindex="2" minlength={{ User.PASSWORD_MINLEN }} maxlength={{ User.PASSWORD_MAXLEN }} pattern="{{ User.PASSWORD_REGEX }}" required>
- <small class="form-text text-muted">
- {{ User.PASSWORD_DESCRIPTION|safe }}
- </small>
- </div>
- <div class="form-group col-12">
- <label for="user-password2">{{_("Repeat Password")}}</label>
- <input type="password" class="form-control" id="user-password2" name="password2" tabindex="3" required>
- </div>
- <div class="form-group col-12">
- <button type="submit" class="btn btn-primary btn-block" tabindex = "3">{{_("Set password")}}</button>
- </div>
+ <div class="col-12">
+ <h2 class="text-center">{{_("Reset password")}}</h2>
+ </div>
+ <div class="form-group col-12">
+ <label for="user-password1">{{_("New Password")}}</label>
+ <input type="password" class="form-control" id="user-password1" name="password1" tabindex="2" minlength={{ User.PASSWORD_MINLEN }} maxlength={{ User.PASSWORD_MAXLEN }} pattern="{{ User.PASSWORD_REGEX }}" required>
+ <small class="form-text text-muted">
+ {{ User.PASSWORD_DESCRIPTION|safe }}
+ </small>
+ </div>
+ <div class="form-group col-12">
+ <label for="user-password2">{{_("Repeat Password")}}</label>
+ <input type="password" class="form-control" id="user-password2" name="password2" tabindex="3" required>
+ </div>
+ <div class="form-group col-12">
+ <button type="submit" class="btn btn-primary btn-block" tabindex = "3">{{_("Set password")}}</button>
</div>
-</div>
</form>
{% endblock %}
diff --git a/uffd/session/templates/session/deviceauth.html b/uffd/session/templates/session/deviceauth.html
index 382cf74ade88637f4d066bda3317d38024abd47e..c0827501355d9003328d68a0d32a47ee67e36b12 100644
--- a/uffd/session/templates/session/deviceauth.html
+++ b/uffd/session/templates/session/deviceauth.html
@@ -1,4 +1,4 @@
-{% extends 'base.html' %}
+{% extends 'base_narrow.html' %}
{% block body %}
{% if not initiation %}
@@ -8,60 +8,53 @@
{% else %}
<form action="{{ url_for("session.deviceauth_finish") }}" method="POST">
{% endif %}
-<div class="row mt-2 justify-content-center">
- <div class="col-lg-6 col-md-10" style="background: #f7f7f7; box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3); padding: 30px;">
- <div class="text-center">
- <img alt="branding logo" src="{{ config.get("BRANDING_LOGO_URL") }}" class="col-lg-8 col-md-12" >
+ <div class="col-12">
+ <h2 class="text-center">{{_('Authorize Device Login')}}</h2>
+ </div>
+ <div class="form-group col-12">
+ <p>{{_('Log into a service on another device without entering your password.')}}</p>
+ </div>
+ <div class="form-group col-12">
+ <label for="initiation-code">{{_('Initiation Code')}}</label>
+ {% if not initiation %}
+ <input type="text" class="form-control" id="initiation-code" name="initiation-code" value="{{ initiation_code or '' }}" required="required" tabindex = "1" autofocus>
+ {% else %}
+ <input type="text" class="form-control" id="initiation-code" name="initiation-code" value="{{ initiation.code }}" readonly>
+ {% endif %}
+ </div>
+ {% if confirmation %}
+ <div class="form-group col-12">
+ <label for="confirmation-code">{{_('Confirmation Code')}}</label>
+ <input type="text" class="form-control" id="confirmation-code" name="confirmation-code" value="{{ confirmation.code }}" readonly>
</div>
- <div class="col-12">
- <h2 class="text-center">{{_('Authorize Device Login')}}</h2>
+ {% endif %}
+ {% if not initiation %}
+ <div class="form-group col-12">
+ <p>{{_('Start logging into a service on the other device and chose "Device Login" on the login page. Enter the displayed initiation code in the box above.')}}</p>
</div>
<div class="form-group col-12">
- <p>{{_('Log into a service on another device without entering your password.')}}</p>
+ <button type="submit" class="btn btn-primary btn-block" tabindex = "2">{{_('Continue')}}</button>
</div>
<div class="form-group col-12">
- <label for="initiation-code">{{_('Initiation Code')}}</label>
- {% if not initiation %}
- <input type="text" class="form-control" id="initiation-code" name="initiation-code" value="{{ initiation_code or '' }}" required="required" tabindex = "1" autofocus>
- {% else %}
- <input type="text" class="form-control" id="initiation-code" name="initiation-code" value="{{ initiation.code }}" readonly>
- {% endif %}
+ <a href="{{ url_for('index') }}" class="btn btn-secondary btn-block" tabindex="0">{{_('Cancel')}}</a>
</div>
- {% if confirmation %}
- <div class="form-group col-12">
- <label for="confirmation-code">{{_('Confirmation Code')}}</label>
- <input type="text" class="form-control" id="confirmation-code" name="confirmation-code" value="{{ confirmation.code }}" readonly>
- </div>
- {% endif %}
- {% if not initiation %}
- <div class="form-group col-12">
- <p>{{_('Start logging into a service on the other device and chose "Device Login" on the login page. Enter the displayed initiation code in the box above.')}}</p>
- </div>
- <div class="form-group col-12">
- <button type="submit" class="btn btn-primary btn-block" tabindex = "2">{{_('Continue')}}</button>
- </div>
- <div class="form-group col-12">
- <a href="{{ url_for('index') }}" class="btn btn-secondary btn-block" tabindex="0">{{_('Cancel')}}</a>
- </div>
- {% elif not confirmation %}
- <div class="form-group col-12">
- <p>{{_('Authorize the login for service <b>%(service_name)s</b>?', service_name=initiation.description|e)|safe}}</p>
- </div>
- <div class="form-group col-12">
- <button type="submit" class="btn btn-primary btn-block" tabindex = "2">{{_('Authorize Login')}}</button>
- </div>
- <div class="form-group col-12">
- <a href="{{ url_for('index') }}" class="btn btn-secondary btn-block" tabindex="0">{{_('Cancel')}}</a>
- </div>
- {% else %}
- <div class="form-group col-12">
- <p>{{_('Enter the confirmation code on the other device and complete the login. Click <em>Finish</em> afterwards.')|safe}}</p>
- </div>
- <div class="form-group col-12">
- <button type="submit" class="btn btn-primary btn-block" tabindex = "2">{{_('Finish')}}</button>
- </div>
- {% endif %}
- </div>
-</div>
+ {% elif not confirmation %}
+ <div class="form-group col-12">
+ <p>{{_('Authorize the login for service <b>%(service_name)s</b>?', service_name=initiation.description|e)|safe}}</p>
+ </div>
+ <div class="form-group col-12">
+ <button type="submit" class="btn btn-primary btn-block" tabindex = "2">{{_('Authorize Login')}}</button>
+ </div>
+ <div class="form-group col-12">
+ <a href="{{ url_for('index') }}" class="btn btn-secondary btn-block" tabindex="0">{{_('Cancel')}}</a>
+ </div>
+ {% else %}
+ <div class="form-group col-12">
+ <p>{{_('Enter the confirmation code on the other device and complete the login. Click <em>Finish</em> afterwards.')|safe}}</p>
+ </div>
+ <div class="form-group col-12">
+ <button type="submit" class="btn btn-primary btn-block" tabindex = "2">{{_('Finish')}}</button>
+ </div>
+ {% endif %}
</form>
{% endblock %}
diff --git a/uffd/session/templates/session/devicelogin.html b/uffd/session/templates/session/devicelogin.html
index 62578d0536240bbb64444273d9478f5cfb02122b..b9874ecdc8f2cff8e4b61a1a212a960a9b0e88c0 100644
--- a/uffd/session/templates/session/devicelogin.html
+++ b/uffd/session/templates/session/devicelogin.html
@@ -1,39 +1,32 @@
-{% extends 'base.html' %}
+{% extends 'base_narrow.html' %}
{% block body %}
<form action="{{ url_for("session.devicelogin_submit", ref=ref) }}" method="POST">
-<div class="row mt-2 justify-content-center">
- <div class="col-lg-6 col-md-10" style="background: #f7f7f7; box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3); padding: 30px;">
- <div class="text-center">
- <img alt="branding logo" src="{{ config.get("BRANDING_LOGO_URL") }}" class="col-lg-8 col-md-12" >
- </div>
- <div class="col-12">
- <h2 class="text-center">{{_('Device Login')}}</h2>
- </div>
- <div class="form-group col-12">
- <p>{{_('Use a login session on another device (e.g. your laptop) to log into a service without entering your password.')}}</p>
- </div>
- {% if initiation %}
- <div class="form-group col-12">
- <label for="initiation-code">{{_('Initiation Code')}}</label>
- <input type="text" class="form-control" id="initiation-code" name="initiation-code" value="{{ initiation.code }}" readonly>
- </div>
- <input type="hidden" class="form-control" id="initiation-secret" name="initiation-secret" value="{{ initiation.secret }}">
- <div class="form-group col-12">
- <label for="confirmation-code">{{_('Confirmation Code')}}</label>
- <input type="text" class="form-control" id="confirmation-code" name="confirmation-code" required="required" tabindex = "1" autofocus>
- </div>
- <div class="form-group col-12">
- <p>{{_('Open <code><a href="%(deviceauth_url)s">%(deviceauth_url)s</a></code> on the other device and enter the initiation code there. Then enter the confirmation code in the box above.', deviceauth_url=url_for('session.deviceauth', _external=True)|e)|safe}}</p>
- </div>
- <div class="form-group col-12">
- <button type="submit" class="btn btn-primary btn-block" tabindex = "3">{{_('Continue')}}</button>
- </div>
- {% endif %}
- <div class="form-group col-12">
- <a href="{{ url_for('session.login', ref=ref, devicelogin=True) }}" class="btn btn-secondary btn-block" tabindex="0">{{_('Cancel')}}</a>
- </div>
+ <div class="col-12">
+ <h2 class="text-center">{{_('Device Login')}}</h2>
+ </div>
+ <div class="form-group col-12">
+ <p>{{_('Use a login session on another device (e.g. your laptop) to log into a service without entering your password.')}}</p>
+ </div>
+ {% if initiation %}
+ <div class="form-group col-12">
+ <label for="initiation-code">{{_('Initiation Code')}}</label>
+ <input type="text" class="form-control" id="initiation-code" name="initiation-code" value="{{ initiation.code }}" readonly>
+ </div>
+ <input type="hidden" class="form-control" id="initiation-secret" name="initiation-secret" value="{{ initiation.secret }}">
+ <div class="form-group col-12">
+ <label for="confirmation-code">{{_('Confirmation Code')}}</label>
+ <input type="text" class="form-control" id="confirmation-code" name="confirmation-code" required="required" tabindex = "1" autofocus>
+ </div>
+ <div class="form-group col-12">
+ <p>{{_('Open <code><a href="%(deviceauth_url)s">%(deviceauth_url)s</a></code> on the other device and enter the initiation code there. Then enter the confirmation code in the box above.', deviceauth_url=url_for('session.deviceauth', _external=True)|e)|safe}}</p>
+ </div>
+ <div class="form-group col-12">
+ <button type="submit" class="btn btn-primary btn-block" tabindex = "3">{{_('Continue')}}</button>
+ </div>
+ {% endif %}
+ <div class="form-group col-12">
+ <a href="{{ url_for('session.login', ref=ref, devicelogin=True) }}" class="btn btn-secondary btn-block" tabindex="0">{{_('Cancel')}}</a>
</div>
-</div>
</form>
{% endblock %}
diff --git a/uffd/session/templates/session/login.html b/uffd/session/templates/session/login.html
index 1b876e8626b1c6a3c0133859fa94a3181e6ff551..3818d94321e208d867298404765a4aa4a980e2b2 100644
--- a/uffd/session/templates/session/login.html
+++ b/uffd/session/templates/session/login.html
@@ -1,41 +1,34 @@
-{% extends 'base.html' %}
+{% extends 'base_narrow.html' %}
{% block body %}
<form action="{{ url_for("session.login", ref=ref) }}" method="POST">
-<div class="row mt-2 justify-content-center">
- <div class="col-lg-6 col-md-10" style="background: #f7f7f7; box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3); padding: 30px;">
- <div class="text-center">
- <img alt="branding logo" src="{{ config.get("BRANDING_LOGO_URL") }}" class="col-lg-8 col-md-12" >
- </div>
- <div class="col-12">
- <h2 class="text-center">{{_("Login")}}</h2>
- </div>
- <div class="form-group col-12">
- <label for="user-loginname">{{_("Login Name")}}</label>
- <input type="text" class="form-control" id="user-loginname" name="loginname" required="required" tabindex = "1" autofocus>
- </div>
- <div class="form-group col-12">
- <label for="user-password1">{{_("Password")}}</label>
- <input type="password" class="form-control" id="user-password1" name="password" required="required" tabindex = "2">
- </div>
- <div class="form-group col-12">
- <button type="submit" class="btn btn-primary btn-block" tabindex = "3">{{_("Login")}}</button>
- </div>
- {% if request.values.get('devicelogin') %}
- <div class="text-center text-muted mb-3">{{_("- or -")}}</div>
- <div class="form-group col-12">
- <a href="{{ url_for('session.devicelogin_start', ref=ref) }}" class="btn btn-primary btn-block" tabindex="0">{{_("Login with another device")}}</a>
- </div>
+ <div class="col-12">
+ <h2 class="text-center">{{_("Login")}}</h2>
+ </div>
+ <div class="form-group col-12">
+ <label for="user-loginname">{{_("Login Name")}}</label>
+ <input type="text" class="form-control" id="user-loginname" name="loginname" required="required" tabindex = "1" autofocus>
+ </div>
+ <div class="form-group col-12">
+ <label for="user-password1">{{_("Password")}}</label>
+ <input type="password" class="form-control" id="user-password1" name="password" required="required" tabindex = "2">
+ </div>
+ <div class="form-group col-12">
+ <button type="submit" class="btn btn-primary btn-block" tabindex = "3">{{_("Login")}}</button>
+ </div>
+ {% if request.values.get('devicelogin') %}
+ <div class="text-center text-muted mb-3">{{_("- or -")}}</div>
+ <div class="form-group col-12">
+ <a href="{{ url_for('session.devicelogin_start', ref=ref) }}" class="btn btn-primary btn-block" tabindex="0">{{_("Login with another device")}}</a>
+ </div>
+ {% endif %}
+ <div class="clearfix col-12">
+ {% if config['SELF_SIGNUP'] %}
+ <a href="{{ url_for("signup.signup_start") }}" class="float-left">{{_("Register")}}</a>
+ {% endif %}
+ {% if config['ENABLE_PASSWORDRESET'] %}
+ <a href="{{ url_for("selfservice.forgot_password") }}" class="float-right">{{_("Forgot Password?")}}</a>
{% endif %}
- <div class="clearfix col-12">
- {% if config['SELF_SIGNUP'] %}
- <a href="{{ url_for("signup.signup_start") }}" class="float-left">{{_("Register")}}</a>
- {% endif %}
- {% if config['ENABLE_PASSWORDRESET'] %}
- <a href="{{ url_for("selfservice.forgot_password") }}" class="float-right">{{_("Forgot Password?")}}</a>
- {% endif %}
- </div>
</div>
-</div>
</form>
{% endblock %}
diff --git a/uffd/signup/templates/signup/confirm.html b/uffd/signup/templates/signup/confirm.html
index dc81ba7f55efd9f95990b3f588ba07e837fd1060..d6b75e2a9b589ce874c0bfbbb5665716781187c8 100644
--- a/uffd/signup/templates/signup/confirm.html
+++ b/uffd/signup/templates/signup/confirm.html
@@ -1,26 +1,19 @@
-{% extends 'base.html' %}
+{% extends 'base_narrow.html' %}
{% block body %}
<form action="{{ url_for(".signup_confirm_submit", token=signup.token) }}" method="POST">
-<div class="row mt-2 justify-content-center">
- <div class="col-lg-6 col-md-10" style="background: #f7f7f7; box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3); padding: 30px;">
- <div class="text-center">
- <img alt="branding logo" src="{{ config.get("BRANDING_LOGO_URL") }}" class="col-lg-8 col-md-12" >
- </div>
- <div class="col-12">
- <h2 class="text-center">{{_('Complete Registration')}}</h2>
- </div>
- {% if error %}
- <div class="alert alert-danger" role="alert">{{ error }}</div>
- {% endif %}
- <div class="form-group col-12">
- <label for="user-password1">{{_('Please enter your password to complete the account registration')}}</label>
- <input type="password" class="form-control" id="user-password1" name="password" required="required">
- </div>
- <div class="form-group col-12">
- <button type="submit" class="btn btn-primary btn-block">{{_('Complete Account Registration')}}</button>
- </div>
+ <div class="col-12">
+ <h2 class="text-center">{{_('Complete Registration')}}</h2>
+ </div>
+ {% if error %}
+ <div class="alert alert-danger" role="alert">{{ error }}</div>
+ {% endif %}
+ <div class="form-group col-12">
+ <label for="user-password1">{{_('Please enter your password to complete the account registration')}}</label>
+ <input type="password" class="form-control" id="user-password1" name="password" required="required">
+ </div>
+ <div class="form-group col-12">
+ <button type="submit" class="btn btn-primary btn-block">{{_('Complete Account Registration')}}</button>
</div>
-</div>
</form>
{% endblock %}
diff --git a/uffd/signup/templates/signup/start.html b/uffd/signup/templates/signup/start.html
index ad150f4ba5f538aefb85ba7a6b6cdeceef9e81ec..3238fffecb844b2e6850731d6a97d0933bb4cf39 100644
--- a/uffd/signup/templates/signup/start.html
+++ b/uffd/signup/templates/signup/start.html
@@ -1,63 +1,56 @@
-{% extends 'base.html' %}
+{% extends 'base_narrow.html' %}
{% block body %}
<form action="{{ url_for('.signup_submit') }}" method="POST" onInput="password2.setCustomValidity(password1.value != password2.value ? 'Passwords do not match.' : '') ">
-<div class="row mt-2 justify-content-center">
- <div class="col-lg-6 col-md-10" style="background: #f7f7f7; box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3); padding: 30px;">
- <div class="text-center">
- <img alt="branding logo" src="{{ config.get("BRANDING_LOGO_URL") }}" class="col-lg-8 col-md-12" >
- </div>
- <div class="col-12">
- <h2 class="text-center">{{_('Account Registration')}}</h2>
- </div>
- {% if error %}
- <div class="form-group col-12">
- <div class="alert alert-danger" role="alert">{{ error }}</div>
- </div>
- {% endif %}
- <div class="form-group col-12">
- <label for="user-loginname">{{_('Login Name')}}</label>
- <div class="js-only-input-group">
- <input type="text" class="form-control" id="user-loginname" name="loginname" aria-describedby="loginname-feedback" value="{{ request.form.loginname }}" minlength=1 maxlength=32 pattern="[a-z0-9_-]*" required>
- <div class="js-only-input-group-append d-none">
- <button class="btn btn-outline-secondary rounded-right" type="button" id="check-loginname">{{_('Check')}}</button>
- </div>
- <div id="loginname-feedback" class="invalid-feedback"></div>
+ <div class="col-12">
+ <h2 class="text-center">{{_('Account Registration')}}</h2>
+ </div>
+ {% if error %}
+ <div class="form-group col-12">
+ <div class="alert alert-danger" role="alert">{{ error }}</div>
+ </div>
+ {% endif %}
+ <div class="form-group col-12">
+ <label for="user-loginname">{{_('Login Name')}}</label>
+ <div class="js-only-input-group">
+ <input type="text" class="form-control" id="user-loginname" name="loginname" aria-describedby="loginname-feedback" value="{{ request.form.loginname }}" minlength=1 maxlength=32 pattern="[a-z0-9_-]*" required>
+ <div class="js-only-input-group-append d-none">
+ <button class="btn btn-outline-secondary rounded-right" type="button" id="check-loginname">{{_('Check')}}</button>
</div>
- <small class="form-text text-muted">
- {{_('At least one and at most 32 lower-case characters, digits, dashes ("-") or underscores ("_"). <b>Cannot be changed later!</b>')|safe}}
- </small>
- </div>
- <div class="form-group col-12">
- <label for="user-displayname">{{_('Display Name')}}</label>
- <input type="text" class="form-control" id="user-displayname" name="displayname" value="{{ request.form.displayname }}" minlength=1 maxlength=128 required>
- <small class="form-text text-muted">
- {{_('At least one and at most 128 characters, no other special requirements.')}}
- </small>
- </div>
- <div class="form-group col-12">
- <label for="user-mail">{{_('E-Mail Address')}}</label>
- <input type="email" class="form-control" id="user-mail" name="mail" value="{{ request.form.mail }}" required>
- <small class="form-text text-muted">
- {{_('We will send a confirmation mail to this address that you need to complete the registration.')}}
- </small>
- </div>
- <div class="form-group col-12">
- <label for="user-password1">{{_('Password')}}</label>
- <input type="password" class="form-control" id="user-password1" name="password1" minlength={{ User.PASSWORD_MINLEN }} maxlength={{ User.PASSWORD_MAXLEN }} pattern="{{ User.PASSWORD_REGEX }}" required>
- <small class="form-text text-muted">
- {{ User.PASSWORD_DESCRIPTION|safe }}
- </small>
- </div>
- <div class="form-group col-12">
- <label for="user-password2">{{_('Repeat Password')}}</label>
- <input type="password" class="form-control" id="user-password2" name="password2" required>
- </div>
- <div class="form-group col-12">
- <button type="submit" class="btn btn-primary btn-block">{{_('Create Account')}}</button>
+ <div id="loginname-feedback" class="invalid-feedback"></div>
</div>
+ <small class="form-text text-muted">
+ {{_('At least one and at most 32 lower-case characters, digits, dashes ("-") or underscores ("_"). <b>Cannot be changed later!</b>')|safe}}
+ </small>
+ </div>
+ <div class="form-group col-12">
+ <label for="user-displayname">{{_('Display Name')}}</label>
+ <input type="text" class="form-control" id="user-displayname" name="displayname" value="{{ request.form.displayname }}" minlength=1 maxlength=128 required>
+ <small class="form-text text-muted">
+ {{_('At least one and at most 128 characters, no other special requirements.')}}
+ </small>
+ </div>
+ <div class="form-group col-12">
+ <label for="user-mail">{{_('E-Mail Address')}}</label>
+ <input type="email" class="form-control" id="user-mail" name="mail" value="{{ request.form.mail }}" required>
+ <small class="form-text text-muted">
+ {{_('We will send a confirmation mail to this address that you need to complete the registration.')}}
+ </small>
+ </div>
+ <div class="form-group col-12">
+ <label for="user-password1">{{_('Password')}}</label>
+ <input type="password" class="form-control" id="user-password1" name="password1" minlength={{ User.PASSWORD_MINLEN }} maxlength={{ User.PASSWORD_MAXLEN }} pattern="{{ User.PASSWORD_REGEX }}" required>
+ <small class="form-text text-muted">
+ {{ User.PASSWORD_DESCRIPTION|safe }}
+ </small>
+ </div>
+ <div class="form-group col-12">
+ <label for="user-password2">{{_('Repeat Password')}}</label>
+ <input type="password" class="form-control" id="user-password2" name="password2" required>
+ </div>
+ <div class="form-group col-12">
+ <button type="submit" class="btn btn-primary btn-block">{{_('Create Account')}}</button>
</div>
-</div>
</form>
<script>
diff --git a/uffd/signup/templates/signup/submitted.html b/uffd/signup/templates/signup/submitted.html
index 6c85e910481bcc18b0ea459ad60aec4594d93b88..2e750bd540a93f19f4607a0d7399965d6c2d4260 100644
--- a/uffd/signup/templates/signup/submitted.html
+++ b/uffd/signup/templates/signup/submitted.html
@@ -1,17 +1,9 @@
-{% extends 'base.html' %}
+{% extends 'base_narrow.html' %}
{% block body %}
-
-<div class="row mt-2 justify-content-center">
- <div class="col-lg-6 col-md-10" style="background: #f7f7f7; box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3); padding: 30px;">
- <div class="text-center">
- <img alt="branding logo" src="{{ config.get("BRANDING_LOGO_URL") }}" class="col-lg-8 col-md-12" >
- </div>
- <div class="col-12 mb-3">
- <h2 class="text-center">{{_('Confirm your E-Mail Address')}}</h2>
- </div>
- <p>{{_('We sent a confirmation mail to <b>%(signup_mail)s</b>. You need to confirm your mail address within 48 hours to complete the account registration.', signup_mail=signup.mail|e)|safe}}</p>
- <p>{{_("If you mistyped your mail address or don't receive the confirmation mail for another reason, retry the registration procedure from the beginning.")}}</p>
- </div>
+<div class="col-12 mb-3">
+ <h2 class="text-center">{{_('Confirm your E-Mail Address')}}</h2>
</div>
+<p>{{_('We sent a confirmation mail to <b>%(signup_mail)s</b>. You need to confirm your mail address within 48 hours to complete the account registration.', signup_mail=signup.mail|e)|safe}}</p>
+<p>{{_("If you mistyped your mail address or don't receive the confirmation mail for another reason, retry the registration procedure from the beginning.")}}</p>
{% endblock %}
diff --git a/uffd/templates/base.html b/uffd/templates/base.html
index 8f28ff9034ed3ace875815275b5e069520752fed..ef34e937f251b6c0c4b5d0f08f93622361d110ec 100644
--- a/uffd/templates/base.html
+++ b/uffd/templates/base.html
@@ -107,7 +107,8 @@
</nav>
{% endblock navbar %}
- <div class="container mt-2">
+ {% block main %}
+ <main role="main" class="container mt-3">
<div class="row">
{% for message in get_flashed_messages() %}
<div class="col-12">
@@ -115,18 +116,17 @@
</div>
{% endfor %}
</div>
- </div>
- <main role="main" class="container">
{% block body %}
{% endblock body %}
- <!-- spacer for floating footer -->
- <div class="mb-5"></div>
</main>
+ {% endblock main %}
+ <!-- spacer for floating footer -->
+ <div class="mb-5"></div>
<footer class="footer">
{% block footer %}
- <div class="container">
+ <div class="container-fluid">
<ul class="list-inline">
{% for link in config["FOOTER_LINKS"]%}
<li class="list-inline-item"><a href="{{ link.url }}">{{ link.title }}</a></li>
diff --git a/uffd/templates/base_narrow.html b/uffd/templates/base_narrow.html
new file mode 100644
index 0000000000000000000000000000000000000000..2077185b5d63122b730b81d27ac00f8ebb215116
--- /dev/null
+++ b/uffd/templates/base_narrow.html
@@ -0,0 +1,26 @@
+{% extends 'base.html' %}
+
+{% block main %}
+<main role="main" class="container mt-3">
+ <div class="row justify-content-center">
+ <div class="col-lg-6 col-md-10 px-0">
+ <div class="row">
+ {% for message in get_flashed_messages() %}
+ <div class="col-12">
+ <div class="alert alert-primary" role="alert">{{ message }}</div>
+ </div>
+ {% endfor %}
+ </div>
+ </div>
+ </div>
+ <div class="row justify-content-center">
+ <div class="col-lg-6 col-md-10" style="background: #f7f7f7; box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3); padding: 30px;">
+ <div class="text-center">
+ <img alt="branding logo" src="{{ config.get("BRANDING_LOGO_URL") }}" class="col-lg-8 col-md-12" >
+ </div>
+ {% block body %}
+ {% endblock body %}
+ </div>
+ </div>
+</main>
+{% endblock main %}