search

KosmosisDire / obsidian-webpage-export

Export html from single files, canvas pages, or whole vaults. Direct access to the exported HTML files allows you to publish your digital garden anywhere. Focuses on flexibility, features, and style parity.
https://docs.obsidianweb.net/
MIT License
883 stars 75 forks source link

[Bug] [1.8.01]: Unwanted spaces added between titles #446

Open sebastien-k opened 5 months ago

sebastien-k commented 5 months ago

What happened?

The HTML version has a lot of spaces between titles. Maybe it is on purpose, but my documents are consequently very long, I wish I could keep it compact like in Obsidian.

In Obsidian: image

Exported in HTML: image

Reproduction

Just create a simple text with titles and paragraphs.

In Obsidian:

Last Working Version

N/A

Version

1.8.01

Operating System

Windows 11

Obsidian Version

1.5.12

Which browsers can you reproduce this in?

Firefox, Chrome, Microsoft Edge

Relevant log output

N/A

Additional Info

I feel dumb, I'm pretty sure it's stupid, but I could not figure out how to correct this :/

KosmosisDire commented 5 months ago

Huh this is weird, I'm look and see if I can reproduce this. What heading level are you using in the example? And she's it still look compact if you use obsidian's reading mode rather than live preview?

sebastien-k commented 5 months ago

Reading mode: image

There is more space indeed, but not as much as in HTML.

Source mode: image

jramboz commented 5 months ago

I'm having the same issue. No spaces between elements in source or reading mode, but added space when exported.

Looking at the exported CSS, it seems to be adding to the margin-block-start and margin-block-end based on a variable called --p-spacing. I can't figure out where in Obsidian this is being set, but it shows up in the exported obsidian.css file.

KosmosisDire commented 5 months ago

Could both you you test this with the beta version of the plugin? There are a number of styling parity fixes in the betas that may resolve this issue. Thanks!

benbarbour commented 5 months ago

I'm seeing this too with the Everforest Enchanted theme, and it happens with the beta version (1.8.1-2b) as well.

KosmosisDire commented 5 months ago

Does this happen with any other themes?

benbarbour commented 5 months ago

Doesn't seem to happen with the default theme, although I think there's some extra space between my headers and embeds.

benbarbour commented 5 months ago

I'm also seeing a lot of extra space after headers when I use Minimal, although I'm also seeing that in Reading Mode with Minimal. :/

KosmosisDire commented 3 months ago

Hey, I just released a beta version that might address this? If you could try it out and let me know if his issue is fixed and if you find any other issues. There are instructions for installing the beta in the readme :) Thanks!

benbarbour commented 3 months ago

This looks like an improvement but it's still not a perfect match for my vault.

KosmosisDire commented 3 months ago

Can you give an example?

benbarbour commented 2 months ago

Using the Everforest Enchanted theme with Test.md and no CSS snippets in Obsidian:

How it renders with the latest beta of this plugin: image

Obsidian's reading mode:

image

Actually, maybe I'm wrong; it now looks pretty much identical (except for my screenshot width being different, making one look zoomed in). Bug fixed, I think!

I was confused because I left a CSS snippet active in obsidian that removes some space following a header, and the snippet is not being applied in the website export (or it just doesn't work after the export).

KosmosisDire commented 2 months ago

Okay nice! I will look into making sure the snippets work, as CSS snippets should be included in the export as you'd expect.