core: add generic login/base_full template for static login views

This commit is contained in:
Jens Langhammer 2020-07-08 14:17:29 +02:00
parent 0bfb623f97
commit 1524880eec
6 changed files with 104 additions and 163 deletions

View File

@ -1,58 +1,20 @@
{% extends 'base/skeleton.html' %} {% extends 'login/base_full.html' %}
{% load static %} {% load static %}
{% load i18n %} {% load i18n %}
{% load passbook_utils %} {% load passbook_utils %}
{% block body %} {% block title %}
<div class="pf-c-background-image"> {% trans 'Bad Request' %}
<svg xmlns="http://www.w3.org/2000/svg" class="pf-c-background-image__filter" width="0" height="0"> {% endblock %}
<filter id="image_overlay">
<feColorMatrix type="matrix" values="1 0 0 0 0 1 0 0 0 0 1 0 0 0 0 0 0 0 1 0"></feColorMatrix> {% block card %}
<feComponentTransfer color-interpolation-filters="sRGB" result="duotone"> <form method="POST" class="pf-c-form">
<feFuncR type="table" tableValues="0.086274509803922 0.43921568627451"></feFuncR> {% if message %}
<feFuncG type="table" tableValues="0.086274509803922 0.43921568627451"></feFuncG> <h3>{% trans message %}</h3>
<feFuncB type="table" tableValues="0.086274509803922 0.43921568627451"></feFuncB> {% endif %}
<feFuncA type="table" tableValues="0 1"></feFuncA> {% if 'back' in request.GET %}
</feComponentTransfer> <a href="{% back %}" class="btn btn-primary btn-block btn-lg">{% trans 'Back' %}</a>
</filter> {% endif %}
</svg> </form>
</div>
<div class="pf-c-login">
<div class="pf-c-login__container">
<header class="pf-c-login__header">
<img class="pf-c-brand" src="{% static 'passbook/logo.svg' %}" style="height: 60px;" alt="passbook icon" />
<img class="pf-c-brand" src="{% static 'passbook/brand.svg' %}" style="height: 60px;" alt="passbook branding" />
</header>
<main class="pf-c-login__main" id="flow-body">
<header class="pf-c-login__main-header">
<h1 class="pf-c-title pf-m-3xl">
{% trans 'Bad Request' %}
</h1>
</header>
<div class="pf-c-login__main-body">
{% block card %}
<form method="POST" class="pf-c-form">
{% if message %}
<h3>{% trans message %}</h3>
{% endif %}
{% if 'back' in request.GET %}
<a href="{% back %}" class="btn btn-primary btn-block btn-lg">{% trans 'Back' %}</a>
{% endif %}
</form>
{% endblock %}
</div>
</main>
<footer class="pf-c-login__footer">
<p></p>
<ul class="pf-c-list pf-m-inline">
{% for link in config.passbook.footer_links %}
<li>
<a href="{{ link.href }}">{{ link.name }}</a>
</li>
{% endfor %}
</ul>
</footer>
</div>
</div>
{% endblock %} {% endblock %}

View File

@ -0,0 +1,53 @@
{% extends 'base/skeleton.html' %}
{% load static %}
{% load i18n %}
{% load passbook_utils %}
{% block body %}
<div class="pf-c-background-image">
<svg xmlns="http://www.w3.org/2000/svg" class="pf-c-background-image__filter" width="0" height="0">
<filter id="image_overlay">
<feColorMatrix type="matrix" values="1 0 0 0 0 1 0 0 0 0 1 0 0 0 0 0 0 0 1 0"></feColorMatrix>
<feComponentTransfer color-interpolation-filters="sRGB" result="duotone">
<feFuncR type="table" tableValues="0.086274509803922 0.43921568627451"></feFuncR>
<feFuncG type="table" tableValues="0.086274509803922 0.43921568627451"></feFuncG>
<feFuncB type="table" tableValues="0.086274509803922 0.43921568627451"></feFuncB>
<feFuncA type="table" tableValues="0 1"></feFuncA>
</feComponentTransfer>
</filter>
</svg>
</div>
<div class="pf-c-login">
<div class="pf-c-login__container">
<header class="pf-c-login__header">
<img class="pf-c-brand" src="{% static 'passbook/logo.svg' %}" style="height: 60px;" alt="passbook icon" />
<img class="pf-c-brand" src="{% static 'passbook/brand.svg' %}" style="height: 60px;" alt="passbook branding" />
</header>
{% block main_container %}
<main class="pf-c-login__main">
<header class="pf-c-login__main-header">
<h1 class="pf-c-title pf-m-3xl">
{% block title %}
{% endblock %}
</h1>
</header>
<div class="pf-c-login__main-body">
{% block card %}
{% endblock %}
</div>
</main>
{% endblock %}
<footer class="pf-c-login__footer">
<p></p>
<ul class="pf-c-list pf-m-inline">
{% for link in config.passbook.footer_links %}
<li>
<a href="{{ link.href }}">{{ link.name }}</a>
</li>
{% endfor %}
</ul>
</footer>
</div>
</div>
{% endblock %}

