Filter Bar CSS (h3 tag)

Home Forums Calendar Products Filter Bar Filter Bar CSS (h3 tag)

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #954062
    Gil Poulsen
    Participant

    Hi, trying to customize Filter Bar’s CSS to work with the Espresso theme from Boxy Studio. I have used the hint from this forum to override the filter bar stylesheet and that is working fine for most things, other than the labels (Day, Event Category, etc.) because those are h3 elements and they are picking up the h3 styles from my theme.

    If I style those the way I want them to be styled, it alters all the h3 elements throughout the theme ;-( As a workaround I hacked the plugin to make those elements h4 instead, and then changed the styles for h4 in the styles.css for my theme and that worked, but I really don’t like to alter a plug-in like that. Can you tell me how I can configure the CSS for the Filter Bar h3 elements only and not for my entire theme?

    #954099
    Barry
    Member

    Hi Gilbert,

    You could try adding some rules along these lines:

    #tribe_events_filters_wrapper h3.tribe-events-filters-group-heading {
    	color:     green !important;
    	font-size: 30px  !important;
    }

    While I realize those !important modifiers would ideally be omitted this should form an effective way to implement basic changes.

    Does that help?

    #954140
    Gil Poulsen
    Participant

    That did it. I was modifying

    #tribe_events_filters_wrapper .tribe-events-filters-group-heading {

    instead of

    #tribe_events_filters_wrapper h3.tribe-events-filters-group-heading {

    I know using !Important is not ideal but for now this is great. Thanks for the assist and the quick response.

    #954150
    Barry
    Member

    My pleasure 🙂

Viewing 4 posts - 1 through 4 (of 4 total)
  • The topic ‘Filter Bar CSS (h3 tag)’ is closed to new replies.