Change CSS Style List View / Event View

[Giorgio De Novellis]

I’m trying The Events Calendar for my Customer:
http://www.mariateresasabatiello.it/events/lista/?tribe_paged=2&tribe_event_display=past
but I’ve got to change the style to correct the white background of:
> tribe-events-list-separator-month
> label-tribe-bar-search

and… here:
http://www.mariateresasabatiello.it/event/biennale-di-firenze-florence-biennale-2009/
> tribe-events-single-section tribe-events-event-meta primary tribe-clearfix

Anyone can help me?

[Geoff]

Hi @dgpixel,

Nice to see you again and hope all is well!

This CSS should do the trick:

.tribe-events-list-separator-month span,
#tribe-bar-form,
.tribe-bar-views-inner {
background-color: #272b31
}

That may not get you exactly the color scheme you’re going for, but should at least give you an example to work with and modify from there.Please do check out this article for more information on targeting CSS classes in the calendar, which is also super helpful.

Cheers!
Geoff

[Giorgio De Novellis]

Yes!!! It works! Thanks!!!
But I have the same problem here:
http://www.mariateresasabatiello.it/event/corpi-alla-deriva/
and in mobile view…
I tried to solve with a similar procedure but did not succeed.
I am sorry!

[Geoff]

Awesome, I’m glad that helped!

The same idea will work for the other link you shared as well. In fact, check out this article for tips on how to locate the CSS classes you need and then change the styles based on what you find, like we did in for the search bar. 🙂

Cheers!
Geoff

[Giorgio De Novellis]

Well Geof,
I did but I’m halfway!
I tried all the options !!!
The result is this:
http://www.mariateresasabatiello.it/event/negativo-positivo/

🙁

[Brook]

Howdy dg,

I am sorry that’s giving you trouble. If I am following you it seems like the CSS rule you want to target is “.single-tribe_events .tribe-events-event-meta”. So something like this should hide the white box:

.single-tribe_events .tribe-events-event-meta {
    background-color: transparent;
    border: none;
}

That what you wanted?

Cheers!
– Brook

[Giorgio De Novellis]

Yessssss!
it works properly!

Thanks Brook!

[Geoff]

Awesome! Glad that did the trick and thanks for following up. 🙂

Geoff

[Author]

Posts