Vertical Filter Bar Opens at 100% Width on Desktop

Home Forums Calendar Products Filter Bar Vertical Filter Bar Opens at 100% Width on Desktop

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #1187860
    Dan Feeley
    Participant

    I appear to be having the same issue as a few other people which still exists with the 4.3.2 release.

    When open the vertical filter bar is at full width and you no longer see the event list on the desktop. I disabled all plugins except The Events Calendar and the Events Calendar Filter Bar. I am also running the Twenty Sixteen theme with no modifications.

    Here’s a screen recording of what I am seeing: http://recordit.co/bjTeBid71w

    #1188030
    Nico
    Member

    Hi Dan,

    Thanks for reaching out and sorry to hear about this issue 🙁

    It appears to be introduced in 4.3.1, it was logged when 4.3.2 was scoped and due to time constrains devs couldn’t slip that in. Good news is it should get fixed in 4.3.3 coming out in less than two weeks time (if everything goes as planned).

    This CSS snippet worked for users reporting this:

    .tribe-events-filters-vertical {
    float: left;
    width: 25%;
    }

    Please give the fix a try and let me know if it works for you,
    Best,
    Nico

    #1188515
    Dan Feeley
    Participant

    Hello Nico, thanks for the fix.
    it appears to be working.

    #1188692
    Nico
    Member

    Glad it helps Dan! Thanks for the heads-up 🙂

    #1191023
    Misty
    Participant

    Thanks for the start! In my install, the rule suggested in this thread caused some vertical alignment issues, and setting the top margin was being partially overwritten by rules in filter-view.css. To apply the top margin, the options were to use !important on the 75px, or to add more specificity to the rule (better option – code follows)

    #tribe_events_filters_wrapper.tribe-events-filters-vertical {
        width: 25%;
        float: left;
        margin-top: 75px;
    }

    Additionally, in the collapsed mobile layout, the “Show Filters” button was being obscured by the event list, because the wrapper was given an explicit height of 0 in the filter-view.css. To restore its place in the visual layout, I added this rule (had to use !important this time…) :

    @media only screen and (max-width: 767px) {
    #tribe_events_filters_wrapper.tribe-events-filters-horizontal, .tribe-filters-closed #tribe_events_filters_wrapper.tribe-events-filters-horizontal, .tribe-filters-closed #tribe_events_filters_wrapper.tribe-events-filters-vertical {
        height: auto !important;
    }
    }
    #1191075
    Nico
    Member

    Hey Misty,

    Thanks for chiming in and for adding your fix 🙂

    Hopefully next maintenance release 4.3.3 coming out next week will fix this!

    Cheers,
    Nico

    #1193631
    George
    Participant

    Hello!

    I wanted to inform you that we’ve just published a series of updates to our products that fixes a number of issues.

    We’ve fixed the Filter Bar layout issues reported here.

    Learn more about this release—version 4.3.3—in the official release notes here → https://theeventscalendar.com/maintenance-release-events-calendar-4-3-3-event-tickets-4-3-3-premium-plugins/

    Thanks for your patience while we fixed this!
    George

    #1195126
    Dan Feeley
    Participant

    Sorry Nico,

    Meant to come back and say the temp fix worked.
    But the updated plugin appears to be working too.

    Thanks

    #1195338
    Nico
    Member

    Thanks so much for confirming Dan 🙂

    As this is solved now by the plugin update I’ll go ahead and close out this thread, but if you need help with anything else please don’t hesitate to create a new one and we will be happy to assist you.

    Best,
    Nico

Viewing 9 posts - 1 through 9 (of 9 total)
  • The topic ‘Vertical Filter Bar Opens at 100% Width on Desktop’ is closed to new replies.