search

steveruizok / fontloader

Painlessly, reliably load local and web fonts into Framer prototypes.
30 stars 0 forks source link

loadLocalFonts: Not working as expected if args are not provided as Array #1

Open bruskowski opened 6 years ago

bruskowski commented 6 years ago

Great stuff, thanks! ~Just wish I had found this module earlier.~ Edit: It's new, I just realised. :) There seems to be one issue though:

If I provide arguments like this: loadLocalFonts(one, two, three) Only one seems to be added as a @font-face rule within a style tag.

The workaround is easy though, with the following syntax it just works: loadLocalFonts([one, two, three])

I guess ln. 136 does not to work as expected: if not _.isArray(fonts) then fonts = [fonts]

On a side note: Even using this module, I still seem to have issues with line-lengths/unintended line-breaks when using custom fonts and auto-length text layers created in design mode. The line-breaks occur in iOS Preview. Did not dig deeper yet and am not sure if it's actually a pre-loading issue.

steveruizok commented 6 years ago

I think Design Mode treats fonts slightly differently, and I haven't had the chance to really explore how. I'll take a look at the array detection error.

patrickreynolds commented 6 years ago

So to be clear, fontloader only works with programmatically created TextLayers right now? I've been trying to view custom text in the framer preview app and I'm seeing the correct custom font family for programatic text layers, but the custom font is not reflected in the text layers that were created in design mode.

Have either of you talked with Framer to see if this is on their radar to fix?

Thanks for your work so far @steveruizok! Really appreciate it.

bruskowski commented 6 years ago

It should work for text layers from design mode as well so far. The only thing not working with those in my experience was the fix for the layer width, which should avoid unexpected line breaks when using custom fonts for auto sized text layers. Quick workaround: Apply a fixed width to the text layers in design mode.

Why your custom font is not showing for text layers from design mode, I don't know. A wild guess: Maybe check if the font-family and font-weight attributes in Inspect mode of Framer Studio match the font-face declaration and/or the attributes of the programmatically created text layers, in case those work fine.