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

View file

@ -4,6 +4,16 @@
{% load i18n %}
{% 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 %}
<div class="pf-c-background-image">
<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>
{% endif %}
</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">
<p></p>
<ul class="pf-c-list pf-m-inline">
@ -60,6 +55,21 @@
{% endif %}
</ul>
</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>
{% endblock %}