p5.js-web-editor icon indicating copy to clipboard operation
p5.js-web-editor copied to clipboard

Faux bold applied on functions by the theme

Open romaincazier opened this issue 4 months ago • 1 comments

p5.js version

v1.10.0

What is your operating system?

Mac OS

Web browser and version

No response

Actual Behavior

The theme applies font-weight: 700; to functions. However the corresponding files from Google Fonts (Inconsolota) are not loaded, resulting in the browser applying a faux bold. This issue is especially apparent on Safari where you can see the spacing being off:

Screenshot 2024-10-23 at 15 23 48

Don’t mind the weird code formatting, it’s for a business card 🙃

Expected Behavior

The fix is to change server/views/index.js#L15 to:

<link href='https://fonts.googleapis.com/css?family=Inconsolata:400,700' rel='stylesheet' type='text/css'>
Screenshot 2024-10-23 at 15 24 10

Another fix could be to not change the font-weight of functions

Steps to reproduce

(no steps needed)

romaincazier avatar Oct 23 '24 13:10 romaincazier