Wikifizierte Beitragskomponente

Simple Description

This theme component enables you to make Wiki posts (and Shared Edits posts) more obvious.

Wikis and Shared Edits are a powerful feature of Discourse, but many users are unfamiliar with the concept and find the UI just a bit too subtle. This component makes it crystal clear, packaging the content from Change the style of a wiki post.

Screenshots

Detailed Description

Installing this component enables you to control the background colour of Wiki posts, and to add some text to the history/edit icon in the top right of the post.

It is a fork of discourse-wikified-post-background-color by @pacharanero, incorporates stuff from Change the style of a wiki post and re-used code from Personal Message Bubbles by @Rhidian.

Settings

Wiki post background color

The background colour of Wiki posts can be set to whatever you like. It defaults to ‘highlight’, but you can use any of these options:

  1. It works best when a Scheme colour is chosen (i.e. primary, secondary, tertiary, etc), as these are responsive to automatic dark mode.
  2. A named color recognised in CSS (e.g. blue, red, yellow, black, etc)
  3. An HTML color code (e.g. #effbfb, etc)

Shared edits background color

You can choose one of the same color options for Shared Edits posts (see the Shared Edits Plugin)

Wiki added text

This adds the little bit of green text (defaulting to Wiki Post) in the top right corner of the post:

image

This is dynamic, and changes colour along with the history icon if there has been a recent edit (this is an unintended happy thing):

image

If you don’t want any text there, then delete the text in the setting and save it.

Shared edits added text

The text displayed when it is a Shared Edits post. This is in the Danger color from your palate.

image

Roadmap

  1. Auto tag Topics with ‘wiki’

Please make suggestions as replies to this post.

Install this theme component

25 „Gefällt mir“

Lovely stuff @nathank
I’m going to archive the old wikified post background color repo, in favour of this your new version, which adds much more.

4 „Gefällt mir“

Bekommt sonst noch jemand diesen Fehler?

Fehler: Undefinierte Variable: "$Shared-edits-hide". in Zeile 42 von common.scss >> @if ($Shared_edits_hide == "Yes"){ -----^

Ich kann das nicht reproduzieren und sehe keine offensichtlichen Probleme im Code. Können Sie uns weitere Informationen geben?

1 „Gefällt mir“

Das liegt daran, dass ich Shared edits hide auf Nein gesetzt hatte. Der Fehler trat in den TC-Einstellungen auf. Der Fehler ist verschwunden, nachdem ich ihn auf Ja gesetzt hatte.

Ich verstehe es weder mit Nein noch mit Ja in der neuesten Discourse Beta. Bist du auf einer alten Discourse-Version? Ich habe überhaupt keine Versionskontrolle darin vorgenommen, tut mir leid.

1 „Gefällt mir“

Entschuldigung, mein Fehler – war etwas veraltet, ja. Habe vergessen, nach dem letzten Update erneut zu testen, bis Sie es erwähnt haben. Danke. :slight_smile:

1 „Gefällt mir“

Habe die Komponente gerade aktualisiert, um sie besser für Shared Edits-Beiträge zu berücksichtigen.

Dies beinhaltet die Anpassung für die Shared Edits-Änderungen hier:

2 „Gefällt mir“

Ein kleiner Eingriff in die Standard-Hintergrundfarben wurde vorgenommen, da @-Erwähnungen nicht gut sichtbar waren.

Die Hintergrundfarbe für „Shared Edits“ ist jetzt standardmäßig auf tertiary-very-low gesetzt.

1 „Gefällt mir“

Eine exzellente Komponente. Sie verbessert die Sichtbarkeit jedoch nur auf der Themenseite. Ist es möglich, sie so zu modifizieren, dass das Wiki-Symbol auf der Kategorieseite, der Liste der Themen „neueste“, „ungelesen“ usw. angezeigt wird?

Guter Vorschlag, und ich bin sicher, dass es möglich ist (PR willkommen!).

Ich löse das, indem ich Beiträge einfach mit #wiki in meinen Instanzen tagge. Es ist natürlich semi-manuell – Sie können die Wiki-Beiträge / Themen über die erweiterte Suche identifizieren. Es hat den zusätzlichen Vorteil, dass sie über die Navigation in der Seitenleiste leicht auffindbar sind.

Ich dachte, es wäre schön, automatische Tags für Wiki-Beiträge als Teil dieser Komponente zu haben (oder wie Sie vorschlagen), aber es hat mir bisher nicht genug Probleme bereitet, um die Zeit zu investieren, dies auszuprobieren, fürchte ich.

2 „Gefällt mir“

Ich habe dies 2021 hier gefragt: Add an icon in front of wikis in the topic list?

Die Antwort war:

Die Feature request:

1 „Gefällt mir“

Ich suche nach Ratschlägen, wie ich die Hintergrundfarben an den (automatischen) Dunkelmodus anpassen kann.

Die derzeit von mir gewählten hellen, leuchtenden Farben für Hintergründe machen die Beiträge im Dunkelmodus unlesbar.

Könnte es möglich sein, die Farbpalette zu erweitern und einige Farb-Berechnungen durchzuführen, um Hintergrundfarben für Wikis und Pads zu definieren?

Sie könnten Tags verwenden, um “Wiki”-Themen zu markieren.
Tags können, wenn ich mich recht erinnere, mit CSS gestylt werden.
Sie würden den zusätzlichen Vorteil einer Auflistungs-/Detailansicht dafür erhalten.

Zusätzlich könnte mit einem Plugin automatisch ein Wiki-Tag zu Themen hinzugefügt werden, die Wikis enthalten.

Dies ist der Grund, warum ich eine Scheme-Farbe empfehle:

Wenn Sie von Ihren Farben abweichen möchten, müssen Sie einen cleveren Weg finden, um mit dem Dunkelmodus umzugehen.

Eine nette Funktion wäre, auch die Angabe einer Farbe für den Dunkelmodus zu ermöglichen. Ich werde mir das ansehen, wenn ich etwas Freizeit habe.

1 „Gefällt mir“

Sicher. Aber diese Farben sind zu dominant für einen Hintergrund.
Deshalb habe ich von etwas wie 10% Scheme-Farbe gemischt mit 90% Hintergrund geträumt. Ich nehme an, SASS (oder etwas Ähnliches) ist im Frontend nicht verfügbar.
Aber würde etwas CSS-Magie wie diese funktionieren?

Update: rgba(0, 255, 0, 0.1) funktioniert im Dunkel- und Hellmodus ziemlich gut.

SASS-Funktionen sind im Abschnitt „Theme anpassen“ verfügbar, sie werden kompiliert, wenn Sie Ihre Änderungen speichern. Sie können SASS-Funktionen jedoch nicht für Theme- oder CSS-Variablen verwenden.
Wenn Sie eine SASS-Funktion für eine Farbe aus Ihrem Farbschema verwenden möchten, müssen Sie die entsprechende SASS-Variable verwenden.

Funktioniert :white_check_mark:

body {
    background: darken($secondary, 10%);
}

Funktioniert nicht :x:

body {
    background: darken($my_theme_variable, 10%);
}

Funktioniert nicht :x:

body {
    background: darken(var(--secondary), 10%);
}

Und auf dem Papier denke ich, dass das, was Ihr Link beschreibt, funktionieren sollte. :slight_smile:

3 „Gefällt mir“

Vielleicht ist das einen Versuch wert. Hier ist eine Anleitung (zu meiner eigenen Referenz) zur Verwendung der SASS-Funktion mix():