Alternar modo oscuro/claro

Saludos, estimado equipo de Discourse y participantes del foro :raising_hand_man:

Recientemente noté que enlace rápido para abrir el editor de un mensaje personal no es compatible con el componente de tema Dark/Ligt Mode Toggle si estoy usando un teléfono inteligente con el sistema operativo Android instalado. Para ser más precisos, cuando haces clic en el enlace, el compositor de mensajes se abre en una fracción de segundo y se vuelve a cerrar en un borrador. Revisé todos los componentes de tema y complementos y descubrí que el compositor se comporta de esta manera solo con el componente Dark/Ligt Mode Toggle habilitado en Android. Aquí hay un video:

En el video mostré 2 escenarios.

  1. Cuando haces clic en el enlace por primera vez, el compositor se abre rápidamente y en el mismo momento se cierra.
  2. Cuando haces clic en el enlace nuevamente, el compositor se abre desde el borrador guardado y después de eliminar el borrador anterior, el compositor se abre en modo normal.
4 Me gusta

Hola, ¿puedes ayudarme a implementar esto en todo el sitio como administrador? Gracias.

2 Me gusta

Gracias por informar sobre esto, ¡un error bastante extraño e interesante!

3 Me gusta

Muchas gracias por este componente :pray: :slightly_smiling_face:
Acabo de instalarlo y funciona bastante bien en escritorio y Android.

4 Me gusta

Ver captura de pantalla:

Entonces, ¿estás diciendo que la configuración del interruptor no agrega ninguna opción de configuración de interruptor en el frontend y que necesito instalar este complemento, sí?

Si es “no”, ¿dónde encuentro el interruptor ahora que habilité el interruptor claro-oscuro según la captura de pantalla anterior?

Gracias

Así es. Una vez que incluyas este componente temático en tu tema, guarda y actualiza la página, y deberías ver el icono para alternar el modo oscuro/claro. :slight_smile:

3 Me gusta

Parece que ya está instalado. Intenté instalarlo ahora mismo y dijo que ya estaba instalado. Como puedes ver en mi captura de pantalla anterior.

Pero todavía no hay opción de alternancia:
image

¿Quizás no tienes definida ninguna tema oscuro que se pueda alternar?
En ese caso, mira arriba en Dark/Light Mode Toggle.

2 Me gusta

¿Tengo que tener un “tema” aparte? Estoy usando el tema predeterminado. Puedo cambiar al modo oscuro como esto

Sin embargo, el icono de alternancia SÓLO aparece si selecciono “Oscuro” en las preferencias. Me gustaría que incluso los visitantes primerizos vieran el icono de la luna abajo a la izquierda. ¿Es posible?

Edición: resuelto según el final de esta publicación. ¡Todo fue culpa MÍA!

1 me gusta

Hola, estoy buscando establecer el tema Oscuro como predeterminado en mi foro de Discourse. Sin embargo, también quiero dar a los usuarios la opción de cambiar al tema Claro si lo prefieren.

Mi pregunta es: ¿Cómo puedo asegurarme de que el esquema de colores del foro no cambie automáticamente según la configuración del sistema del usuario? Quiero que permanezca en el tema Oscuro por defecto y solo cambie a Claro cuando un usuario lo seleccione manualmente. Cualquier orientación sobre cómo configurar esto sería muy apreciada.
¡Gracias!

Esperaba que con las últimas actualizaciones de Discourse este error desapareciera, pero todavía persiste.

3 Me gusta

Al configurar todo, si tengo el modo claro activado, cada vez que actualizo la página, siempre aparece el modo oscuro. En cada actualización, ¿cómo puedo detener esto? @jordan.vidrine

2 Me gusta

¿Podrías indicarme todos los pasos que sigues para tu configuración?

¿Tu sistema operativo está configurado en automático, oscuro o claro?

4 Me gusta

Hola, ¿es posible tener un tercer interruptor? Similar a como Twitter tiene claro, atenuado y oscuro.

Si es así, ¿cómo podría agregarlo?

1 me gusta

No tenemos un tercer interruptor. Para añadirlo se requeriría una PR al componente temático enlazado en el OP de este tema.

3 Me gusta

Después de actualizar discourse a 3.2.0, estoy viendo estos errores en los registros

