Estilo a los grupos de usuarios xenforo 2

Nullz Seguir

Beta
Verificación en dos pasos activada
Verificado por Whatsapp
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
30 Oct 2023
Mensajes
40
Hola amigos, aqui les dejo un pequeño tutorial para colocar estilo a los grupos de usuarios

Ir a extra.less y colocar el siguiente codigo

CSS:
.admin {
    display: inline-block;
    text-align: center;
    font-size: .7em;
    padding: .5em 0em;
    font-weight: 500;
    color: #fff;
    background: #ff0000;
    text-transform: uppercase;
    border: none;
    position: relative;
    overflow: hidden;
}

.admin:before {
    content: "";
    position: absolute;
    background: linear-gradient(135deg, transparent 0%, transparent 30%, rgba(250,250,250,0.7) 50%, transparent 70%, transparent 100%);
    background-repeat: no-repeat;
    top: 0px;
    left: -80%;
    width: 100%;
    height: 100%;
    animation: light 2s infinite;
}
@keyframes light {
    0% {
        left: -80%;
    }
    100% {
        left: 80%;
    }
}

Luego ir al grupo de usuario(en mi caso colocare al grupo administrador) y escoger la opcion "Otro, utilizando nombre de la clase personal de CSS"

1699655364853.png


Resultado lo verán de la siguiente forma

1699655585895.gif


Saludos
 

TemasWP360

Curioso
Verificación en dos pasos desactivada
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
11 Ene 2020
Mensajes
9
Genial amigo, disculpa ¿Cómo puedo poner una insignia en título del grupo?
 

lasser

Alfa
Verificación en dos pasos desactivada
Verificado por Whatsapp
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
19 Nov 2023
Mensajes
14
Por favor, ten en cuenta 📝 que si deseas hacer un trato 🤝 con este usuario, está baneado 🔒.
Hola amigos, aqui les dejo un pequeño tutorial para colocar estilo a los grupos de usuarios

Ir a extra.less y colocar el siguiente codigo

CSS:
.admin {
    display: inline-block;
    text-align: center;
    font-size: .7em;
    padding: .5em 0em;
    font-weight: 500;
    color: #fff;
    background: #ff0000;
    text-transform: uppercase;
    border: none;
    position: relative;
    overflow: hidden;
}

.admin:before {
    content: "";
    position: absolute;
    background: linear-gradient(135deg, transparent 0%, transparent 30%, rgba(250,250,250,0.7) 50%, transparent 70%, transparent 100%);
    background-repeat: no-repeat;
    top: 0px;
    left: -80%;
    width: 100%;
    height: 100%;
    animation: light 2s infinite;
}
@keyframes light {
    0% {
        left: -80%;
    }
    100% {
        left: 80%;
    }
}

Luego ir al grupo de usuario(en mi caso colocare al grupo administrador) y escoger la opcion "Otro, utilizando nombre de la clase personal de CSS"

Ver el archivo adjunto 1134301

Resultado lo verán de la siguiente forma

Ver el archivo adjunto 1134302

Saludos
muy cool, me lo guardo
 

¡Regístrate y comienza a ganar!

Beneficios

  • Gana dinero por participar
  • Gana dinero por recomendarnos
  • Descubre ofertas de empleo diariamente
  • Negocios seguros
  • ¡Información premium y más!

Acceder

¿Ya tienes una cuenta? Accede aquí

Arriba