Las hojas de estilo del plugin deben usar propiedades personalizadas de CSS para los colores

En unos días, fusionaré esta PR en el núcleo, lo que implica un cambio en la forma en que se compilan las hojas de estilo de los complementos. El cambio afecta a las variables de color SCSS utilizadas en las hojas de estilo de los complementos. En resumen: deben ser reemplazadas por propiedades personalizadas de CSS. La mayoría de los complementos ya están actualizados y, en muchos casos, se trata de un cambio sencillo: la variable SCSS debe sustituirse por una propiedad personalizada de CSS:

-   background-color: $primary-low;
+   background-color: var(--primary-low);

La guía en Update themes and plugins to support automatic dark mode ofrece más ejemplos y también muestra cómo manejar transformaciones de color más complejas. (Esa guía debería ser todo lo que los autores de complementos necesiten para asegurar que sus estilos funcionen correctamente.)


Si te preguntas por qué estamos realizando este cambio, sigue leyendo.

Anteriormente, las hojas de estilo del núcleo y de los complementos se compilaban por tema para incluir el esquema de colores del tema en todas las ocasiones en que se utilizaban variables de color SCSS. Esto significaba que un sitio con muchos temas (o un entorno multisitio) tardaba mucho tiempo en precompilar, ya que tenía que multiplicar el número de hojas de estilo del núcleo y de los complementos por el número de temas activos para cubrir todas las combinaciones necesarias.

Desde agosto de 2020, y para soportar el cambio automático al modo oscuro, añadimos una hoja de estilo separada de definiciones de color que almacena las variables de color como propiedades personalizadas de CSS. Este cambio nos permitió cambiar los esquemas de colores al instante, pero también abstraer los colores de la mayoría de las hojas de estilo. Gracias a la magia de las propiedades personalizadas de CSS, ahora podemos hacer referencia a los colores en todas partes (núcleo, complementos, temas) sin tener que cargar cada tema cuando se compila la hoja de estilo.

Durante los últimos meses, hemos estado convirtiendo todos los complementos para que utilicen propiedades personalizadas de CSS. La gran mayoría de los complementos de Discourse ya están actualizados, pero probablemente haya algún complemento por ahí que aún utilice variables SCSS para los colores y que necesitará ser actualizado.

10 Me gusta

¡Gracias por la explicación clara! Incluso yo lo entiendo en su mayoría.

¿Esto provocará que las actualizaciones y reconstrucciones fallen en sitios con componentes de tema que no siguen estas reglas? ¿Como ocurrió en Failed to Bootstrap, due to discourse-alt-logo theme component por otra razón?

De ser así, ¿existe alguna forma de hacer que el mensaje de error sea más claro (para quienes no pueden entender los registros de compilación)? ¿Y decir algo como “elimina el plugin X antes de intentar actualizar”? O, mejor aún, ¿hay alguna forma de advertir a los usuarios en el panel de administración cuando sabemos que se avecina un cambio de este tipo? (o quizás ya existe una advertencia que nadie lee).

2 Me gusta

No, esto no hará que las reconstrucciones fallen. Solo provocará que los colores sean incorrectos en los complementos que no se han actualizado. Eso solo debería ocurrir en complementos caseros; he revisado la mayoría de los complementos publicados aquí en Meta y me he asegurado de que estén actualizados.

El problema que enlazas no tiene nada que ver con este cambio; es un componente del tema y actualmente bloqueamos las reconstrucciones si un componente del tema marcado para actualización automática no puede actualizarse automáticamente.

4 Me gusta

Ah. ¡Qué bien! Lo siento mucho. Todavía me estoy familiarizando con estas piezas.

2 Me gusta

Bien, he encontrado un problema en el modo oscuro. ¿Dónde o qué configuración de color debo ajustar para el texto citado?

Está bien en las categorías públicas, pero en las burbujas de mensajes privados es ilegible.

He intentado varias búsquedas pero no he tenido suerte al encontrar el término correcto.

Esto también afecta a un enlace de un tema.