Como adicionar placas de cargos estilo ForoBeta em um fórum PhpBb?

[ExTaZzY]

Hola chicos tengo un foro en PhpBb, y la verdad me ha gustado mucho su placas qué tienen acá, pero me he dado cuenta que están hecho a base de css, habrá alguna forma de implementarlo en un foro phpbb qué por lo normal solo se puede subir imagenes a los rangos.

Gracias.

 

[devcodep]

claro que se puede....

 

[jhonbobi]

me uno a la pregunta xomo se puede hacer

 

[Baires23]

Te comparto el codigo utilizado para hacer los rangos.

https://codepen.io/Baires23web/pen/rNNrdYr

 

[jhonbobi]

Te comparto el codigo utilizado para hacer los rangos.

https://codepen.io/Baires23web/pen/rNNrdYr

gracia procedo a revisarlo

 

[jhonbobi]

Te comparto el codigo utilizado para hacer los rangos.

https://codepen.io/Baires23web/pen/rNNrdYr

y como subo el codigo al mi foro amigo

 

[Baires23]

y como subo el codigo al mi foro amigo

Esto se hace con un plugin, y despues quedaria editar la muestra de los rangos y ese es el codigo de "ESTILO CSS "

 

[jhonbobi]

Esto se hace con un plugin, y despues quedaria editar la muestra de los rangos y ese es el codigo de "ESTILO CSS "

cual es el plugin

 

[mrsrz]

Hay otras opciones para jugar, creo que utilizar el diseño de los rangos del foro es algo moralmente incorrecto, y por supuesto te estarías limitando a algo que ya esta establecido, en fin, si es de tu gusto, mandame Mp y te proporciono otros diseños, siguiendo la misma base e idea de los que ya quieres (esto es completamente opcional)

 

[Usuario eliminado 202885]

Cómo se cambia el color 🙄

 

[EricK Bueno]

Interesante aporte @tavostrog, gracias.

 

[Inamsay]

Cómo se cambia el color 🙄

Lo puedes cambiar en todo lo que diga background-color: ESTO

 

[Usuario eliminado 202885]

Muchas gracias, lo encontré... Se podrá cambiar el diseño o la forma?

 

[ExTaZzY]

Muchas gracias, lo encontré... Se podrá cambiar el diseño o la forma?

Claro solo es modificar el css a tu gusto

 

[Baires23]

Te comparto el codigo utilizado para hacer los rangos.

https://codepen.io/Baires23web/pen/rNNrdYr

Si necesitan ayuda con esto envien mp.

 

[MarkBurns]

Lo mejor es hacer algo típico de component system design y scss.

La placa siempre tendra el mismo tamaño pero distintos colores.

por ejemplo:

<div class=“button button—red”>Admin</div>

en este caso el scss seria asi:

.button {
    width: 50px;
    height: 30px;
  
    &—red {
        background-color: red;
    }
  
    &—blue {
        background-color: blue;
    }
}

Si no usas SCSS, el CSS seria asi:

.button {
    width: 50px;
    height: 30px;
}
.button--red {
    background-color: red;
}
.button--blue {
    background-color: blue;
}

En la declaración de class name siempre añadirás “button” y en los distintos rangos añades “button—red” o “button—blue” o lo que sea.

 

[Makonde]

Te comparto el codigo utilizado para hacer los rangos.

https://codepen.io/Baires23web/pen/rNNrdYr

Muchas gracias por el aporte 😉