trustchain-oc1-orchestral/authentik
Archived
10
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

flows: fix header/footer moving around on login template when card changes size

Browse source
This commit is contained in:
Jens Langhammer 2020-12-02 15:07:19 +01:00
parent dc4a7d98e8
commit 05aeeafacc
2 changed files with 42 additions and 32 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

44
passbook/core/templates/login/base_full.html
View file

@ -4,6 +4,16 @@
{% load i18n %} {% load i18n %}
{% load passbook_utils %} {% load passbook_utils %}
{% block head %}
{{ block.super }}
<style>
/* Fix logo/header/footer block moving around when card size changes */
.pf-c-login__header {
grid-row-start: 3;
}
</style>
{% endblock %}
{% block body %} {% block body %}
<div class="pf-c-background-image"> <div class="pf-c-background-image">
<svg xmlns="http://www.w3.org/2000/svg" class="pf-c-background-image__filter" width="0" height="0"> <svg xmlns="http://www.w3.org/2000/svg" class="pf-c-background-image__filter" width="0" height="0">
@ -28,6 +38,23 @@
<p>{{ config.passbook.branding.title }}</p> <p>{{ config.passbook.branding.title }}</p>
{% endif %} {% endif %}
</div> </div>
<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 %}
{% if config.passbook.branding.title != "passbook" %}
<li>
<a href="https://github.com/beryju/passbook">
{% trans 'Powered by passbook' %}
</a>
</li>
{% endif %}
</ul>
</footer>
</header> </header>
{% block main_container %} {% block main_container %}
<main class="pf-c-login__main"> <main class="pf-c-login__main">
@ -43,23 +70,6 @@
</div> </div>
</main> </main>
{% endblock %} {% 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 %}
{% if config.passbook.branding.title != "passbook" %}
<li>
<a href="https://github.com/beryju/passbook">
{% trans 'Powered by passbook' %}
</a>
</li>
{% endif %}
</ul>
</footer>
</div> </div>
</div> </div>
{% endblock %} {% endblock %}

30
passbook/flows/templates/flows/shell.html
View file

@ -6,21 +6,21 @@
{% block head %} {% block head %}
{{ block.super }} {{ block.super }}
<style> <style>
.pb-loading, .pb-loading,
.pf-c-login__main >iframe { .pf-c-login__main >iframe {
display: flex; display: flex;
height: 100%; height: 100%;
width: 100%; width: 100%;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
} }
.pb-hidden { .pb-hidden {
display: none display: none
} }
.pf-c-background-image::before { .pf-c-background-image::before {
background-image: url("{{ background_url }}"); background-image: url("{{ background_url }}");
background-position: center; background-position: center;
} }
</style> </style>
{% endblock %} {% endblock %}