Ich kann die Namen der Schriftfamilie nicht in der Auswahl der Quill-Editor-Schriftart auflisten ⇐ C#

[Anonymous]

Ich kann die Schriftfamilienunterschiede innerhalb des Editors sehen (d. H. Die benutzerdefinierten Schriftarten werden ordnungsgemäß angewendet), aber ich kann die Liste der Schriftarten in der Quilleditor-Symbolleiste nicht anzeigen. Also habe ich diesen Code verwendet (aus dem Abschnitt "Einbettencode> Web): < /p>

Code: Select all

< /code>
Jetzt in meinem Blazor Web App -Projekt: < /p>
[h4]RazorPage.razor.css

, vereinfachtes CSS-Stil [/h4]

Code: Select all

.ql-font-roboto {
font-family: 'Roboto', sans-serif;
}

.ql-font-open-sans {
font-family: 'Open Sans', sans-serif;
}

.ql-font-lato {
font-family: 'Lato', sans-serif;
}

.ql-font-montserrat {
font-family: 'Montserrat', sans-serif;
}

.ql-font-roboto-condensed {
font-family: 'Roboto Condensed', sans-serif;
}

.ql-font-oswald {
font-family: 'Oswald', sans-serif;
}

.ql-font-poppins {
font-family: 'Poppins', sans-serif;
}

.ql-font-slabo-27px {
font-family: 'Slabo 27px', serif;
}

.ql-font-noto-sans {
font-family: 'Noto Sans', sans-serif;
}

.ql-font-roboto-mono {
font-family: 'Roboto Mono', monospace;
}

.ql-font-merriweather {
font-family: 'Merriweather', serif;
}

In meiner JavaScript-Datei, die ich für meine razorpage.razor :
verwende

Code: Select all

const Font = Quill.import('attributors/style/font');
Font.whitelist = [
'roboto', 'open sans', 'lato', 'montserrat', 'roboto condensed',
'oswald', 'poppins', 'slabo 27px', 'noto sans', 'roboto mono', 'merriweather'
];
Quill.register(Font, true);

setTimeout(function () {
const quill = new Quill('#editor', {
modules: {
toolbar: [ // I have no idea how to specify this: #toolbar-container
['bold', 'italic', 'underline', 'strike'],        // toggled buttons
['blockquote', 'code-block', 'link', 'image'],

[{ 'header': 1 }, { 'header': 2 }],               // custom button values
[{ 'list': 'ordered' }, { 'list': 'bullet' }],
[{ 'script': 'sub' }, { 'script': 'super' }],      // superscript/subscript
[{ 'indent': '-1' }, { 'indent': '+1' }],          // outdent/indent
[{ 'direction': 'rtl' }],                         // text direction

[{ 'color': [] }, { 'background': [] }],          // dropdown with defaults from theme
[{ 'font': Font.whitelist }],
[{ 'align': [] }],

['clean']
],
},
placeholder: 'Compose a product description here...',
theme: 'snow'
});
window.quillEditor = quill;
console.log("Quill initialized");
}, 1000);
< /code>
Hier ist der Quill -Rich -Texteditorcode: < /p>



< /code>
Ich kann sehen, dass die Schriftart erfolgreich in den Editor importiert wird, aber nicht über die Symbolleiste -Schriftauswahl nachwirkt: < /p>