[Question] Is it possible to change the vote icons using the Magazine panel?

I would like to replace the upvote and downvote icons in my magazine. Adding these CSS rules with the developer tools of my browser does exactly what I want:

.fa-arrow-up:before
{

content: "any fontawesome glyph";

}

.fa-arrow-down:before
{

content: "any fontawesome brand glyph";

    font-family: Font Awesome\ 6 Brands;
    font-weight: 400;
}

However, when I add this to the CSS section of the Magazine panel, the " symbols get replaced with ", breaking the vote icons entirely. Are there any other ways to change the vote icons using the Magazine panel (preferably without using JS)?

2 Comments

artillect@kbin.social · 1 pts · 3y (1 reply)

There seems to be something wrong with the way that the CSS is getting parsed, if I add this rule:

.fa-arrow-down:before
{
    content: "\f024";
    font-family: "Font Awesome\ 6 Free";
    font-weight: 900;
}

It gets converted to this

.fa-arrow-down:before {
    content: &quot;
    \f024&quot: ;
    font-family: &quot;
    Font Awesome\ 6 Free&quot: ;
    font-weight: 900;
}

mkulko@kbin.social · 1 pts · 3y

Yup, I'm facing this exact same problem. I guess I need to open an issue on https://codeberg.org/Kbin/kbin-core regarding this.