Ícono de ojo para moderadores

Hola,

Soy yo de nuevo.

Creé una cuenta llamada Watchdog, le otorgué derechos de moderador, luego creé un distintivo y lo llamé moderadores (puse el icono de ojo en la configuración). Otorgué el distintivo de moderadores a Watchdoggo y cuando doggo publica, aparecen el escudo y el icono de ojo.

Lo que aparece es un escudo, aunque el distintivo otorgado tiene un ojo en la configuración.

¿Cómo puedo eliminar el icono del escudo?

Primero, crea un nuevo grupo “watchdog” y agrega al usuario Watchdog, haciéndolo su grupo principal. Luego

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

El usuario ya está en el grupo “Moderators”, no creo que sea necesario crear otro grupo. He cambiado el código a

.group-moderators

pero no funciona, el icono sigue ahí.

Encontré el CSS responsable de ese icono; sin embargo, al aplicar display: none, el icono, por supuesto, desapareció, pero dejó un espacio en medio y me gustaría eliminar ese espacio (flecha amarilla).

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

¿Alguna sugerencia sobre cómo puedo eliminar ese espacio?

O, ¿cómo puedo sustituir el icono del escudo por un icono de ojo usando CSS? Porque la clase responsable del icono del escudo no está en el CSS, sino incrustada en el HTML.

¿Qué hay de esto?

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

No conozco el HTML de tu icono de ojo, así que podría haber algún efecto colateral…

Además, puedes probar este método; funcionó para @Nisutec:

Correcto. Si quieres eliminarlo para todos los moderadores, group-moderators no es una clase; es simplemente moderator. Pero entonces no necesitas especificar moderator, basta con:

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

El espacio probablemente se debe a:

.names span {
    margin-right: 8px;
}

Así que:

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

Esto funcionó perfectamente y eliminó el espacio. Muchas gracias.