Samantha Zhang
@moyicat · Maker @ Graphiq.com, Inc.
Nice project! I hope the text can be aligned on baseline not in the middle of the horizontal grid tho.
upvotesharetweet・
H
Martin Ollivere
@martinollivere · Product Designer
@moyicat Hi Samantha, thank you very much for your feedback. The text currently sits in the middle of the lines due to the way CSS line-height works, it adds padding above and below the text to achieve the desired spacing. There are some fiddly work arounds to try and set the text to the baseline but we wanted to keep things as simple as possible with this first version. I'll let @jamiegilman wade in here if required as he is the front-end expert. Thank you again for the comment, just the kind of feedback we need. If you have any other thoughts do please let us know
upvotesharetweet・
Samantha Zhang
@moyicat · Maker @ Graphiq.com, Inc.
@martinollivere @jamiegilman Yay so happy that you want to look into it. Check out https://github.com/jakegiltsoff/... . I like their approach for baseline alignment with SASS mixins.
upvotesharetweet・
H
Martin Ollivere
@martinollivere · Product Designer
@moyicat @jamiegilman That's great, thanks for sharing
upvotesharetweet・
Jamie Gilman
@jamiegilman · Web Developer
@moyicat @martinollivere Thanks for your input Samantha, and for the Sassline link, it's very interesting. The difficulty with aligning directly to the baseline of the grid is that the cap-size of the font family is required for the calculation, which is different for each font family and isn't available from the Google fonts API. It could be that we provide an input field for the user for the cap-size of the font family, and in the same way as Sassline, the user would tweak this to get the right value. It's an interesting feature we'll certainly consider, especially if we have more similar feedback. Thanks!
upvotesharetweet・
Samantha Zhang
@moyicat · Maker @ Graphiq.com, Inc.
@jamiegilman @martinollivere Yup definitely more complicated to allow that ... I think a dynamic slider would be a nice UI for people who are not familiar with the cap-size concept.
1sharetweet・
Jamie Gilman
@jamiegilman · Web Developer
Yes, thanks for your suggestions, it's very helpful. We'll be sure to let you know if we implement this
upvotesharetweet・