fix: storybook static directory

[huyenltnguyen]

Checklist:

• I have read freeCodeCamp's contribution guidelines.
• My pull request has a descriptive title (not a vague title like Update index.md)

Issue

I noticed that the Storybook site in production (https://opensource.freecodecamp.org/ui) doesn't have the correct fonts, even after #100.

Storybook does automagically pull the fonts into a static/media folder:

But we don't look for fonts in that path:

ui/src/fonts.css

Line 5 in 7f9fc26

src: url("./assets/fonts/lato/Lato-Light.woff") format("woff");

Solution

To resolve the issue, I'm adding the staticDirs option to the Storybook config, which asks Storybook to copy the files into the specified folder:

Notice that the static/media folder is still there. This appears to be the default in Storybook, and I can't seem to find a config option to remove/omit the folder.

Reference

https://storybook.js.org/docs/configure/images-and-assets#serving-static-files-via-storybook-configuration

[ojeytonwilliams]

LGTM 👍