search

slidevjs / slidev

Presentation Slides for Developers
https://sli.dev
MIT License
32.78k stars 1.32k forks source link

Some formatting is lost when exporting a presentation to `.pdf` #1497

Open gy-mate opened 5 months ago

gy-mate commented 5 months ago

Describe the bug Some formatting is lost when exporting a presentation with theme-apple-basic to .pdf:

The public slide show opens the first slide like this:

Screenshot 2024-04-04 at 12 58 53

But the exported presentation's first slide looks like this:

Screenshot 2024-04-04 at 12 59 19

The second slide should look like this:

Screenshot 2024-04-04 at 13 01 49

But it looks like this in the exported file:

Screenshot 2024-04-04 at 13 02 51

Something is going on with font weights, bold formatting and letter spacing.

I guess this issue belongs here, but it could also go under themes.

To reproduce Steps to reproduce the behavior:

  1. Clone this repo
  2. git checkout dev_main
  3. git checkout 80ddf676
  4. cd presentation
  5. slidev export (or slidev export --dark, doesn't matter)
  6. This file is created without any errors

Desktop

KermanX commented 5 months ago

It seems that the font "Helvetica Neue" isn't loaded in the public slide show, but loaded in the export mode. On my Windows machine, both two ways load "Helvetica Neue" correctly.

The font-family of the text is "Helvetica Neue",ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"

kamuiiiii commented 5 months ago

Everything works fine on my Mac machine

gy-mate commented 5 months ago

It seems that the font "Helvetica Neue" isn't loaded in the public slide show, but loaded in the export mode.

@KermanX I don't think so. I would guess that the public slide show uses Helvetica Neue Bold (correctly) and the export uses Helvetica Neue Regular (incorrectly) with the font weight increased. (I would rule out the fallback to ui-sans-serif or system-ui, which would be SF Pro Display or SF Pro Text in my case.) See the comparison below:

Screenshot 2024-04-06 at 16 04 51
gy-mate commented 5 months ago

When using slidev v0.49.0-beta.1, the macOS versions of Chrome (123.0.6312.124) and Microsoft Edge (123.0.2420.81) also display the public slide show the same way (incorrectly) as the exported one looks like.

gy-mate commented 4 months ago

Everything works fine on my Mac machine

@kamuiiiii @KermanX I could reproduce this on a MacBook Pro (13-inch, 2019, Two Thunderbolt 3 ports; macOS 14.4.1) different from mine (14-inch, 2021) right now, following the instructions in the issue description and with a fresh install of the latest version of everything (brew, npm, slidev (global), theme-apple-basic and playwright-chromium). It gives the same .pdf output.

KermanX commented 3 months ago

How about using the ----executable-path option?

gy-mate commented 3 months ago

@KermanX I've tried providing the executable of Chrome 126.0.6478.62 and Edge 126.0.2592.61 but unfortunately none of these helped. Neither --timeout 60000 nor --wait 10000 (with any browser–argument(s) combination).

I think the main issue is that Chrome and Edge uses the wrong variant (Regular) of the theme font while Safari uses the correct one (Bold).