Stilsektor für eine spezifische CSS-Regel hinzufügen

Question

Hey @artf,

Könntest du dir bei diesem Fall helfen? Ich möchte den Benutzer deaktivieren, um den Wrapper-Block (Body) auswählen zu können, aber ich möchte ihn trotzdem stylen lassen. Deshalb dachte ich daran, einen benutzerdefinierten Sektor hinzuzufügen, der für alle Blöcke angezeigt wird, aber die in diesem Sektor angewandten Stile speziell in eine CSS-Regel angewendet werden. Gibt es eine Möglichkeit, das zu erreichen? Ich habe etwas Zeit damit verbracht, den Code zu recherchieren, aber ich habe keinen Weg gefunden, das umzusetzen

arthuralmeidap · Accepted Answer

Mein Ansatz hat mehrere Nachteile, aber da wir in dieser App die Selektoren für den Style Manager nicht verwenden, schau mal, was ich gemacht habe; Ich habe meinem neuen Sektor eine benutzerdefinierte 'Ziel'-Eigenschaft hinzugefügt. Ich habe angefangen, für jeden Sektor die 'change:open' zu hören, und wenn der Sektor mein neues Custom Prop hat, setze ich die CSS-Regel, die ich als Ziel haben möchte, mit 'editor'. StyleManager.setTarget('.my-class', { targetIsClass: true });' ansonsten setze ich...

arthuralmeidap · Answer

Nur ein Beispiel: Der Nutzer hat einen Textblock ausgewählt. Im Style-Manager-Panel würde es so angezeigt werden, wie es heute ist. Die CSS-Selektoren wurden darauf angewendet und auf die Abschnitte wie Allgemein oder Dekorationen, um es zu stylen, und außerdem gab es einen globalen Abschnitt, der das Styling für eine bestimmte CSS-Regel anwandte

artf · Answer

Ja, ich denke, es ist möglich, du solltest beim Editor-Laden manuell einen neuen Sektor mit deinen Eingaben hinzufügen und bei Eingabeänderungen den Wrapper-Stil 'editor.getWrapper().addStyle({ color: yourInputEl.value })' aktualisieren oder, wenn du eine spezielle CSS-Regel brauchst, 'editor. CssComposer.setRule('.your-class', { color: '...' }); `

Stilsektor für eine spezifische CSS-Regel hinzufügen

Frage

Antworten (3)

Verwandte Fragen und Antworten

Sichtbarkeit des Panels

Auswählen mit optgroup hinzufügen

Zeigen Sie Hover Toottip auf dem Block

Traits Manager – Bildtypfeld.

Kostenpflichtige Plugins, die diesem Problem entsprechen

Durchsuchen Sie Plugin-Kategorien