El tema/componente Dark-Light Toggle está generando errores:
TypeError: No se pueden leer propiedades de null (leyendo ‘en’)

Backtrace:

TypeError: No se pueden leer propiedades de null (leyendo 'en')
    at Object.initialize (https://site.com/theme-javascripts/56ff324506efb7c3883ba59ee00cc753852ee8cc.js?__ws=site.com:5:51)
    at n.initialize (https://site.com/assets/chunk.6d10396b901f5b95b67e.d41d8cd9.js:2:309459)
    at https://site.com/assets/vendor.f196a698a6a811ae0583c1ea5284644b-53642a3b547b78e34800ab2eeb101f12b39be8c27ec85e9ad359a095161fad6b.js:11:141483
    at e.each (https://site.com/assets/vendor.f196a698a6a811ae0583c1ea5284644b-53642a3b547b78e34800ab2eeb101f12b39be8c27ec85e9ad359a095161fad6b.js:11:368590)
    at e.walk (https://site.com/assets/vendor.f196a698a6a811ae0583c1ea5284644b-53642a3b547b78e34800ab2eeb101f12b39be8c27ec85e9ad359a095161fad6b.js:11:367606)
    at e.each (https://site.com/assets/vendor.f196a698a6a811ae0583c1ea5284644b-53642a3b547b78e34800ab2eeb101f12b39be8c27ec85e9ad359a095161fad6b.js:11:366959)
    at e.topsort (https://site.com/assets/vendor.f196a698a6a811ae0583c1ea5284644b-53642a3b547b78e34800ab2eeb101f12b39be8c27ec85e9ad359a095161fad6b.js:11:367005)
    at e._runInitializer (https://site.com/assets/vendor.f196a698a6a811ae0583c1ea5284644b-53642a3b547b78e34800ab2eeb101f12b39be8c27ec85e9ad359a095161fad6b.js:11:141795)
    at e.runInitializers (https://site.com/assets/vendor.f196a698a6a811ae0583c1ea5284644b-53642a3b547b78e34800ab2eeb101f12b39be8c27ec85e9ad359a095161fad6b.js:11:141441)
    at e._bootSync (https://site.com/assets/vendor.f196a698a6a811ae0583c1ea5284644b-53642a3b547b78e34800ab2eeb101f12b39be8c27ec85e9ad359a095161fad6b.js:11:110927)
    at e.domReady (https://site.com/assets/vendor.f196a698a6a811ae0583c1ea5284644b-53642a3b547b78e34800ab2eeb101f12b39be8c27ec85e9ad359a095161fad6b.js:11:110503)
    at invoke (https://site.com/assets/vendor.f196a698a6a811ae0583c1ea5284644b-53642a3b547b78e34800ab2eeb101f12b39be8c27ec85e9ad359a095161fad6b.js:11:358129)
    at h.flush (https://site.com/assets/vendor.f196a698a6a811ae0583c1ea5284644b-53642a3b547b78e34800ab2eeb101f12b39be8c27ec85e9ad359a095161fad6b.js:11:357216)
    at p.flush (https://site.com/assets/vendor.f196a698a6a811ae0583c1ea5284644b-53642a3b547b78e34800ab2eeb101f12b39be8c27ec85e9ad359a095161fad6b.js:11:358979)
    at B._end (https://site.com/assets/vendor.f196a698a6a811ae0583c1ea5284644b-53642a3b547b78e34800ab2eeb101f12b39be8c27ec85e9ad359a095161fad6b.js:11:364062)
    at B._boundAutorunEnd (https://site.com/assets/vendor.f196a698a6a811ae0583c1ea5284644b-53642a3b547b78e34800ab2eeb101f12b39be8c27ec85e9ad359a095161fad6b.js:11:360486)
2 Me gusta

¿A qué está configurado este ajuste en el componente del tema? ¿Está también el componente del tema actualizado?

2 Me gusta

Dice que está actualizado

2 Me gusta

¿cuáles son los pasos para reproducir este error? ¿sucede algo en tu pantalla? ¿solo en la consola?

1 me gusta

No tengo ningún problema visual con la operación. Hasta ahora, solo los registros en la consola.

2 Me gusta