The font style settings changed across my forms (Posie & Poser Pre-Order Form and Measurements for Pre-Order) without my touching the forms. I’m not sure when as I haven’t been checking the form daily, but, here is what changed:
- Everything that was bold is now light
- Everything that looked “regular” is now so light it’s barely legible
- The size of the font no-longer responds to the webflow setting for the embedded code, it stays constant. This is a problem because it no longer matches the webflow page font size as the page shrinks for various screen breakpoints
I started to go through the first two steps (Step 1 and Measure First Prod) in the Posie & Poser Pre-Order Form to re-bold and make the light font more visible, but it’s time consuming. You can see either from the 3rd step (Measure 2nd Prod) or from the other form (Measurements for Pre-Order) where everything is as I found it (bold is gone, font is super light).
I am also not able to figure out how to get the font size back to a responsive state as an embedded form. I’ve tried every setting that was working before in webflow and it has no effect now on the feathery embedded form.
I’m using an uploaded font, (Fontfabric Code Pro) which was working fine until whenever this change occurred. (I tried to find form version history to see if I could trace what happened and when, but no luck)
Attempting to override styles on your Feathery form from your webflow site isn’t a flow we support / recommend. We recommend applying styles to your form directly from Feathery if possible. We also support reusable styles and components via our themes (https://docs.feathery.io/platform/build-forms/design/reuse-styles-and-elements)
so if set up right, shouldn’t require a ton of edits.
We’ve made updates to how font styling is applied on our side to make it more robust, which could have changed the way your webflow styles then applied
- I tried using the themes to apply the style across the form, below here you can see two examples where it doesn’t seem to be working.
First example: after applying all the style elements for the Title asset (no-longer blue), itonly applied it to the first two steps in the form, by the 3rd step there is no change to the Title asset.
( applied all the styling elements to “All Buttons” then went to the next step where the identical button appears but without the styling applied (the button was already styled the same colors, I can tell the styling wasn’t applied because the text in the button did not turn bold):
- The main issue is that when the form is embedded into another page, the webpage has breakpoints for tablet and mobile in terms of responsive design where I can set the size of the font (and layout/images etc) for what looks best for that screen size, but the Feathery font and form fields stay constant, looking much larger than the other elements in the page, and I can’t figure out how to fix this now. Before, the form was adjusting for size. Here is one example of the mismatch:
You have overridden element styles (indicated by the blue label). To have the element inherit from the asset or theme style, you’ll need to click the label and click “Reset to theme /asset style”. Then they will all pull from the same style
It’s likely still possible to override css text styles on the feathery form from webflow. Here’s some loose advice, although Webflow may be a better resource – you’ll want to apply it to the specific element (the ), and set !important on the css style to make sure it’s prioritized
Is there a way to do a “reset to theme/asset style” across the entire form, instead of element by element? (I looked but didn’t find a way to do this so far)