misc: update footer styles (#23891)
Restore previous footer and add new icons and texts.
This commit is contained in:
parent
749f07b55c
commit
55209179e3
|
|
@ -635,59 +635,71 @@ div#toplinks {
|
|||
}
|
||||
}
|
||||
|
||||
div#footer-top, div#footer {
|
||||
width: 95rem;
|
||||
margin: 1rem auto;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
div#footer-top {
|
||||
img {
|
||||
height: 55px;
|
||||
margin: 0 1em;
|
||||
}
|
||||
> div {
|
||||
width: 49.5%;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
}
|
||||
div.feder {
|
||||
font-size: 13px;
|
||||
}
|
||||
@media screen and (max-width: $mobile-limit) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
div#footer-wrapper {
|
||||
background-color: #000;
|
||||
color: #FFFFFF;
|
||||
background: url(images/footer-background.jpg) no-repeat;
|
||||
background-size: cover;
|
||||
@media screen and (max-width: $mobile-limit) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
div#footer {
|
||||
a {
|
||||
color: #FFFFFF;
|
||||
}
|
||||
> div {
|
||||
width: 49.5%;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
@media screen and (max-width: $mobile-limit) {
|
||||
width: 100%;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
a.metro {
|
||||
display: inline-block;
|
||||
padding-top: 2px;
|
||||
padding-left: 34px;
|
||||
background: url(images/footer-metropole-plus.png) no-repeat center left;
|
||||
min-height: 22px;
|
||||
float: right;
|
||||
}
|
||||
margin: 3rem auto;
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
width: 60em;
|
||||
h3 {
|
||||
display: inline-block;
|
||||
padding: 5px 10px;
|
||||
margin: 6.5em 0 1em 1em;
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
@each $i in (simple, unique, securise) {
|
||||
.#{$i} {
|
||||
background: url(images/#{$i}.png) no-repeat;
|
||||
background-size: 40%;
|
||||
background-position: top center;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
div#footnote {
|
||||
font-size: 15px;
|
||||
max-width: $width;
|
||||
padding: 1rem 0 0 0;
|
||||
> div {
|
||||
padding: 1rem 0;
|
||||
&.footnote-top img {
|
||||
height: 55px;
|
||||
margin: 0 1em;
|
||||
}
|
||||
&.footnote-bottom {
|
||||
background: #000;
|
||||
color: #ffffff;
|
||||
a {
|
||||
color: #ffffff;
|
||||
&.metro {
|
||||
display: inline-block;
|
||||
padding-top: 2px;
|
||||
padding-left: 34px;
|
||||
background: url(images/footer-metropole-plus.png) no-repeat center left;
|
||||
min-height: 22px;
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
}
|
||||
> div {
|
||||
width: 95rem;
|
||||
margin: 0 auto;
|
||||
> div {
|
||||
width: 49.5%;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#cut-nav {
|
||||
float: left;
|
||||
|
|
|
|||
Binary file not shown.
|
After Width: | Height: | Size: 152 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.7 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.9 KiB |
|
|
@ -128,38 +128,74 @@
|
|||
</div> <!-- #main-content -->
|
||||
</div> <!-- #main-content-wrapper -->
|
||||
|
||||
<footer>
|
||||
<div id="footer-top">
|
||||
{% block footer-top %}
|
||||
<div class="cell textcell grid-1-2">
|
||||
<div>
|
||||
<p>
|
||||
{{ global_title }} est un service de la Métropole de Lyon et ses partenaires pour simplifier l’accès à leurs services en ligne avec un seul et même compte.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="cell textcell">
|
||||
<div>
|
||||
<img src="{{site_base}}{% static "grandlyon-cut/images/logo-europe-engage.png" %}" title="L'Europe s'engage en région Auvergne-Rhône-Alpes avec le FEDER" alt="L'Europe s'engage en région Auvergne-Rhône-Alpes avec le FEDER" />
|
||||
<img src="{{site_base}}{% static "grandlyon-cut/images/eu-logo.png" %}" title="Union Européenne" alt="Union Européenne" />
|
||||
<img src="{{site_base}}{% static "grandlyon-cut/images/logo-gl.png" %}" title="Grand Lyon" alt="Grand Lyon" />
|
||||
</div>
|
||||
<div class="feder">Cette action est cofinancée par l'Union européenne dans le cadre du Fonds Européen de Développement Régional (FEDER).</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
</div>
|
||||
<footer>
|
||||
{% block footer-top %}{% endblock %}
|
||||
<div id="footer-wrapper">
|
||||
<div id="footer">
|
||||
{% block footer %}
|
||||
<div class="cell textcell"><div>
|
||||
<p><a href="/cgu/">MENTIONS LEGALES</a> | <a href="{{ help_url }}">EN SAVOIR +</a></p>
|
||||
</div></div>
|
||||
<div class="cell textcell"><div>
|
||||
<p><a class="metro" href="http://www.grandlyon.com/" target="_blank" title="Accéder au site de la Métropole de Lyon (nouvelle fenêtre)">un site de la Métropole de Lyon</a></p>
|
||||
</div></div>
|
||||
<div class="textcell grid-1-3 securise desktop-only">
|
||||
<div>
|
||||
<h3>Sécurisé</h3>
|
||||
<p>Effectuez vos démarches en toute <strong>sécurité</strong></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="textcell grid-1-3 unique desktop-only">
|
||||
<div><h3>Unique</h3>
|
||||
<p>Accédez à vos services en ligne avec <strong>un seul compte</strong></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="textcell grid-1-3 simple desktop-only">
|
||||
<div>
|
||||
<h3>Simple</h3>
|
||||
<p><strong>Facilitez</strong> vos démarches<br /> en ligne</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="cell textcell clear desktop-only"><div><p> </p><p> </p></div></div>
|
||||
<div class="cell textcell desktop-only " >
|
||||
<div><p><strong>Un seul compte pour accéder à vos services numériques<br>
|
||||
situés sur le territoire de la Métropole de Lyon</strong>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
</div>
|
||||
</div>
|
||||
{% block footer-bottom %}
|
||||
<div id="footnote">
|
||||
<div class="footnote-top desktop-only">
|
||||
<div>
|
||||
<div class="cell textcell grid-1-2">
|
||||
<div>
|
||||
<p>
|
||||
{{ global_title }} est un service de la Métropole de Lyon et ses partenaires pour simplifier l’accès à leurs services en ligne avec un seul et même compte.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="cell textcell">
|
||||
<div>
|
||||
<img src="{{site_base}}{% static "grandlyon-cut/images/logo-europe-engage.png" %}" title="L'Europe s'engage en région Auvergne-Rhône-Alpes avec le FEDER" alt="L'Europe s'engage en région Auvergne-Rhône-Alpes avec le FEDER" />
|
||||
<img src="{{site_base}}{% static "grandlyon-cut/images/eu-logo.png" %}" title="Union Européenne" alt="Union Européenne" />
|
||||
<img src="{{site_base}}{% static "grandlyon-cut/images/logo-gl.png" %}" title="Grand Lyon" alt="Grand Lyon" />
|
||||
</div>
|
||||
<div class="feder">Cette action est cofinancée par l'Union européenne dans le cadre du Fonds Européen de Développement Régional (FEDER).</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footnote-bottom">
|
||||
<div>
|
||||
<div class="cell textcell"><div>
|
||||
<p><a href="/cgu/">MENTIONS LEGALES</a> | <a href="{{ help_url }}">EN SAVOIR +</a></p>
|
||||
</div></div>
|
||||
<div class="cell textcell"><div>
|
||||
<p><a class="metro" href="http://www.grandlyon.com/" target="_blank" title="Accéder au site de la Métropole de Lyon (nouvelle fenêtre)">un site de la Métropole de Lyon</a></p>
|
||||
</div></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
</footer>
|
||||
</div> <!-- #page -->
|
||||
{% if environment_label %}<span id="environment-label">{{ environment_label }}</span>{% endif %}
|
||||
|
|
|
|||
Reference in New Issue