search

processing / p5.js-web-editor

The p5.js Editor is a website for creating p5.js sketches, with a focus on making coding accessible and inclusive for artists, designers, educators, beginners, and anyone else! You can create, share, or remix p5.js sketches without needing to download or configure anything.
https://editor.p5js.org
GNU Lesser General Public License v2.1
1.39k stars 1.33k forks source link

Faux bold applied on functions by the theme #3255

Open romaincazier opened 13 hours ago

romaincazier commented 13 hours ago

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)

welcome[bot] commented 13 hours ago

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.