How to change navbar social icons
ljsinclair opened this issue · comments
I'm having difficulty working out how to change the navbar social icons.
Changing the class is simple, based around looking for a replacement icon here: https://dropways.github.io/feathericons/
I've also taken a look at the github repo here: https://github.com/feathericons/feather
But changing the class appears to have no effect on the icon. I think it's actually generated using the path variable.
Is there a way to determine the path variable for a custom icon?
You can find them in declared in templates/macros/header.html.
And you are right, they have a path defined.
It's because a full svg is embedded in AdiDoks header.
To change it you have to change a whole svg to one from https://github.com/feathericons/feather (or any other).
I've found something like this in my config.toml:
[[extra.menu.social]]
name = "GitLab"
pre = '<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-gitlab"><path d="M 22.145523,13.259115 21.007995,9.9638542 18.74694,3.4356121 c -0.116489,-0.3297092 -0.619371,-0.3297092 -0.735861,0 l -2.261055,6.526044 H 8.2507335 L 5.9896794,3.4370775 c -0.1164901,-0.3297092 -0.6231904,-0.3297092 -0.7358611,0 L 2.992764,9.9616561 1.852052,13.258748 c -0.1024858,0.293075 0.013368,0.622784 0.2819952,0.824273 l 9.8666498,6.731563 9.86665,-6.731563 c 0.267991,-0.183171 0.384481,-0.512881 0.278176,-0.824273 z"></path></svg>'
url = "https://gitlab.com/your-docs"
weight = 10
The ultimate issue is regarding the <path= code and how to go about finding what this is rather than just loading the icons in the <head> and inserting them with <span class= or related code.
The current method presumably makes the site load a little faster, but makes changes harder.