View File

@ -1,63 +1,25 @@
{% extends 'base/skeleton.html' %} {% extends 'login/base_full.html' %}
{% load static %} {% load static %}
{% load i18n %} {% load i18n %}
{% load passbook_utils %} {% load passbook_utils %}
{% block body %} {% block title %}
<div class="pf-c-background-image"> {% trans 'Permission denied' %}
<svg xmlns="http://www.w3.org/2000/svg" class="pf-c-background-image__filter" width="0" height="0"> {% endblock %}
<filter id="image_overlay">
<feColorMatrix type="matrix" values="1 0 0 0 0 1 0 0 0 0 1 0 0 0 0 0 0 0 1 0"></feColorMatrix> {% block card %}
<feComponentTransfer color-interpolation-filters="sRGB" result="duotone"> <form method="POST" class="pf-c-form">
<feFuncR type="table" tableValues="0.086274509803922 0.43921568627451"></feFuncR> {% csrf_token %}
<feFuncG type="table" tableValues="0.086274509803922 0.43921568627451"></feFuncG> {% include 'partials/form.html' %}
<feFuncB type="table" tableValues="0.086274509803922 0.43921568627451"></feFuncB> <div class="pf-c-form__group">
<feFuncA type="table" tableValues="0 1"></feFuncA> <p>
</feComponentTransfer> <i class="pf-icon pf-icon-error-circle-o"></i>
</filter> {% trans 'Access denied' %}
</svg> </p>
</div> </div>
<div class="pf-c-login"> {% if 'back' in request.GET %}
<div class="pf-c-login__container"> <a href="{% back %}" class="btn btn-primary btn-block btn-lg">{% trans 'Back' %}</a>
<header class="pf-c-login__header"> {% endif %}
<img class="pf-c-brand" src="{% static 'passbook/logo.svg' %}" style="height: 60px;" alt="passbook icon" /> </form>
<img class="pf-c-brand" src="{% static 'passbook/brand.svg' %}" style="height: 60px;" alt="passbook branding" />
</header>
<main class="pf-c-login__main" id="flow-body">
<header class="pf-c-login__main-header">
<h1 class="pf-c-title pf-m-3xl">
{% trans 'Permission denied' %}
</h1>
</header>
<div class="pf-c-login__main-body">
{% block card %}
<form method="POST" class="pf-c-form">
{% csrf_token %}
{% include 'partials/form.html' %}
<div class="pf-c-form__group">
<p>
<i class="pf-icon pf-icon-error-circle-o"></i>
{% trans 'Access denied' %}
</p>
</div>
{% if 'back' in request.GET %}
<a href="{% back %}" class="btn btn-primary btn-block btn-lg">{% trans 'Back' %}</a>
{% endif %}
</form>
{% endblock %}
</div>
</main>
<footer class="pf-c-login__footer">
<p></p>
<ul class="pf-c-list pf-m-inline">
{% for link in config.passbook.footer_links %}
<li>
<a href="{{ link.href }}">{{ link.name }}</a>
</li>
{% endfor %}
</ul>
</footer>
</div>
</div>
{% endblock %} {% endblock %}

View File

