Pulsante Evidenziatore Compositore

	Riepilogo	Un pulsante Evidenziatore per la barra degli strumenti del compositore di Discourse
	Anteprima	Demo Video
	Repository	GitHub - denvergeeks/discourse-highlight-wrap-theme-component: A Text Highlighter Button for the Discourse Composer Toolbar
	Guida all’installazione	Come installare un tema o un componente tematico
	Nuovo ai temi di Discourse?	Guida per principianti all’uso dei temi di Discourse

Il pulsante assomiglia a una penna evidenziatrice… Serve allo scopo molto specifico e limitato di fare clic su un pulsante nella barra degli strumenti del compositore per inserire <mark>questo</mark>.

Ctrl-H è la scorciatoia da tastiera che puoi usare invece di fare clic sul pulsante.

Nelle impostazioni puoi sovrascrivere sia il colore di sfondo dell’Evidenziatore sia il colore del testo nelle porzioni evidenziate.

discourse-highlighter-tc-settings1542×872 53.2 KB

Molti ringraziamenti a @pfaffman e @merefield e @Lilly e @JammyDodger e @Canapin per l’aiuto!

Fantastico. Ben fatto

questo è molto bello.

dove è definito .d-wrap?
sul mio appare di questo colore con il tema predefinito… vorrei averlo del colore dell’evidenziatore come nel tuo video, grazie

Sembra che sia l’impostazione della variabile di colore --highlight-medium nella palette che stai utilizzando per quel tema

Ecco come appare una delle mie palette:

color_palette893×721 89.7 KB

Questo componente utilizza la tonalità media del colore di evidenziazione. Puoi vedere quello esatto nella tua guida di stile se l’hai abilitata in admin-settings-(styleguide enabled or styleguide admin only) la guida di stile per i colori del tema si trova su /styleguide/atoms/colors

Potrebbe valere la pena inviare una PR o un suggerimento per un’override del colore dell’evidenziatore.

Sì, stavo pensando, è meglio avere un’impostazione per questo

Aggiungo un’impostazione ora… torno subito

Usare <mark>mark</mark> sarebbe più appropriato? Penso che utilizzi il colore ‘evidenziazione’ nella palette dei colori.

<mark>mark</mark>

OK, ho impostato un’opzione per utilizzare #ff8 per impostazione predefinita.

Ah, stavo per inviarti una PR

Ottimo, l’ho appena scaricato, funziona alla grande!

Ciao @denvergeeks

Ecco come il tuo stile differisce (con le impostazioni predefinite) da <mark> (che utilizza una variabile di colore di Discourse, rendendolo leggibile indipendentemente dallo schema di colori scelto):

image191×125 6.78 KB

Su un tema scuro:

image185×123 6.79 KB

Perfetto @Canapin, lo includerò!

Oppure, se qualcuno vuole fare una QPR (Revisione della Qualità del Prodotto), fammelo sapere perché potrei non riuscire a farlo oggi.

OK, questo ora utilizza il suggerimento di @Canapin per utilizzare il \u003cmark\u003e integrato e le impostazioni predefinite CSS corrispondenti.

Inoltre, ora fornisce impostazioni per sovrascrivere sia il colore di sfondo (Highlighter) sia il colore del testo nelle porzioni evidenziate. Grazie a @Lilly per quel CSS condizionale.

Sto cercando di creare un selettore di colori json ma non funziona. Ottengo solo una finestra vuota con un pulsante di salvataggio.
Forse vedrò se uno javascript è possibile in qualche modo. La palette di colori e l’interfaccia del badge hanno funzioni javascript per il selettore di colori, ma potrebbero funzionare solo con un plugin.

Per me quelle impostazioni non sono override. Devono essere compilate, altrimenti non fa nulla.

E… sono sul tema predefinito e a causa della mancanza di caffè mattutino sono in modalità lenta — non ho controllato se questo deriva dal tema stesso.

Modifica: no, il tema o lo schema di colori non giocano alcun ruolo. Quindi, seguirà lo schema di colori e sarà un override, o è un’impostazione obbligatoria?

Prova ad aggiornare il componente e ricarica la pagina. Non riesco a riprodurre l’errore.

Sta inserendo il tag <mark></mark>?

L’ho aggiornato prima di provare. E no, usa wrap. Quindi sono un po’ indietro?

L’impostazione JSON del selettore di colori (in un tema/componente) non funziona su Discourse, in effetti.
Penso che una buona pratica sarebbe usare in generale le variabili di colore di Discourse invece di scegliere colori arbitrari in un tema o componente che non si fonderanno bene a seconda degli altri temi e colori scelti dagli utenti.

Un utente ha creato un selettore di colori per il composer tempo fa, ma non sono sicuro che il codice sia stato rilasciato: