Cambia lo stile di un post wiki

Una breve guida per cambiare lo stile dei tuoi post wiki:

Cambia il colore di sfondo:

Nel tuo /admin/customize/themes aggiungi questo CSS sotto Common > CSS

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

Cambia la dimensione del testo

Se vuoi, puoi anche cambiare il font utilizzato o la dimensione del testo, persino il colore

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

Aggiungi testo

Puoi aggiungere un testo per chiarire agli utenti che ciò che stanno visualizzando è un post wiki

.post-info.edits .wiki::before {
  content: "MODIFICA QUESTO POST WIKI";
  color: green;
  background-color: #d2e2d2;
  margin-right: 3px;
  font-weight: bold;
  border: 1px solid green;
  padding: 3px;
}


Questo documento è controllato tramite versione - suggerisci modifiche su github.

22 Mi Piace

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 Mi Piace

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 Mi Piace

Is there a way to make background conditional on light and dark theme? Appreciate your response

1 Mi Piace

The simplest thing to do is create two different theme components, one for the Light theme and one for the Dark theme so you don’t need to write any more CSS

2 Mi Piace

For Wiki customisations to work well in Private Messages with the new changes, I suggest a slight tweak to the CSS so that it targets .cooked:

// customises wiki posts
.wiki .topic-body .cooked {
    background-color: #e8f9fd;
    animation: none;
}
.post-info.edits .wiki::before {
    content: "Wiki Post";
    margin-right: 5px;
    font-weight: bold;
}

I’ll pop this in the OP too.


Later…
And for the hell of it I turned it into the Theme Component with the ability to customise the background color and the text.

2 Mi Piace