0
235
Vistas¿Cómo agregar mi propia lista de colores en el menú de color de fuente del editor de plumas?
Agregué Quill Editor como componente de Vaadin para poder acceder a él en Java y lo personalicé un poco porque todo lo que necesito son los botones BOLD , ITALIC y font-color y funciona bien.
Estoy luchando con una cosa. Quiero establecer mis propios colores y solo los míos en el menú de colores. ¿Cómo puedo conseguir esto?
en mi quilleditor.js personalizado tengo esto:
const ColorClass = Quill.import('attributors/class/color'); Quill.register(ColorClass, true); const ColorStyle = Quill.import('attributors/style/color'); Quill.register(ColorStyle, true);que creo que básicamente importa esto de node_modules/quill/themes/base.js:
const COLORS = [ "#000000", "#e60000", "#ff9900", "#ffff00", "#008a00", "#0066cc", "#9933ff", "#ffffff", "#facccc", "#ffebcc", "#ffffcc", "#cce8cc", "#cce0f5", "#ebd6ff", "#bbbbbb", "#f06666", "#ffc266", "#ffff66", "#66b966", "#66a3e0", "#c285ff", "#888888", "#a10000", "#b26b00", "#b2b200", "#006100", "#0047b2", "#6b24b2", "#444444", "#5c0000", "#663d00", "#666600", "#003700", "#002966", "#3d1466" ];porque el menú de color se ve exactamente así y el conteo y los colores coinciden con la lista anterior:
¿Cómo puedo deshacerme de esos colores y agregar mi propia lista al crear el editor?
He intentado usar la lista blanca pero sin éxito.
No soy un desarrollador de javascript y estoy tratando de hacer algo que no entiendo completamente, por lo que pido ayuda.
1 Respuestas
Responde la pregunta0
Gracias a @Ian H. lo descubrí.
Mientras inicializaba el editor, tenía esto:
this.colors = [{ 'color': [] }];
Y de acuerdo con https://quilljs.com/docs/modules/toolbar/ "Los temas también pueden especificar valores predeterminados para los menús desplegables. Por ejemplo, Snow proporciona una lista predeterminada de 35 colores para los formatos de color y fondo, si se establece en un valor vacío formación."
Así que agregué mis colores a la matriz:
this.colors = [{ 'color': ['#e60000', '#9933ff', '#00ff00'] }];
¡y funciona! Muchas gracias :)