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 1 year 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

Welcome! 👋 Thanks for opening your first issue here! And to ensure the community is able to respond to your issue, be sure to follow the issue template if you haven't already.

welcome[bot] avatar Oct 23 '24 13:10 welcome[bot]