@ -1,4 +1,4 @@
{% extends 'base/skeleton.html' %} {% extends 'login/base_full.html' %}
{% load static %} {% load static %}
{% load i18n %} {% load i18n %}
@ -20,51 +20,16 @@
</style> </style>
{% endblock %} {% endblock %}
{% block body %} {% block main_container %}
<div class="pf-c-background-image"> <main class="pf-c-login__main" id="flow-body">
<svg xmlns="http://www.w3.org/2000/svg" class="pf-c-background-image__filter" width="0" height="0"> <div class="pf-c-login__main-body pb-loading">
<filter id="image_overlay"> <span class="pf-c-spinner" role="progressbar" aria-valuetext="Loading...">
<feColorMatrix type="matrix" values="1 0 0 0 0 1 0 0 0 0 1 0 0 0 0 0 0 0 1 0"></feColorMatrix> <span class="pf-c-spinner__clipper"></span>
<feComponentTransfer color-interpolation-filters="sRGB" result="duotone"> <span class="pf-c-spinner__lead-ball"></span>
<feFuncR type="table" tableValues="0.086274509803922 0.43921568627451"></feFuncR> <span class="pf-c-spinner__tail-ball"></span>
<feFuncG type="table" tableValues="0.086274509803922 0.43921568627451"></feFuncG> </span>
<feFuncB type="table" tableValues="0.086274509803922 0.43921568627451"></feFuncB>
<feFuncA type="table" tableValues="0 1"></feFuncA>
</feComponentTransfer>
</filter>
</svg>
</div>
<ul class="pf-c-alert-group pf-m-toast">
</ul>
<div class="pf-c-login">
<div class="pf-c-login__container">
<header class="pf-c-login__header">
<img class="pf-c-brand" src="{% static 'passbook/logo.svg' %}" style="height: 60px;"
alt="passbook icon" />
<img class="pf-c-brand" src="{% static 'passbook/brand.svg' %}" style="height: 60px;"
alt="passbook branding" />
</header>
<main class="pf-c-login__main" id="flow-body">
<div class="pf-c-login__main-body pb-loading">
<span class="pf-c-spinner" role="progressbar" aria-valuetext="Loading...">
<span class="pf-c-spinner__clipper"></span>
<span class="pf-c-spinner__lead-ball"></span>
<span class="pf-c-spinner__tail-ball"></span>
</span>
</div>
</main>
<footer class="pf-c-login__footer">
<p></p>
<ul class="pf-c-list pf-m-inline">
{% for link in config.passbook.footer_links %}
<li>
<a href="{{ link.href }}">{{ link.name }}</a>
</li>
{% endfor %}
</ul>
</footer>
</div> </div>
</div> </main>
<script> <script>
const flowBodyUrl = "{{ exec_url }}"; const flowBodyUrl = "{{ exec_url }}";
const messagesUrl = "{{ msg_url }}"; const messagesUrl = "{{ msg_url }}";

View File

@ -1,4 +1,4 @@
{% extends "login/denied.html" %} {% extends "login/base_full.html" %}
{% load passbook_utils %} {% load passbook_utils %}
{% load i18n %} {% load i18n %}

View File

@ -1,4 +1,4 @@
{% extends "login/base.html" %} {% extends "login/base_full.html" %}
{% load passbook_utils %} {% load passbook_utils %}
{% load i18n %} {% load i18n %}
@ -8,20 +8,19 @@
{% endblock %} {% endblock %}
{% block card %} {% block card %}
<header class="login-pf-header"> <form class="pf-c-form" method="POST" action="{{ request_url }}">
<h1>{% trans 'Authorize Application' %}</h1>
</header>
<form method="POST" action="{{ request_url }}">
{% csrf_token %} {% csrf_token %}
<input type="hidden" name="SAMLRequest" value="{{ request }}" /> <input type="hidden" name="SAMLRequest" value="{{ request }}" />
<input type="hidden" name="RelayState" value="{{ relay_state }}" /> <input type="hidden" name="RelayState" value="{{ relay_state }}" />
<div class="login-group"> <div class="login-group">
<h3> <h3>
{% blocktrans with remote=source.name %} {% blocktrans with source=source.name %}
You're about to sign-in via {{ remote }} You're about to sign-in via {{ source }}.
{% endblocktrans %} {% endblocktrans %}
</h3> </h3>
<input class="btn btn-primary btn-block btn-lg" type="submit" value="{% trans 'Continue' %}" /> </div>
<div class="pf-c-form__group pf-m-action">
<button class="pf-c-button pf-m-primary pf-m-block" type="submit">{% trans "Continue" %}</button>
</div> </div>
</form> </form>
{% endblock %} {% endblock %}