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

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

40
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,21 +38,6 @@
<p>{{ config.passbook.branding.title }}</p> <p>{{ config.passbook.branding.title }}</p>
{% endif %} {% endif %}
</div> </div>
</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 card_title %}
{% endblock %}
</h1>
</header>
<div class="pf-c-login__main-body">
{% block card %}
{% endblock %}
</div>
</main>
{% endblock %}
<footer class="pf-c-login__footer"> <footer class="pf-c-login__footer">
<p></p> <p></p>
<ul class="pf-c-list pf-m-inline"> <ul class="pf-c-list pf-m-inline">
@ -60,6 +55,21 @@
{% endif %} {% endif %}
</ul> </ul>
</footer> </footer>
</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 card_title %}
{% endblock %}
</h1>
</header>
<div class="pf-c-login__main-body">
{% block card %}
{% endblock %}
</div>
</main>
{% endblock %}
</div> </div>
</div> </div>
{% endblock %} {% endblock %}

14
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 %}