3
0

changed to allow customisation of of the linkedin sign in logo
All checks were successful
continuous-integration/drone/push Build is passing

This commit is contained in:
Mike Sutton 2024-02-11 23:30:24 +00:00
parent 7903d2627c
commit 82f9915432
3 changed files with 109 additions and 18 deletions

View File

@ -0,0 +1,74 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Generator: Adobe Illustrator 25.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg
version="1.1"
id="katman_1"
x="0px"
y="0px"
viewBox="0 0 1800 1344"
style="enable-background:new 0 0 1800 1344;"
xml:space="preserve"
sodipodi:docname="linked_in.svg"
inkscape:version="1.3.2 (091e20e, 2023-11-25)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg"><defs
id="defs7" /><sodipodi:namedview
id="namedview7"
pagecolor="#ffffff"
bordercolor="#000000"
borderopacity="0.25"
inkscape:showpageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
inkscape:zoom="0.17559524"
inkscape:cx="902.64407"
inkscape:cy="672"
inkscape:window-width="1312"
inkscape:window-height="449"
inkscape:window-x="0"
inkscape:window-y="44"
inkscape:window-maximized="0"
inkscape:current-layer="katman_1" />
<style
type="text/css"
id="style1">
.st0{fill-rule:evenodd;clip-rule:evenodd;fill:#E3ECF5;}
.st1{fill:#FFFFFF;stroke:#C7C6C6;stroke-width:1.5405;stroke-miterlimit:10;}
.st2{fill:#020203;}
.st3{font-family:'Roboto-Bold';}
.st4{font-size:64.8063px;}
.st5{fill:#2465AF;}
.st6{fill:#FFFFFF;}
</style>
<g
id="g7">
<path
class="st5"
d="M1473.7,944.9H326.3c-55.6,0-100.6-45.1-100.6-100.6V839c0-55.6,45.1-100.6,100.6-100.6h1147.5 c55.6,0,100.6,45.1,100.6,100.6v5.3C1574.4,899.9,1529.3,944.9,1473.7,944.9z"
id="path4" />
<g
id="g5">
<text
transform="matrix(1 0 0 1 641.5649 863.5107)"
class="st6 st3 st4"
id="text4">Sign in with LinkedIn</text>
</g>
<g
id="g6">
<path
class="st6"
d="M322.8,825.3h20.4v65.5h-20.4V825.3z M333,792.8c6.5,0,11.8,5.3,11.8,11.8c0,6.5-5.3,11.8-11.8,11.8 c-6.5,0-11.8-5.3-11.8-11.8C321.1,798.1,326.4,792.8,333,792.8"
id="path5" />
<path
id="XMLID_6_"
class="st6"
d="M355.9,825.3h19.5v9h0.3c2.7-5.1,9.4-10.6,19.3-10.6c20.6,0,24.4,13.6,24.4,31.2v35.9H399V859 c0-7.6-0.1-17.4-10.6-17.4c-10.6,0-12.2,8.3-12.2,16.8v32.4h-20.3V825.3z" />
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.6 KiB

View File

@ -55,24 +55,24 @@ div#kc-registration span a:hover {
font-size: 18px; font-size: 18px;
} }
#social-linkedin-openid-connect::before { /*#social-linkedin-openid-connect::before {*/
content: url('data:image/svg+xml;utf8,<svg height="60px" width="60px" version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 291.319 291.319" xml:space="preserve"><g><path style="fill:#0E76A8;" d="M145.659,0c80.45,0,145.66,65.219,145.66,145.66s-65.21,145.659-145.66,145.659S0,226.1,0,145.66 S65.21,0,145.659,0z"></path><path style="fill:#FFFFFF;" d="M82.079,200.136h27.275v-90.91H82.079V200.136z M188.338,106.077 c-13.237,0-25.081,4.834-33.483,15.504v-12.654H127.48v91.21h27.375v-49.324c0-10.424,9.55-20.593,21.512-20.593 s14.912,10.169,14.912,20.338v49.57h27.275v-51.6C218.553,112.686,201.584,106.077,188.338,106.077z M95.589,100.141 c7.538,0,13.656-6.118,13.656-13.656S103.127,72.83,95.589,72.83s-13.656,6.118-13.656,13.656S88.051,100.141,95.589,100.141z"></path></g></svg>'); /* content: url('data:image/svg+xml;utf8,<svg height="60px" width="60px" version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 291.319 291.319" xml:space="preserve"><g><path style="fill:#0E76A8;" d="M145.659,0c80.45,0,145.66,65.219,145.66,145.66s-65.21,145.659-145.66,145.659S0,226.1,0,145.66 S65.21,0,145.659,0z"></path><path style="fill:#FFFFFF;" d="M82.079,200.136h27.275v-90.91H82.079V200.136z M188.338,106.077 c-13.237,0-25.081,4.834-33.483,15.504v-12.654H127.48v91.21h27.375v-49.324c0-10.424,9.55-20.593,21.512-20.593 s14.912,10.169,14.912,20.338v49.57h27.275v-51.6C218.553,112.686,201.584,106.077,188.338,106.077z M95.589,100.141 c7.538,0,13.656-6.118,13.656-13.656S103.127,72.83,95.589,72.83s-13.656,6.118-13.656,13.656S88.051,100.141,95.589,100.141z"></path></g></svg>');*/
display: inline-block; /* display: inline-block;*/
width: 60px; /* width: 60px;*/
height: 60px; /* height: 60px;*/
vertical-align: middle; /* vertical-align: middle;*/
} /*}*/
.kc-social-provider-name { /*.kc-social-provider-name {*/
visibility: hidden; /* visibility: hidden;*/
position: relative; /* position: relative;*/
} /*}*/
.kc-social-provider-name::after { /*.kc-social-provider-name::after {*/
content: 'Sign in with LinkedIn'; /* content: 'Sign in with LinkedIn';*/
visibility: visible; /* visibility: visible;*/
position: absolute; /* position: absolute;*/
top: 0; /* top: 0;*/
left: 0; /* left: 0;*/
} /*}*/

View File

@ -4,3 +4,20 @@ if (privacyPolicy) {
privacyPolicy.innerHTML = '<span>By signing up you agree to the Helpbuild <a href="https://helpbuild.co/privacy/">Privacy Policy</a></span>' privacyPolicy.innerHTML = '<span>By signing up you agree to the Helpbuild <a href="https://helpbuild.co/privacy/">Privacy Policy</a></span>'
} }
// Get the anchor element
var anchor = document.getElementById('social-linkedin-openid-connect');
// Create an img element for the SVG
var img = document.createElement('img');
img.src = 'linkedin.svg'; // Replace with your SVG file path
img.width = 60;
img.height = 60;
// Insert the img at the beginning of the anchor element
anchor.insertBefore(img, anchor.firstChild);
// Get the span element
var span = anchor.getElementsByClassName('kc-social-provider-name')[0];
// Change the text of the span
span.textContent = 'Sign in with LinkedIn';