Textmarker Composer Button

	Zusammenfassung	Ein Text-Hervorhebungs-Button für die Discourse-Composer-Symbolleiste
	Vorschau	Video-Demo
	Repository	GitHub - denvergeeks/discourse-highlight-wrap-theme-component: A Text Highlighter Button for the Discourse Composer Toolbar
	Installationsanleitung	So installieren Sie ein Theme oder eine Theme-Komponente
	Neu bei Discourse Themes?	Anfängerleitfaden zur Verwendung von Discourse Themes

Der Button sieht aus wie ein Textmarker… Er dient dem sehr spezifischen und begrenzten Zweck, auf einen Button in der Composer-Symbolleiste zu klicken, um <mark>dies</mark> einzufügen.

Strg-H ist die Tastenkombination, die Sie anstelle des Klickens auf den Button verwenden können.

In den Einstellungen können Sie sowohl die Hintergrundfarbe (Hervorhebung) als auch die Farbe des Textes in den hervorgehobenen Abschnitten überschreiben.

discourse-highlighter-tc-settings1542×872 53.2 KB

Vielen Dank an @pfaffman und @merefield und @Lilly und @JammyDodger und @Canapin für ihre Hilfe dabei!

Das ist erstaunlich. Gut gemacht

Das ist sehr schön.

Wo ist .d-wrap definiert?
Es wird bei mir mit dieser Farbe im Standardthema angezeigt… ich hätte es gerne als Hervorhebungsfarbe wie in Ihrem Video, danke

Es scheint, dass die Farbvariable --highlight-medium in der Palette, die Sie für dieses Thema verwenden, falsch eingestellt ist.

Hier ist, wie eine meiner Paletten aussieht:

color_palette893×721 89.7 KB

Diese Komponente verwendet den mittleren Farbton der Hervorhebungsfarbe. Sie können den genauen Farbton in Ihrem Styleguide sehen, wenn Sie ihn in den Admin-Einstellungen (styleguide enabled oder styleguide admin only) aktiviert haben. Der Styleguide für die Farben des Themas befindet sich unter /styleguide/atoms/colors.

Vielleicht wäre es tatsächlich eine gute Idee, einen PR oder einen Vorschlag für eine Überschreibung der Hervorhebungsfarbe einzureichen.

Ja, ich dachte, es wäre besser, eine Einstellung dafür zu haben.

Füge jetzt eine Einstellung hinzu… bin gleich zurück

Wäre die Verwendung von <mark>mark</mark> erwartungsgemäßer? Ich denke, das verwendet die „Hervorhebungsfarbe“ in der Farbpalette.

<mark>mark</mark>

OK, ich habe dort eine Einstellung vorgenommen, die standardmäßig auf #ff8 gesetzt wird.

Haha, ich wollte dir gerade einen PR schicken

Schön, gerade gezogen, es funktioniert super!

Hallo @denvergeeks

Hier ist, wie sich Ihr Stil (mit Standardeinstellungen) von mark unterscheidet (das eine Discourse-Farbvariable verwendet, wodurch es lesbar ist, welche Farbschema Sie auch wählen):

image191×125 6.78 KB

Bei einem dunklen Thema:

image185×123 6.79 KB

Perfekt @Canapin, ich werde das einarbeiten!

Oder, wenn jemand das QPR möchte, lasst es mich wissen, da ich es heute vielleicht nicht schaffe.

OK, dies verwendet jetzt den Vorschlag von @Canapin, die integrierte mark-Markierung und die entsprechenden CSS-Standardeinstellungen zu verwenden.

Außerdem bietet es jetzt Einstellungen, um sowohl die Hintergrundfarbe des Hervorhebungsstifts als auch die Farbe des Textes in den hervorgehobenen Bereichen zu überschreiben. Dank @Lilly für das bedingte CSS.

Ich versuche, einen JSON-Farbauswähler zu erstellen, aber er funktioniert nicht. Ich bekomme nur ein leeres Popup mit einem Speicher-Button.
Vielleicht sehe ich mal, ob ein JavaScript-basierter irgendwie möglich ist. Die Farbpalette und die Badge-Oberfläche haben Farbauswähler-JS-Funktionen, aber funktionieren vielleicht nur mit einem Plugin.

Bei mir sind diese Einstellungen keine Overrides. Diese müssen ausgefüllt werden, sonst tut es nichts.

Und… ich bin beim Standard-Theme und wegen mangelnden Morgenkaffees bin ich im Slow-Mode – ich habe nicht geprüft, ob das vom Theme selbst kommt.

Edit: nein, Theme oder Farbschema spielen keine Rolle. Also, folgt es dem Farbschema und ist ein Override, oder ist es eine zwingende Einstellung?

Versuchen Sie, die Komponente zu aktualisieren und die Seite neu zu laden. Ich kann den Fehler nicht reproduzieren.

Wird das \u003cmark\u003e\u003c/mark\u003e-Tag eingefügt?

Ich habe es zuerst aktualisiert, bevor ich es versucht habe. Und nein, es verwendet Wrap. Bin ich also ein bisschen im Rückstand?

Die JSON-Einstellung für die Farbauswahl (in einem Theme/Komponente) funktioniert bei Discourse tatsächlich nicht.
Ich denke, es wäre eine gute Praxis, generell Discourse-Farbvariablen zu verwenden, anstatt willkürliche Farben in einem Theme oder einer Komponente auszuwählen, die sich je nach den anderen von den Benutzern gewählten Themes und Farben nicht gut einfügen.

Ein Benutzer hat vor einiger Zeit eine Farbauswahl für den Composer erstellt, aber ich bin mir nicht sicher, ob der Code veröffentlicht wurde: