Banner persistente de Discourse

[NateDhaliwal]

	Resumen	Se muestra un banner persistente en la parte superior de cada página que solo puede ser ocultado por los administradores.
	Vista previa	Theme Creator
	Repositorio	GitHub - NateDhaliwal/discourse-persistent-banner: A theme component for Discourse that cannot be closed by the user.
	Guía de instalación	Cómo instalar un tema o componente de tema
	¿Nuevo en los temas de Discourse?	Guía para principiantes para usar temas de Discourse

Instalar este componente de tema

Este componente muestra un banner en la parte superior de cada página. Se pueden usar colores CSS válidos. Si planeas usar variables de tema de Discourse, envuélvelas en var(), así obtendrás algo como var(--tertiary-very-low).

Hay 7 configuraciones para controlar el banner.

1. banner_background_color cambia el color de fondo del banner.
2. banner_text_color cambia el color del texto del banner.
3. banner_border_color cambia el color del borde del banner.
4. banner_border_thickness cambia el grosor del borde del banner.
5. banner_text_content cambia el texto del banner. El texto se ajustará en el banner si tiene más de 1 línea.
6. banner_visible cambia la visibilidad del banner. show para mostrar el banner, hide oculta el banner.
7. banner_location coloca el banner en 1 de los 4 puntos de salida dados: above-site-header, below-site-header, above-main-container y before-topic-list.

¡Gracias especiales a @Lilly por ayudar a organizar los archivos!

[hoangphuctran93 (Hoàng Phúc Trần)]

Lo encuentro bastante similar a los componentes temáticos “Notification banners” y tiene más personalización.

[NateDhaliwal]

Sí, pero de esta manera, el banner permanece allí (la gente ha preguntado cómo hacer que el banner vuelva después de cerrarlo).

[Lilly (Lillian Louis)]

Buen trabajo, Nate.
Me gusta la simplicidad.

No creo que la vista previa del creador de temas funcione.

Algunas sugerencias para que las consideres:

• Hay un pequeño problema de ubicación en el modo de escritorio, especialmente si se utiliza una pantalla ancha / completa.

• Sería bueno poder controlar el tamaño y el color de ese borde.

• ¿Quizás opciones de ubicación con diferentes salidas de complementos, como below-site-header y above-main-containter?

• Si bien el uso de una lista de enumeración en lugar de una entrada de texto para las opciones de color es conveniente, también limita a los administradores a usar las variables de paleta de colores que funcionan con modos oscuros / claros, o a ser más granulares con los valores de color hexadecimal.

• Sugeriría hacer que la configuración del texto del banner sea una entrada de texto con la propiedad textarea: true, entonces obtendrás un cuadro de texto de varias líneas que el usuario puede expandir. Entonces es más fácil hacer esto:

[NateDhaliwal]

@Lilly

hay un pequeño problema de colocación en el modo de escritorio, especialmente si se utiliza una pantalla ancha / completa

Jugaré con la colocación del banner e intentaré que esto funcione.

@Lilly

sería bueno controlar el tamaño y el color de ese borde.

No debería ser un gran problema, lo añadiré.

@Lilly

¿quizás opciones de colocación con diferentes puntos de conexión de complementos, como below-site-header y above-main-containter?

Entendido. Tengo una idea de cómo implementar esto.

@Lilly

si bien el uso de una lista de enumeración en lugar de una entrada de texto para las opciones de color es conveniente, también limita a los administradores a usar las variables de paleta de colores que funcionan con modos oscuros / claros, o a ser más granular con los valores de color hexadecimal.

Creo que puedo implementar esto.

@Lilly

Sugeriría hacer que la configuración del texto del banner sea una entrada de texto con la propiedad textarea-true, entonces obtendrás un cuadro de texto de varias líneas que el usuario puede expandir.

Entendido, lo añadiré.

[NateDhaliwal]

@Lilly

textarea-true

@Lilly Solo para comprobar, ¿lo añado en settings.yml?

[Lilly (Lillian Louis)]

sí, puedes verlo aquí en el componente de banner versátil:

settings.yml

resultado en la configuración del componente:

[NateDhaliwal]

[cita=“Lilly, post:4, topic:330575”]
tal vez opciones para la colocación con diferentes salidas de plugins, como below-site-header y above-main-containter?
[/cita]

Implementado.

[cita=“Lilly, post:4, topic:330575”]
sería bueno controlar el tamaño y el color del borde.
[/cita]
Hecho.

[cita=“Lilly, post:4, topic:330575”]
también limita a los administradores a usar las variables de la paleta de colores que funcionan con los modos oscuro/claro, o a ser más granulares con los valores de color hexadecimal.
[/cita]
Ahora puedes usar valores hexadecimales (incluye el #), colores CSS válidos o variables de tema (var(–var-name)).

[cita=“Lilly, post:4, topic:330575”]
Sugeriría hacer que la configuración de entrada de texto de la cadena del banner sea con textarea: true
[/cita]
También hecho.

[cita=“Lilly, post:4, topic:330575”]
existe un pequeño problema de colocación en el modo de escritorio, especialmente si se está utilizando una pantalla ancha / completa.
[/cita]
Creo que está arreglado. ¿Podrías probarlo de tu lado?

[Lilly (Lillian Louis)]

@NateDhaliwal

Creo que está arreglado. ¿Podrías probarlo de tu lado?

Asignado a Lilly ​

esto definitivamente está arreglado. buen trabajo.

captura de pantalla desde mi vista de escritorio panorámica

[NateDhaliwal]

ACTUALIZACIÓN:
He simplificado el archivo .gjs moviendo las declaraciones if para comprobar si el texto del banner está vacío y la visibilidad del banner al archivo .scss.