Jieiku / abridge

Fast & Lightweight Zola Theme
https://abridge.pages.dev/
MIT License
168 stars 45 forks source link

How to add/edit icon svgs? #107

Closed ddogfoodd closed 1 year ago

ddogfoodd commented 1 year ago

What are the steps to add or replace icon svgs?

For example I wanted to replace the included codeberg svg which doesn't contain color with this one containing color

Jieiku commented 1 year ago

Here is the commit where I added both the codeberg and discord icons, looking at this commit should show exactly what is required to add or change an icon:

https://github.com/Jieiku/abridge/commit/7207c18e0a5b751c4580c6a6ccb9f1f605974604

If all you want to do is change the color of the existing icon then you would just change the colors 555 and aaa to whatever color code you want on line 83 in the icons file:

https://github.com/Jieiku/abridge/blob/75bb461162f7644a498101bc121faac3cfee7799/sass/include/_icons.scss#L83

At the top of this icons file there is a comment block that contains links to 3 of the tools that I use to either create or compress svg icons, and also a link that shows how to convert an svg icon to css format.

ddogfoodd commented 1 year ago

Thanks for the great explanation