Too much vertical spacing around horizontal line

[whisperdancer]

After update to V 22.2.0 I noticed extra lines being added to the Readme.md files. This happens after adding a line. Here’s how to duplicate:

In web files app, open a folder
Click on upper part to create a Readme.md file
Type Line #1, then type 3 dashes — and press Enter key to create a hard line
Notice it adds the hard line, but inserts 2 lines above and 2 lines below the newly added hard line.

Before update to 22, the text above and below the hard line would hug it tightly without adding additional lines above and below the hard line

To view full report with screenshots, see here https://help.nextcloud.com/t/extra-lines-inserted-after-adding-hard-line-after-update-to-nc-22/124692

[juliusknorr]

This was introduced in #1487

@jancborchardt 3em indeed looks quite large looking at the forum screenshots, should we maybe narrow that down a bit again?

[whisperdancer]

Yes, please revert back to how it was before the increase to 3em. It looked great before the increase.

[whisperdancer]

So I did a bit of tweaking using Firefox object explorer. I found this class, which appears to be the correct one, and changed the margin from 3em to 1em and I think it looks great at that value.

#editor-wrapper div.ProseMirror hr {
padding: 2px 0;
border: none;
margin: 3em 0;
width: 100%;
}

It's in a file called webpack://css/prosemirror.scss:144

Of course it's only in memory and temporary. Is there a way for me edit the css file so it's permanent until a possible fix is pushed out? I'm not a nextcloud developer, but have some dev experience. However, I don't know which file has that style so I can't edit it. Perhaps you can help.

Thank you.

[juliusknorr]

https://github.com/juliushaertl/theming_customcss might help you for small local adjustments ;)

[whisperdancer]

Thank you. I tried to tweak it using the theme customization and didn't work. The style change not being picked up. I added this style like this

#editor-wrapper div.ProseMirror hr {
padding: 2px 0;
border: none;
margin: 1em 0;
width: 100%;
}

and saved. Any thoughts on what I'm doing wrong? Thank you!

[juliusknorr]

You might need to use margin: 1em 0 !important, but lets stick to the actual topic in here. For further customizing questions, please head over to the forums 😉

[jancborchardt]

This was intended to automatically insert enough whitespace around the line, but maybe it’s indeed too much. We could go for something inbetween, 2em or 2.5 em?

[whisperdancer]

I'm currently using 1em per custom CSS and it looks great.