Black Friday Sale! Get $20 off GP Premium, $40 off our new Lifetime license, and 45% off license renewals/extensions! Learn more

[Support request] Any plans on increasing media queries for typography?

Home Forums Support Any plans on increasing media queries for typography?

Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • #390639
    drew

    I love that the ability to apply different font sizes across two major media queries is a feature right out of the box, thanks so much for including that.

    Currently, is seems the “mobile” styles include smartphone portrait and landscape plus tablet portrait and “desktop” covers everything from tablet landscape on up.

    Are there plans to expand that to:

    1. desktop
    2. tablet landscape
    3. tablet portrait
    4. smartphone landscape
    5. smartphone portrait

    I love having the controls baked right into the customizer but I’m finding that I still end up spending time creating styles for @media screen and (min-width: 768px) and (max-width: 840px) becasue one setting for smartphone doesn’t really scale across three media queries without some awkwardness.

    Lastly, it would be great to have the media query settings for all typography items.

    Many thanks,
    Drew

    GeneratePress 1.4
    GP Premium 1.4.3
    #390763
    David
    Staff
    Customer Support

    It would be nice to have this granularity but may make the UI fairly overwhelming in the current customiser layout.
    I have been experimenting with dynamically sized text which may be of interest. Simple piece of code:

    p { font-size: calc( 16px + (24 - 16) * (100vw - 400px) / (800 - 400) ); }

    It simply sets a size range between 16px and 24px spanning across 400px and 800px screen resolutions.

    Maybe a dynamic option whereupon you set the base font min / max sizes across the device types and then apply scaling for in between(?)

    #390799
    Tom
    Lead Developer
    Lead Developer

    Yea, while I love the idea, I think the UI would be a mess. The logic in the backend would also get messy pretty quickly, as GP would have to write all of those media queries for you.

    Interesting idea, David! I’ll have to research that a bit šŸ™‚

    #390806
    David
    Staff
    Customer Support
    #390808
    drew

    I’m not too sure the UI would be difficult to figure out, even using the same containers for the existing icons, adding three more wouldn’t be overload.

    The dynamic sizing is interesting too but I don’t have any experience working with it.

    #391697
    David
    Staff
    Customer Support

    Hi Drew, i think when you consider the number of media queries (5) and the number of text styles to consider there would be at least 30 fields that would require populating. It would definitely be a nightmare with the current customiser layout and probably a little overwhelming for most users.

    Try adding the CSS i provided above to some test content, the results are pretty cool.

    #454086
    Maria

    Hi David,

    I’ve been researching fluid typography for the past couple of days trying to see how to implement it on GPP based on the Smashing Magazine article you referenced above. I couldn’t quite get it to work so I came to the forum to see if there was any info on it and I see you’ve already been experimenting with it. I’d love to hear how you achieved it.

    My headings wouldn’t scale up or down and my paragraph fonts scaled past the min and max font size.

    #454152
    Leo
    Staff
    Customer Support

    Hi Maria,

    Can you provide a link to your site?

    #454188
    Maria
    #454222
    David
    Staff
    Customer Support

    Hi Maria, couple of things. The Rule will require !important to override the main styles. Secondly the first set of brackets shouldn’t contain a unit just the values. I had some pretty funky results using REMs and EMs with this model that i haven’t yet ironed out. Might be best to work with good old pixels for now.

    #454476
    Maria

    Thanks for the tips, David. Still not working out for me. Will stick with px for now like you said and keep it movin’.

Viewing 11 posts - 1 through 11 (of 11 total)
  • You must be logged in to reply to this topic.