Eye icon for moderators

[pr0cesor]

Hi,

Its me again.

I created an account and called it Watchdog, I granted him mod rights, then I created a badge and named it moderators (I put the eye icon in the settings). I granted badge moderators to Watchdoggo and when doggo is posting, the shield and the eye icon appear.

What appears is a shield although granted badge has eye in settings.

How can I remove the shield icon?

[smrtey]

First make a new group “watchdog” and add the user Watchdog and make it their primary group. Then

.group-watchdog .d-icon-shield-alt {
    display: none;
}

[pr0cesor]

@smrtey

First make a new group “watchdog” and add the user Watchdog and make it their primary group.

The user is in the group “Moderators” already, I don’t think it’s necessary to create another group. I changed the code to

.group-moderators

but does not work, the icon is still there

[pr0cesor]

I found the css responsible for that icon, however when applied display:none to it, the icon of course disappeared, but it left a gap in between and I would like to remove that gap (yellow arrow).

.svg-icon-title svg.fa.d-icon.d-icon-shield-alt.svg-icon.svg-node {
display: none;}

Any tip how can I remove the gap?

Or how can I substitute the shield icon with an eye icon using CSS? because the class responsible for the shield icon is not in CSS it’s embedded in HTML

[Canapin (Coin-coin le Canapin)]

What about this?

.moderator .svg-icon-title {
    display: none;
}

I don’t know about your eye icon HTML so there may be some collateral effect…

[Canapin (Coin-coin le Canapin)]

Also, you can try this way, it worked for @Nisutec:

How i can change the Staff Icon

This it not how it works. $shield-alt-duotone is a variable meant to be used in your custom CSS. The first topic I linked earlier explains how to replace icons with new ones with an SVG file:

[smrtey]

@Canapin

What about this?

.moderator .svg-icon-title {
    display: none;
}

I don’t know about your eye icon HTML so there may be some collateral effect…

Correct. If you want to remove it for all moderators, group-moderators is not a class, it’s just moderator. But then you don’t need moderator, just

.d-icon-shield-alt {
    display: none;
}

The gap is probably

.names span {
    margin-right: 8px;

So

.moderator .names span {
    margin-right: 0;
}

[pr0cesor]

@Canapin

What about this?

.moderator .svg-icon-title {
    display: none;
}

This worked perfectly, and removed the gap. Thank you very much.