Does anyone have a working example of using a custom font (ttf) with Yew?
#Working Example of custom font
limpid topaz
grand stag
theres nothing yew-specific with fonts
if using trunk, see assets https://trunkrs.dev/assets/#images-other-resources
then just refer to the file with a path relative to the dist folder, e.g. localhost:8080/font.ttf (can be accessed with just font.ttf or /font.ttf in urls on the webpage) if its in dist/font.ttf
also look up how fonts are usually done in css
limpid topaz
@grand stag Thanks for responding. If you dont mind taking a look at my code, I'd love some more help (not sure why this is so difficult for me).
Here is my file structure. Im copying the font file to the dist/assets/fonts folder, then trying to access that file withing the CSS. Im ultimately getting lead to this browser error each time:
panicked at 'couldn't parse style string: Failed to Parse CSS, due to: 0: at line 6, in Many0: @font-face {
Oh and yes I am using trunk!
grand stag
where is that @font-face placed?
if thats stylist, i dont think it supports @font-face inside its macros
grand stag
That is in a styles sheet near the root of my client:
i dont see it being mentioned in the trunk assets, so im assuming its not an asset?
i doubt there is any reason not to use it as an asset as opposed to some other solution
stylist is meant to be right next to the html! since its mainly used for ${interpolation} and being an alternative to tailwind
limpid topaz
I have the font file in my top level assets folder that is being copied to my dist folder like so.
Ahh I see. Makes sense!
grand stag
if you have a css file then you are probably not interpolating inside it, so just use it as a trunk asset
limpid topaz
Can you expand on that? Im not sure what using it as a trunk asset looks like
grand stag
i mean there is always the trunk doc https://trunkrs.dev/assets/#css
im not sure if it needs a separate <link rel="stylesheet"> (like in regular html) right under the asset definition link