[Support request] Setting CUSTOM Responsive CSS-media max-width ranges

Home Forums Support Setting CUSTOM Responsive CSS-media max-width ranges

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1415305
    michael

    I have the latest versions of WordPress & GeneratePress Premium.

    I have a child theme made form GP-SiteLibrary-Mellow

    In my style.css, I have set the Mobile media max-width:500px.

    On testing I discovered there are several other media max-width’s involved, I DONT WANT THOSE.
    I only want media (max-width: 500px).

    I cant correctly set my Mobile-HamburgerMenu Widths on Openning & Closing the Menu-Toggle-Hamburger on home page.
    in MobileScreen I need to FULLY hind the ExpandedMenu untill Toggled ON, then have ExpandedMenu show flushedRight.

    I checked the Chrome-ViewSourceCode & discovered a couple style tags that I didn’t set:
    1) style id=’generate-style-inline-css’ 2) style id=’generate-navigation-branding-inline-css’

    How do I change these values and/or remove these unwanted code blocks???

    #1415713
    David
    Staff
    Customer Support

    Hi there,

    the theme comes with several breakpoints that cannot be simply removed.
    Looking at your site the only ones that probably apply would be typography and mobile menu breakpoint rules.

    What exactly are you trying to achieve ? Is it to change when the Mobile Menu appears ? If so then this may be of help:

    https://docs.generatepress.com/article/mobile-navigation/#initiating-the-mobile-navigation-at-a-different-width

    #1416553
    michael

    Thanks David,

    Yes, you are correct, I’m trying to set when MobileFormat appears. I am also interested in when TableFormat appears, as opposed to Desktop.

    I will test what you have advised.

    Where do I set TabletScreen format-media triggering????

    I guess Mobile Format should be triggered at MobileLandscape width 758px. Tablet Format should be triggered at TabletLandscape width (around 10 inches). Desktop is default at greater than 10 inches.

    #1416756
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    Not everything is controllable using these filters, unfortunately.

    However, you can adjust the queries like this:

    add_filter( 'generate_media_queries', function( $queries ) {
        $queries['tablet'] = '(min-width: 769px) and (max-width: 1024px)';
        $queries['mobile'] = '(max-width:768px)';
    
        return $queries;
    } );
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.