remove font import, add font link in head

[lydiadunning]

Description

This changes the method for importing Google fonts from an import statement in index.css to a series of link tags in the head of index.html. It seems to resolve the issue with the react app not loading into the page. This intermittent issue is most likely to occur when loading our app for the first time, which can be replicated with a hard refresh.

I made this change after reviewing previous commits to find where this issue was introduced.

Type of Changes

	Type
✓	:bug: Bug fix
	:sparkles: New feature
	:hammer: Refactoring
	:100: Add tests
	:link: Update dependencies
	:scroll: Docs

Updates

Before

After a hard refresh (press ctrl or command and refresh the browser) or loading with no cache, 50% chance of loading only the background.

After

Entire site loads after each of 10 attempts.

Testing Steps / QA Criteria

1. Open the preview demo provided by GitHub.
2. In the Application tab of developer tools, open cache storage and delete the site's cache, if any.
3. Refresh the page with a hard reset (press ctrl or command and refresh the browser) 10 times.
4. Verify that the react site loads in each time.

Note: To test this issue locally, create a build and preview the build.

[github-actions[bot]]

Visit the preview URL for this PR (updated for commit b0fae95):

https://tcl-65-smart-shopping-list--pr51-ld-fix-root-not-in-d-xghd2yrh.web.app

_{(expires Tue, 31 Oct 2023 04:31:03 GMT)}

_{🔥 via Firebase Hosting GitHub Action 🌎}

_{Sign: a91b8fb0f37677e20d8afa3e8ea496251536f9b8}