Powerful Rich Text Styling

Hi,

I created some components on a separate (static) page, e.g. CTAs.

Those components can hold paragraphs and are styled individually (font-size: 2rem, in this case). Now, when I pull those into the target rich-text-field, the style settings for the paragraph of that CTA are being applied, which is logical, but not what I want (in this case).

I wonder how to best address this. Should I just create additional override CSS rules?

Currently, I am thinking about something like this:

div[itemtype="fs-richtext-component-cta"] p {
    font-size: 2rem;
}

This works, but before going down this path and applying the custom attributes to numerous elements, I thought I’d ask here if there is a smarter way to do it.

Thanks

hey @Marc! I believe this is the best approach at the moment!

However, we might be able to suggest a solution in the future to maintain the source styling… thanks for pointing this out! :muscle:

Hey @Support-Luis, okay thank you.

Glad to give more input, feedback, ideas or test if this feature is being worked on. Would make styling of dedicated elements waaaaay easier and straight-forward if we could avoid this class sandwich :sandwich:

1 Like