this post was submitted on 14 Jun 2023
1 points (100.0% liked)

Kbin Userstyles and Userscripts

15 readers
1 users here now

Custom CSS and JS to help improve your Kbin experience! ### Userscripts Greasy Fork ### Stylesheets UserStyles.world ### Userscript managers

founded 1 year ago
1
[Question] Is it possible to change the vote icons using the Magazine panel? (kbin.social)
submitted 1 year ago by [email protected] to c/[email protected]
2 comments fedilink hide all child comments
 

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)?

top 2 comments
sorted by: hot top controversial new old
[โ€“] [email protected] 1 points 1 year ago (1 children)

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: "
    \f024&quot: ;
    font-family: "
    Font Awesome\ 6 Free&quot: ;
    font-weight: 900;
}
[โ€“] [email protected] 1 points 1 year ago

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.