atom-community / markdown-preview-plus

Markdown Preview + Community Features
https://atom.io/packages/markdown-preview-plus
Other
370 stars 85 forks source link

Grey font color after PDF export #512

Closed maximilian-kn closed 3 years ago

maximilian-kn commented 3 years ago

After writing down some markdown lines and exporting the preview to PDF, the font color appears to be light grey and not black. Is there a way to change this (and maybe the font size)? Do you configure it in the stylesheet? I'm kind of new to atom and markdown and can't really find a solution to this.

lierdakil commented 3 years ago

You'll have to explain your setup in more detail, because on Atom v1.52 by default this doesn't happen. If anything, pdf font seems to be darker (likely because it looks bolder due to how pdfjs draws it) image

maximilian-kn commented 3 years ago

My Atom version is v1.52.0 and on default, markdown preview plus version is v4.8.3. It only happens to me when using the preview in a dark mode theme, e.g. One dark. When previewing the markdown file and exporting it to pdf via right click on the preview window, the font color in the final pdf somehow adapted the font color from the dark mode UI, which was kind of greyish in my case (see first screenshot). In light mode this wouldn't happen and the final pdf font color is usually black.

So this is the result, when using Atom by default and with UI theme One dark and syntax theme Atom dark:

Bildschirmfoto 2020-11-07 um 15 58 22

This however is the result using a light mode theme (UI and syntax theme both Atom light):

Bildschirmfoto 2020-11-07 um 16 03 18

I got it fixed more or less with this addition to Atom's stylesheet:

body:not([class]) {
  font-size: 14px;
  color: #000;
  background-color: whitesmoke;
  font-family: Helvetica;
}
h1,h2,h3,h4,h5,h6 {
  color: #000;
}

The downside is when opening the preview in dark mode, the preview window is now "white smoke". But that's the closest I could get to having a exported pdf with black font color and using (half of) Atom in dark mode.

Bildschirmfoto 2020-11-07 um 15 47 25
lierdakil commented 3 years ago

Okay. I still can't reproduce. If use GithHub.com style is enabled, the preview will be black-on-white, unless you've added/enabled style overrides (and if you did, all bets are off, it's impossible to offer any support with that). If it's disabled, pdf export should include the background, i.e. it's expected to see something like this: image

But you might be interested in this. TL;DR you can target specific preview modes (i.e. pdf export) in your stylesheet if you're so inclined.

Side note: some style-related inconsistencies when using pandoc backend fixed in v4.8.4.

ginavong commented 3 years ago

I also had this issue.

I think it's because the styles-client/default.less file is set up to use the syntax theme. If syntax is dark mode, then grey makes sense in the dark background preview but when exporting to PDF the background automatically changes to white and the grey no longer makes sense.

I did a similar thing as @Max-194 by going into default.less and forcing the preview into light mode.

lierdakil commented 3 years ago

I've released v4.10.0 with the ability to use different stylesheet for PDF export and the preview itself and more sensible defaults for PDF export. TL;DR, pdf export now uses 'GitHub light' stylesheet by default regardless of Atom UI theme. There still might be some bugbears hiding in the shadows. Do let me know if you find any.

Also, feel free to post your default.less version if you think it can be preferable to 'github.com light' stylesheet. I'd be happy to add it as an alternative preview stylesheet.