Closed eatyourpeas closed 1 month ago
Paired on this 29/08/24. It looks like we were referring to the fonts via src: url(...)
but when running from the Vite build in https://github.com/rcpch/digital-growth-charts-react-client it doesn't know to serve the fonts from the library so ends up returning the SPA build by default.
We need the library to load the fonts. We discussed:
data
urls so we can embed them within the library bundle@dmc-cambric Dan I think finally the easiest way to fix your font problem is to put this in your client:
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">
The fonts are bundled into the client too but serving them in a react app is not that easy. Let me know if this is possible.
@eatyourpeas This would be ideal, however our app needs to be able to function offline, so we can't always guarantee access to the google font sites. Not entirely sure what the best way forward is here, if these embedded fonts can't be accessed or if they are loaded from a url in the rcpch package, we would probably need to serve those same static font files, just from within our app.
This now fixed with #104 Note that montserrat only is bundled into the library, not Arial that is standard on most windows computers. If there specific requests for fonts those will need to be added to the bundle as b64 files. Best for people to raise and issue with this request in future.
@dmc-cambric do please let me know that this fixes your fonts issue
The Montserrat and Arial fonts are being correctly bundled into the build folder but are not being found by the style sheets / styled components.