Commutazione automatica schema colori modalità scura

Ora puoi configurare il tuo sito Discourse per cambiare automaticamente lo schema dei colori quando il dispositivo dell’utente è in modalità scura. Per un’anteprima rapida, vai all’istanza try.discourse.org e attiva e disattiva la modalità scura del tuo dispositivo per vedere questa nuova funzionalità in azione. (Questa funzionalità non è abilitata su meta.)

Abilitazione della modalità scura automatica

Per abilitare questa funzionalità sulla tua istanza, puoi selezionare lo schema dei colori per la modalità scura nelle impostazioni del tuo sito:

Una volta impostata questa opzione, puoi ricaricare il tuo sito con un dispositivo in modalità scura e dovresti vedere lo schema dei colori scuri in uso.

Se il logo che funzionava bene con uno schema chiaro non funziona altrettanto bene su uno sfondo scuro, ora puoi caricare alternative nelle nuove impostazioni disponibili nel core.

I file caricati in queste impostazioni sostituiranno l’impostazione regolare con lo stesso nome se: a) l’interruttore automatico per la modalità scura è abilitato e il dispositivo dell’utente è in modalità scura, oppure b) l’utente sta utilizzando un tema scuro (anche se non in modalità scura). I siti che in precedenza utilizzavano https://meta.discourse.org/t/alternative-logos-for-dark-light-themes/88502 possono ora passare all’uso delle impostazioni del sito core e rimuovere quel componente.

Alcuni utenti potrebbero non voler passare automaticamente a uno schema di colori scuri quando il loro browser è in modalità scura. Possono disabilitare questa funzionalità deselezionando l’opzione “Abilita schema colori automatico per la modalità scura” nella schermata Preferenze > Interfaccia:


Selettore dello schema colori scelto dall’utente

Per utilizzare questa funzionalità, devi creare più schemi di colori nel tuo sito e contrassegnarli come selezionabili dagli utenti:

Una volta fatto, gli utenti dovrebbero vedere due menu a tendina nella pagina Preferenze > Interfaccia:

Vedi anche Update themes and plugins to support automatic dark mode

56 Mi Piace

Quando arriverà al canale Beta, potrò testarlo. Tecnicamente, non c’è motivo per cui non dovrebbe funzionare, purché ChromeOS (come Android, iOS, macOS, ecc.) rispetti la query media prefer-color-scheme.

Ho appena provato questa funzione su un Chromebook nel canale Beta. Funziona in una certa misura, ma è ancora grezzo. Sono riuscito a forzare la modalità scura per tutti i contenuti web, inclusi i siti Discourse (ho testato su try.discourse.org). Tuttavia, sembra che non riesca ad alternare i contenuti web quando si passa tra i temi scuro e chiaro del sistema. Inoltre, sperimentando con le impostazioni, mi sono spesso ritrovato in uno stato ibrido, con alcune parti dell’interfaccia in modalità chiara e altre in modalità scura.

Per chi volesse provare questa funzione, vai su chrome://flags, cerca “Dark” e attiva “Modalità scura/chiaro dell’interfaccia di sistema” e “Forza modalità scura per i contenuti web”.

11 Mi Piace

Abbiamo un tema chiaro e uno scuro. Il tema scuro rende tutto come desideriamo, incluse le icone dei tag e gli anteprime degli argomenti. Tuttavia, lo schema colori scuro presenta diversi problemi quando si utilizzano questi componenti aggiuntivi. Mi chiedo solo: perché non è possibile impostare un tema predefinito per la modalità scura automatica, invece di uno schema colori predefinito? Il tema sembra consentire regolazioni molto migliori rispetto allo schema colori.

4 Mi Piace

Immagino tu intenda che ci sono alcuni problemi con la modalità scura nel plugin delle anteprime dei topic? Se faccio clic sul sito nel tuo profilo utente, vedo che alcuni colori al passaggio del mouse sono errati in modalità scura. Forse il plugin delle anteprime dei topic ha bisogno di un piccolo aggiornamento per supportare meglio la modalità scura (c’è una guida per gli sviluppatori di plugin); in tal caso, penso che valga la pena sollevare il problema nel topic di quel plugin.

Non possiamo cambiare tema in tempo reale; i temi possono avere codice JavaScript personalizzato e non è possibile cambiare il codice JavaScript senza ricaricare la pagina.

11 Mi Piace

hm, non lo vedo nell’ultima versione.

2 Mi Piace

