Add nunito sans font

[ndelangen]

Resolve: #20828
Resolve: #16278

What I did

• I add a few font files
• I add these files to be hosted / copied by storybook via a preset config
• I add references to these font files in the manager builder's template

How to test

• start a storybook in dev-mode
• open the browser
• expect the network tab to show you the browser loading 2 font files in the manager, followed by a css file.
• expect the font defined in that css files to be used in the manager

repeat the above steps but for a build storybook. (you can use a chromatic deployed storybook for this)

[yannbf]

Interesting (and understandable) that Chromatic didn't pick up visual changes, but here are a few I noticed:

Sidebar

---

Toolbar and controls

[ndelangen]

I was instructed to use "Regular" and "Black" variation, thus that's the fonts-files I added.

@MichaelArestad can you please comment?

[MichaelArestad]

I updated the typefaces to include Regular, Italic, Bold, and Bold Italic. I removed black and updated the few places the 900 weight was used.

1. Is there concern in removing the black option from the theming package?
2. The italic weight would only be used on docs pages. Is it possible to conditionally load/preload the italic typefaces only for docs pages? Or perhaps load them after everything else on non-docs pages?

[ndelangen]

nice!

[ndelangen]

Is there concern in removing the black option from the theming package?

No, I have no concerns about that at all.

---

The italic weight would only be used on docs pages. Is it possible to conditionally load/preload the italic typefaces only for docs pages? Or perhaps load them after everything else on non-docs pages?

This PR doesn't impact the preview (where docs renders) at all.
If the user doesn't have nunito sans installed, they'll still see the fallback font in the preview, even after merging this PR.

Am I correct in assuming you want me to apply this font-loading change to for the preview as well? @MichaelArestad

[socket-security]

Socket Security Pull Request Report

👍 No new dependency issues detected in pull request

Pull request report summary

Issue	Status
Install scripts	✅ 0 issues
Native code	✅ 0 issues
Bin script confusion	✅ 0 issues
Bin script shell injection	✅ 0 issues
Shell access	✅ 0 issues
Uses eval	✅ 0 issues
Unresolved require	✅ 0 issues
Invalid package.json	✅ 0 issues
HTTP dependency	✅ 0 issues
Git dependency	✅ 0 issues
GitHub dependency	✅ 0 issues
New author	✅ 0 issues
Potential typo squat	✅ 0 issues
Known Malware	✅ 0 issues
Telemetry	✅ 0 issues
Protestware/Troll package	✅ 0 issues
AI detected malware	✅ 0 issues

Bot Commands

To ignore an alert, reply with a comment starting with @SocketSecurity ignore followed by a space separated list of package-name@version specifiers. e.g. @SocketSecurity ignore foo@1.0.0 bar@2.4.2

Powered by socket.dev

[MichaelArestad]

Am I correct in assuming you want me to apply this font-loading change to for the preview as well? @MichaelArestad

@ndelangen Yes, please. The only fonts the manager use are regular and bold. Only the docs pages would utilize the italic variants.

[valentinpalkovic]

@ndelangen Thank you, Norbert, for taking care of the requested changes. Should we merge? :)