Join the Soledad Facebook Users Group here
for Share, assistance, discussion, and Updates related to Soledad WordPress Theme.

If you can't create a new ticket - you can send us an email via our contact form and we will get back to you.

Okay
  Public Ticket #2776697
Responsive break points
Closed

Comments

  • gerardpp started the conversation
    May 14, 2021 at 10:32am

    Is there a way to define our own device break points for responsive behaviour?

    It looks like this feature is hard coded in the theme and there is no possible way to alter it. Neither I want to create a child theme just for overriding this.

    There is one breakpoint (Tablet big, i guess) that is between 960px and 1240px that is breaking all my 2 column arrangements. is there a way to bypass that breakpoint and keep the tablet small + desktop and mobile?

    IMAGE ATTACHED

    Image here

  •  2,495
    PenciDesign replied
    May 14, 2021 at 11:04am

    Hi,

    This is the example code of breakpoint of this theme, please customize as you want and go to Appearance > Customize > Additional CSS, then paste:

    /* Large Desktop */
    @media screen and (min-width: 1440px) {
        .penci-container-fluid, .two-sidebar .site-main .penci-container {
            max-width: 1430px;
        }
    }
/* Tablet Horizontal */
    @media screen and (min-width: 1241px) {
        .penci-container, .penci-container-fluid {
            width: 100%;
            max-width: 100%;
        }
    }
/* Tablet Vertical */
    @media screen and (min-width: 960px) and (max-width: 1240px) {
        .penci-container-fluid, .penci-container.penci-vc_two-sidebar, .two-sidebar .site-main .penci-container {
            width: 100%;
            max-width: 100%;
        }
    }
/* Mobile */
    @media screen and (max-width: 768px) {
        .penci-container, .penci-container-fluid {
            padding-left: 0;
            padding-right: 0;
        }
    }

    Best Regards,
    PenciDesign.