Giusto, la casella di controllo viene visualizzata solo se è disponibile un unico schema scuro. Abbiamo recentemente introdotto gli schemi compatibili con WCAG, il che modifica l’interfaccia in due menu a tendina come quelli che vedi sotto ‘Color Schemes’ nella tua immagine.

Gli utenti che desiderano disattivare la modalità scura automatica possono fare clic sul menu a tendina ‘Dark Mode’ e impostarlo su “Same as Regular”.

9 Mi Piace

È possibile che questa casella sia deselezionata per impostazione predefinita? La maggior parte dei membri della nostra comunità non è abituata a navigare sul sito in modalità scura. Alcuni utenti preferirebbero comunque avere l’opzione della modalità scura automatica.

7 Mi Piace

È ancora il modo migliore per testare questa funzionalità? Non vedo alcun cambiamento nel tema su try quando visito il sito dal mio Chromebook e attivo/disattivo la modalità scura. Anche aggiornare la pagina web non produce alcun effetto. Sto usando l’ultima versione di ChromeOS. Ho anche provato a creare un account di test e ho fatto la stessa cosa, ma senza alcun cambiamento.

Ho anche dato un’occhiata ad altri siti che utilizzo, inclusi quelli self-hosted e Teams, ma non riesco a far cambiare automaticamente il tema in base all’impostazione della modalità scura del mio dispositivo.

PS: mi piace molto la funzione di registrazione dello schermo su ChromeOS. Davvero fantastica! :heart_eyes:

4 Mi Piace

Quindi funziona su Windows e iOS, ma non su ChromeOS? È questo che mostrano i test? A me sembra che ChromeOS abbia forse bisogno di un aggiornamento o non lo gestisca esattamente come tutti gli altri? Qualche pensiero, @pmusaraj?

7 Mi Piace

Sì, questo è decisamente un problema di ChromeOS; funziona correttamente su tutti i sistemi operativi che supportano la modalità scura, ovvero macOS, Windows, iOS, Android e diverse distribuzioni Linux. Non c’è davvero nulla che possiamo fare in questo caso.

11 Mi Piace

Potrebbe essere abilitata ora?

3 Mi Piace

Hmm, buon punto, come possiamo testare questo su Meta, @pmusaraj? Ho attivato la ‘modalità scura’ per le app su Windows 10 e vedo che Twitter (web/Chrome) diventa scuro, ma Meta no?

2 Mi Piace

Sì, questo non è ancora abilitato su Meta perché abbiamo molti temi attivi qui, ognuno progettato per funzionare con una specifica combinazione di colori. Inoltre, abbiamo il selettore di temi nel menu hamburger, che non si integra bene con le combinazioni di colori.

5 Mi Piace

Ah, capisco. Funziona con un’installazione predefinita di Discourse? Posso farlo funzionare con https://discourse.codinghorror.com/?

4 Mi Piace

Sì, funziona con un’installazione predefinita. Funziona, ad esempio, su https://try.discourse.org.

Su https://discourse.codinghorror.com/ potrebbe essere necessario attivare l’impostazione (di default è impostata su Nessuno):

2 Mi Piace

Ah, capisco. La mia installazione è piuttosto vecchia e aveva solo un tema di colori, quello chiaro. Ho aggiunto un nuovo tema basato su quello scuro predefinito e ha funzionato: posso confermare che cambiare i temi scuro e chiaro nelle Impostazioni di Windows influisce automaticamente anche su Discourse ora! :tada:

Ma funziona così subito dopo una nuova installazione di Discourse? Spero di sì?

4 Mi Piace

Sì, sono stati aggiunti alcuni schemi di colori predefiniti (Chiaro, Scuro, WCAG Chiaro, WCAG Scuro). L’impostazione è comunque disattivata di default; i nuovi amministratori devono trovarla per attivarla.

4 Mi Piace

Dovremmo forse fissare come obiettivo avere quella impostazione attiva di default in questa release? Finché pubblichiamo i loghi predefiniti nella versione scura, dovrebbe andare bene?

6 Mi Piace

Questa funzionalità è così utile, grazie per averla inclusa nel core.

Ho preparato un GIF per dimostrarlo su Windows. Discourse cambia istantaneamente, più velocemente dello stesso sistema operativo :+1:

Ulteriori dettagli qui sulla mia istanza se interessati.

https://forums.chalk.sg/t/prefer-a-dark-theme-try-out-dark-mode/110/2

9 Mi Piace

:clap: Ora posso leggere il doppio. :laughing:

7 Mi Piace