I've encountered font issues on my page while using react. Previously, everything was working fine but now I'm seeing the following error in the console.
Attempted solutions like running npm audit --force (something along those lines).
Additionally, the images I added through CSS are not displaying properly.
Error: downloadable font: rejected by sanitizer (font-family: "Satoshi-Bold" style:normal weight:700 stretch:100 src index:2) source: http://localhost:3000/public/fonts/Satoshi-Bold.ttf downloadable font: rejected by sanitizer (font-family: "Satoshi-Medium" style:normal weight:500 stretch:100 src index:2) source: http://localhost:3000/public/fonts/Satoshi-Medium.ttf
The font code I am using in the CSS is as follows:
@font-face {
font-family: 'Satoshi-Medium';
src: url('/public/fonts/Satoshi-Medium.woff2') format('woff2'), url('/public/fonts/Satoshi-Medium.woff') format('woff'), url('/public/fonts/Satoshi-Medium.ttf') format('truetype');
font-weight: 500;
font-display: swap;
font-style: normal;
}
@font-face {
font-family: 'Satoshi-Bold';
src: url('/public/fonts/Satoshi-Bold.woff2') format('woff2'), url('/public/fonts/Satoshi-Bold.woff') format('woff'), url('/public/fonts/Satoshi-Bold.ttf') format('truetype');
font-weight: 700;
font-display: swap;
font-style: normal;
}
If you have any ideas on how to resolve this issue, please share. Thanks!