Rich Text - ariel-fer/Araena GitHub Wiki
Rich texts are basically a group of other elements, added as a main single element.
The following classes must be set prior to this one:
- Titles
- Texts
- Lists
- Wrappers
It is important to understand that even after setting exactly the same properties, there will always be a margin added to the last element that cannot be taken out the same way we do with our single elements, in which the margin is added by a wrapper and can be controlled for each element, but not in a rich texts where you can apply properties to all or none of them.
In order to overcome that, we apply a custom code to last-childs of the rich text class:
/* Remove margins from last element in rich content*/
.c-rich-content :last-child {
margin-bottom: 0;
}
Can be seen in the Style guide section for this element:
A succeeded rich text element means that each of its elements is equally aligned to its equal single element. The following shows that using X-ray, none is properly aligned:
Class | Description |
---|---|
c-rich-content |
Default rich text |