TagStyleTool es una versión inspirada en (3) componentes existentes para permitir la personalización de la apariencia de las etiquetas en Discourse.
v0.2
Se añadió el Creador de Estilos Visuales: ¡Permite buscar iconos, seleccionar colores e importar categorías!
Características:
Se resolvieron problemas de compatibilidad (Específicamente entre la eliminación de guiones y los iconos de etiquetas).
Asigna un icono de Font Awesome a etiquetas específicas.
Se añadió la opción de aplicar un icono de etiqueta predeterminado a cualquier etiqueta no definida.
Herencia invertida, por ejemplo, color de etiqueta o de texto.
Resuelve un problema de color de contraste con el color del texto al usar la configuración de color de etiqueta.
Permitió la capacidad de elegir entre los estilos de etiqueta existentes.
Versatilidad de configuraciones que permiten deshabilitar la etiqueta predeterminada o la función de guiones.
El formato de configuración es el mismo (con la adición de nuevas configuraciones) que Tag Icons permitiendo portabilidad/adoptabilidad fácilmente.
A partir de la v0.2
Implementar una opción para aplicar a una categoría completa. (Esto tiene inconvenientes, creo que se puede hacer, pero requiere mantenimiento adicional).
¡Busca en la Base de Datos de FontAwesome el icono perfecto!
Elige tu color favorito de un selector de color visual.
Más por hacer:
Color de Etiqueta Predeterminado un escenario hipotético si solo quieres el color y no el icono.
Correcciones para el usuario en la configuración.
Otros:
Esta es la primera vez que publico algo al público en mucho tiempo. ¡Si tienes problemas, házmelo saber!
¡Voy a probar esto! ¡¡Gracias!! Estuve viendo varios componentes de estilo de etiquetas y parecía complicado tener que instalar varios, ¡así que probaré el tuyo la próxima vez que me ponga a trabajar en mi configuración!
Lo acabo de probar rápidamente. Dos comentarios de “novato”:
Me pierdo un poco con lo de FontAwesome. ¿Son solo los gratuitos? ¿Qué versión? ¿Hay una lista de todos los iconos en algún sitio (¿o es demasiado larga para eso?)?
color: ¿qué tan complicado sería proporcionar un selector de color, para personas que no dominan el RGB?
No te preocupes por perderte, feliz de ayudar en todo lo que pueda, después de todo, ¿para eso está Discourse, verdad?
Font Awesome
El componente debería admitir automáticamente cualquier icono de Font Awesome de la versión actual que se encuentre en la versión actual de Discourse. Creo que actualmente admiten la v6. Puedes encontrar todos aquí Font Awesome.
Respecto a la segunda parte de la pregunta, sí, es gratis, hay una versión premium, pero no estoy seguro de cómo funciona eso con Discourse ya que Font Awesome ya está incluido en el núcleo.
Selector de Color
Puedo echar un vistazo y ver si puedo implementar uno, pero como es un componente de tema, no estoy seguro de cuánto puedo hacer antes de que sea necesario que sea un plugin. Sin embargo, puedes usar esta útil herramienta, haces clic en el área “Use HTML 5” donde está el color, y para este componente, quieres usar el color hexadecimal. HTML Color Picker
Bueno, he progresado. Todavía necesito hacer algunas cosas para arreglarlo antes de enviarlo, como que la lógica de inserción no funciona (la copia sí), y el botón es visible en todo el sitio, y lo más notable, como puedes ver, está en la esquina inferior.
También descubrí cómo aplicar a todas las etiquetas de un grupo de etiquetas.
¡El constructor es genial! Pude usarlo para un par de etiquetas para empezar, y luego, cuando presioné la marca de verificación verde para guardar mi configuración, el Constructor de Estilo de Etiquetas desapareció.
Si actualizo, el botón aparece por un momento antes de desaparecer de nuevo.
Tampoco puedo hacer que uno de los iconos (como el ojo de la cerradura, por ejemplo) aparezca en la etiqueta a pesar de que el constructor lo sugiere. Lo agregué a la lista de iconos SVG también, guardé, y todavía nada.
Esto está tan cerca de ser un placer de usar, gracias por los esfuerzos. Me encantaría ver que esto reemplace permanentemente varios otros componentes del tema para mí.
Hice todo esto entre la 1 y las 2 a.m. y lo publiqué a las 6 a.m., así que discúlpenme por los pequeños problemas.
Puedo reproducir la desaparición del botón, esa cosa es terca. Logré arreglarlo, creo.
Supongo que olvidé algo sobre los iconos de Font Awesome. Necesitas ir a la configuración de tu sitio y luego a SVG Subset, y agregarlo manualmente. Si Discourse no lo está usando ya, no se renderizará por defecto. Aunque, incluso haciendo esto, todavía tuve un problema para que se renderizara. Investigaré esto más a fondo.
Tuve que eliminar el componente y reinstalarlo (ambas veces) para que el botón del constructor apareciera en primer lugar.
Con la última versión, puedo hacer que el botón persista a través de la configuración inicial de mis etiquetas. Y puedo hacer que persista después de una actualización. Pero al volver a la pantalla de edición del componente desde Temas y Componentes, el botón desaparece de nuevo. Bicho astuto.
Jugaré con la parte de los iconos. Dado que hay una forma de desactivar los iconos predeterminados, ¿habría alguna forma de descartar el icono de etiqueta para las etiquetas de color? Como si coincidiera con el conjunto de iconos predeterminado o algo así. El componente de etiquetas de color era agradable al no necesitar establecer un icono, disfruté del aspecto limpio que tenía, y replicar eso sería una característica útil para mí.
Estoy probando algunas cosas, te envié mi último paquete beta, no dudes en avisarme si tienes algún problema con él, ya que esa es la base de código en la que estoy trabajando.
Debería solucionar algunas de estas cosas. Agregué una lista de tareas pendientes para usar las anulaciones como respaldo, por ejemplo, Tag1, Pencil, NoColor simplemente renderizaría Tag1, Pencil, <Color si se usa el valor predeterminado, se usa Verdadero o falso como valor predeterminado, de lo contrario, no se aplica color>.
un escenario hipotético si solo quieres el color y no el icono.
descubrí cómo aplicar a todas las etiquetas de un grupo de etiquetas.
Lo he implementado, avísame si tienes algún problema.