Cambiar el estilo de una publicación de wiki

Una guía rápida para cambiar el estilo de tus publicaciones wiki:

Cambiar el color de fondo:

En tu /admin/customize/themes añade este CSS bajo Common > CSS

.wiki .topic-body .cooked {
  background-color: #dcffdc; /*verde claro*/
}

Cambiar el tamaño del texto

Si quieres, también puedes cambiar la fuente utilizada o el tamaño del texto, incluso el color

.wiki .topic-body .cooked p {
  font-size: 18px;
  color: green;
}

Añadir texto

Puedes añadir un texto para dejar claro a los usuarios que lo que están viendo es una publicación wiki

.post-info.edits .wiki::before {
  content: "EDITA ESTA PUBLICACIÓN WIKI";
  color: green;
  background-color: #d2e2d2;
  margin-right: 3px;
  font-weight: bold;
  border: 1px solid green;
  padding: 3px;
}


Este documento está controlado por versiones: sugiere cambios en github.

22 Me gusta

Hey, we just changed the background color of wikis on the Fairphone forum, but like all other posts each wiki starts out as staff-blue when you load it, then slowly turns white and only then turns green.
Is there a way to disable this animation for wiki posts?

I believe this should do the trick:

.wiki .topic-body {animation: none;}

6 Me gusta

Here’s a Theme Component which makes Wikified posts pale green again, and incorporates @Kris’s animation: none tweak. (I chose an essentially random pale green as I did this surreptitiously while I was supposed to be paying attention in a meeting. But you can change the RGB value in the Theme Component CSS after installation)

Improvements always welcome by pull request.

4 Me gusta

¿Existe alguna forma de hacer que el fondo sea condicional según el tema claro u oscuro? Agradezco tu respuesta.

1 me gusta

Lo más sencillo es crear dos componentes de tema diferentes: uno para el tema claro y otro para el tema oscuro, de modo que no necesites escribir más CSS.

2 Me gusta

Para que las personalizaciones del Wiki funcionen bien en Mensajes Privados con los nuevos cambios, sugiero un pequeño ajuste en el CSS para que apunte a .cooked:

// personaliza las publicaciones del Wiki
.wiki .topic-body .cooked {
    background-color: #e8f9fd;
    animation: none;
}
.post-info.edits .wiki::before {
    content: "Publicación del Wiki";
    margin-right: 5px;
    font-weight: bold;
}

También lo incluiré en la primera publicación (OP).


Más tarde…
Y por diversión, lo convertí en un Componente de Tema con la capacidad de personalizar el color de fondo y el texto.

2 Me gusta