braine-l-alleud: style "wallonie connect" button (#60479)

This commit is contained in:
Frédéric Péters 2022-01-11 08:53:56 +01:00
parent 60c2368b63
commit 9d22fae57d
5 changed files with 59 additions and 0 deletions

View File

@ -573,3 +573,53 @@ div.gru-nav li.selected > a {
.pwa-navigation div > ul li a span {
padding-top: 4px;
}
#wca-login-box {
h2 {
text-align: center;
}
#agent-connect-button {
img {
display: block;
margin: 0 auto;
}
p {
text-align: center;
}
span {
display: inline-block;
background: linear-gradient(90deg, #bd1f68 0%, #e31049 100%);
padding: 5px 45px 5px 45px;
font-size: 18px;
text-decoration: none;
color: #fff;
position: relative;
background-repeat: no-repeat;
background-position: left center;
display: inline-block;
vertical-align: middle;
margin-left: 50px;
margin-bottom: 20px;
&::before {
content: url(../img/wca-button-icon.svg);
width: 50px;
height: 50px;
position: absolute;
display: inline-block;
left: -25px;
top: 50%;
transform: translateY(-50%);
}
&::after {
content: url(../img/wca-button-arrow.svg);
width: 8px;
height: auto;
position: absolute;
display: inline-block;
right: 20px;
top: 50%;
transform: translateY(-50%);
}
}
}
}

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 6.49 10.41"><defs><style>.cls-1{fill:none;stroke:#fff;stroke-linecap:round;stroke-linejoin:round;}</style></defs><title>arrow</title><g id="Calque_2" data-name="Calque 2"><g id="Calque_1-2" data-name="Calque 1"><path id="layer1" class="cls-1" d="M.5.5,6,5.2.5,9.91"/></g></g></svg>

After

Width:  |  Height:  |  Size: 334 B

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 51 51"><defs><style>.cls-1,.cls-5{fill:#fff;}.cls-1{stroke-miterlimit:10;stroke:url(#Dégradé_sans_nom_2);}.cls-2{fill:url(#Dégradé_sans_nom_2-2);}.cls-3{fill:url(#Dégradé_sans_nom_2-3);}.cls-4{fill:url(#Dégradé_sans_nom_2-4);}</style><linearGradient id="Dégradé_sans_nom_2" y1="25.5" x2="51" y2="25.5" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#e31049"/><stop offset="1" stop-color="#c9005d"/></linearGradient><linearGradient id="Dégradé_sans_nom_2-2" x1="25.14" y1="16.93" x2="25.67" y2="16.93" xlink:href="#Dégradé_sans_nom_2"/><linearGradient id="Dégradé_sans_nom_2-3" x1="25.56" y1="15.22" x2="31.43" y2="15.22" xlink:href="#Dégradé_sans_nom_2"/><linearGradient id="Dégradé_sans_nom_2-4" x1="13.09" y1="28.16" x2="37.91" y2="28.16" xlink:href="#Dégradé_sans_nom_2"/></defs><title>logo-agent_1</title><g id="Calque_2" data-name="Calque 2"><g id="Calque_1-2" data-name="Calque 1"><circle class="cls-1" cx="25.5" cy="25.5" r="25"/><rect class="cls-2" x="25.14" y="13.11" width="0.53" height="7.64"/><path class="cls-3" d="M25.56,17.15a3.52,3.52,0,0,0,1.52.34,10.68,10.68,0,0,0,2.06-.57,4.38,4.38,0,0,1,2.29.19V13.34A2.76,2.76,0,0,0,30.35,13a4.17,4.17,0,0,0-1.76.27,7.28,7.28,0,0,1-1.62.42,3,3,0,0,1-1.36-.3Z"/><polygon class="cls-4" points="25.41 18.29 13.09 21.78 13.09 21.8 13.09 38.04 23.42 38.04 23.42 31.52 27.48 31.52 27.48 38.04 37.91 38.04 37.91 21.8 37.91 21.78 25.41 18.29"/><rect class="cls-5" x="12.8" y="21.75" width="25.4" height="0.95"/></g></g></svg>

After

Width:  |  Height:  |  Size: 1.6 KiB

BIN
static/img/wca.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.8 KiB

View File

@ -0,0 +1,7 @@
<div id ="wca-login-box">
<h2>Connexion avec <span class="highlight">Wallonie Connect</span></h2>
<a id="agent-connect-button" href="{{ login_url }}">
<img id="wca-login-img" src="/static/img/wca.png" alt="">
<p><span>Je suis un agent</span></p>
</a>
</div>