flows: fix header/footer moving around on login template when card changes size
This commit is contained in:
parent
dc4a7d98e8
commit
05aeeafacc
|
@ -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 %}
|
||||||
|
|
|
@ -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 %}
|
||||||
|
|
||||||
|
|
Reference in New Issue