misc: update footer (#23891)
|
@ -560,20 +560,6 @@ div#toplinks {
|
|||
position: relative;
|
||||
top: -1.4em;
|
||||
}
|
||||
&::after {
|
||||
content: '';
|
||||
width: 2.8em;
|
||||
height: 2.8em;
|
||||
display: block;
|
||||
background: #fff;
|
||||
position: relative;
|
||||
top: 2.5em;
|
||||
transform: rotate(-45deg);
|
||||
left: calc(50% - 19em);
|
||||
@media screen and (max-width: $mobile-limit) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
a {
|
||||
background-image: url(images/forward.png);
|
||||
background-repeat: no-repeat;
|
||||
|
@ -585,48 +571,59 @@ 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: url(images/footer-background.jpg) no-repeat;
|
||||
background-size: cover;
|
||||
@media screen and (max-width: $mobile-limit) {
|
||||
display: none;
|
||||
}
|
||||
background-color: #000;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
div#footer {
|
||||
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;
|
||||
}
|
||||
}
|
||||
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;
|
||||
}
|
||||
}
|
||||
|
||||
div#footnote {
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
max-width: $width;
|
||||
margin: 10px auto;
|
||||
text-align: center;
|
||||
color: $link-color;
|
||||
a {
|
||||
text-decoration: underline;
|
||||
}
|
||||
p {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
#cut-nav {
|
||||
float: left;
|
||||
|
|
After Width: | Height: | Size: 9.3 KiB |
Before Width: | Height: | Size: 152 KiB |
After Width: | Height: | Size: 2.9 KiB |
After Width: | Height: | Size: 17 KiB |
After Width: | Height: | Size: 5.9 KiB |
Before Width: | Height: | Size: 2.7 KiB |
Before Width: | Height: | Size: 3.0 KiB |
Before Width: | Height: | Size: 1.9 KiB |
|
@ -128,49 +128,38 @@
|
|||
</div> <!-- #main-content -->
|
||||
</div> <!-- #main-content-wrapper -->
|
||||
|
||||
<footer>
|
||||
{% block footer-top %}{% endblock %}
|
||||
<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>
|
||||
<div id="footer-wrapper">
|
||||
<div id="footer">
|
||||
{% block footer %}
|
||||
<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>
|
||||
<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>
|
||||
{% endblock %}
|
||||
</div>
|
||||
</div>
|
||||
{% block footer-bottom %}
|
||||
<div id="footnote">
|
||||
<p>Le {{ account_label }} de territoire est un service de la Métropole de Lyon et ses partenaires <br />
|
||||
pour simplifier l’accès à leurs services en ligne avec un seul et même {{ account_label }}.
|
||||
<a href="{{ partners_url }}" target="_blank">En savoir+</a></p>
|
||||
<p><a href="{{ cut_base_url }}/cgu/" target="_blank">Mentions légales</a></p>
|
||||
</div>
|
||||
{% endblock %}
|
||||
</footer>
|
||||
</div> <!-- #page -->
|
||||
{% if environment_label %}<span id="environment-label">{{ environment_label }}</span>{% endif %}
|
||||
|
|