vallafederico / hacking-webflow

17 stars 5 forks source link

Line height adjustment #2

Open GabDufresne opened 1 year ago

GabDufresne commented 1 year ago

Hi there, I absolutely love your attributes solution to add quick text reveal animations. Are there any possible adjustments that can increase the "mask" area? My current typeface has a low baseline that, paired with a tightened line height, cuts off the bottom of the letters.

Thank you

vallafederico commented 1 year ago

Thanks Gab!

You should be able to specify the line height by adding further CSS rules.

The script currently automatically adds the overflow:hidden part, you should be able to further add in the /head tag something to further manipulate it that

[data-a-split] > div, 
[data-a-split] > div > div {
  line-height: 2em;
}

lmk if this works otherwise I can thing of another solution.

Will probably add in the automatic CSS addition an inherit so that it can be set directly from webflow in the future, thanks for the heads up.

GabDufresne commented 1 year ago

Thank you for the quick response. I'm actually trying to go the other way and reduce the line height.

The transform parameters might be messing with the css.

YosifBozhinov commented 1 year ago

Hello there!

I am also encountering this issue with additional light height. How can I decrease it without disrupting the CSS?