Hello. I think the Text Element should inherit as many properties as possible by default.
Currently, when adding a new text element to a page, it inherits the font-family and text-align properties, but beyond that, there are a few defaults that are applied automatically:
font-family: inherit; /* these are good: */
text-align: inherit;
font-weight: 300; /* these are super annoying: */
line-height: 1.4;
color: rbg(0,0,0);
This is highly annoying when trying to build multiple page templates quickly, and when tweaking/adjusting/fine tuning a website after many templates have been built.
Many times my designers have built dozens of pages, and then tried to change the global line height across all of the page templates, only to find that this is not possible. The only way to do it is by applying a css override, like
.x-text:not(.x-text-headline){ line-height: 1.6 !important;}
but this then makes it impossible to have control of the line height of any future text element, unless you add a class or custom css to each text element that requires special treatment.
We do often save a Text Element template with all the desired properties configured in order to speed up template building, but this does not solve the problem of updating text formatting globally when necessary. Using templates we can only update the color and font family globally (using the font and color templates), but line height and font weight still need to be updated manually on every singe text element across the site. Also, setting a template as an element default does not help because it is impossible to set the line-height property to “inherit” (it just won’t accept that value). It is also impossible to set the color and font-weight properties to “inherit”. Having these options would make this method possible.
I understand that it would be incredibly complex to provide this functionality for all the properties of the text element, but I think it is reasonable to at least have the text element default to:
font-family: inherit; /* all of these should inherit */
text-align: inherit;
font-weight: inherit;
line-height: inherit;
color: inherit;
This way, we can go about designing all our pages, adding text elements all over the place without worrying about having to change these basic properties later on. We can simply add a global css line-height property, or font-weight, or color to the body element (or configure them in the theme options), and all the text elements would inherit these global styles.
Finally, while I’m on the subject of global theme options/settings, please add a line-height setting.
Thanks for your consideration. Cheers!