When using the RichTextEditor I can’t figure out a way to make a nice email signature. Even using shift-return keeps spaces. I assume it’s making every enter a new paragraph. Is there a way to make a nice and tight email signature? I know I could use the TextArea but then I lose the ability to add formatting for an email. I also noticed here in the forums the return is a single line. This doesn’t appear to be the RichTextEditor component but is very similar. In any case is there a way to have styling to compose an email (to html) but at the same time have nice clean email signatures without all the extra spacing like in the screenshot.
The only challenge is that it appears to be all or nothing because if you do this then you lose the spacing ability between paragraphs. There’s just no way to do something like a shift-enter is there? Ideally sometimes you want the line to be right below and other times you want paragraphs. An email is a perfect example because you want both spacing between paragraphs and you don’t want spacing in the email signature.
That’s the challenge. If I had to pick I almost would prefer <br> tags over <p> tags because I could do some post processing and make the adjustment. Is that possible?
If you can process <br> tags, you should be able to process <p> tags as well. It’s not quite as simple but it should be doable. That’s the best way to get it done that I can think of.
For whatever reason the paragraph in the editor has a different spacing than the paragraph with a line. Is there possible another style that can be edited that I’m not aware of so that they can be the same?
I think the extra white space here is not coming from the line height but the CSS margin of <p> elements; if you set it to 0, lines should be equally distant whether they are a single long paragraph or multiple consecutive paragraphs.
The question then is how do I do this? Because if I play with emailRichTextEditor.getElement().getStyle().set("--lumo-line-height-m","1.0"); it affects the editor. And if I play with the styles for the paragraph and so on I affect the rest of the page.
I’ve tried everything I could think of, playing with the dev editor directly in Chrome, and so on, without any success…
Thank you. That helps a lot. Just one last thing, and this is possibly where I hit a wall. In between paragraphs and everything there is no whitespace, meaning an extra enter has to be entered everywhere. Is there any way to go from the first screenshot to the second screenshot without forcing the user to enter in extra carriage returns? I’m assuming not because that would be the difference between shift-return but I’m so so close I figured I’d ask in case I missed anything else…
Nope, that won’t work. There are two things not to confuse here: line-height and paragraph margin. The last 5 paragraphs contain the signature, so if you increase the paragraph margins (more specifically, margin-top and margin-bottom), the signature will again be spaced out. The Quill library that RTE builds on is really the limiting factor here.
