Colour and font size in This Week widget

[ardcgarage]

Hi guys,
I’m trying to get some css happening on my ‘this week’ widget to no avail. Im using the Pro shortcode.
I need the fonts bigger in body andheader, and a different colour int he header to make it visible on my dark theme.
I’ve tried variations on ‘.tribe-this-week-widget-wrapper’ and ‘.tribe-this-week-widget-wrapper a’ as a color: #fff !important command, and also the font sizing of the event titles, but nothing is triggering. Help?

View post on imgur.com

[Cliff]

Hi. Thanks for your question.

Can I ask why you’re not just enabling the Week View for the calendar? You can direct-link to it by adding /week to the end, like this: http://example.com/events/week/

Anyway, wherever you’re needing a little CSS help, please provide a link so I can check it out for you.

Thanks.

[ardcgarage]

This reply is private.

[Cliff]

It’s never great to use !important

I think the reason the CSS you’re trying wasn’t taking effect is because #wrapper is used in several CSS rules… so to get more CSS specificity, you have to use #wrapper in your rule too — in addition to the actual selector you’re using.

For example:

body.page-id-6222 #wrapper .tribe-this-week-widget-wrapper .tribe-events-page-title {
font-size: 3em;
}
body.page-id-6222 #wrapper .tribe-this-week-events-widget .tribe-this-week-widget-horizontal a {
font-size: 1.1em;
color: #fff;
}

I would ordinarily not need #wrapper but that CSS wouldn’t work on your site without it.

Hopefully that CSS will help you get you the results you’re wanting — or at least help you get it there yourself.

Please let me know how it goes for you.

[Support Droid]

This topic has not been active for quite some time and will now be closed.

If you still need assistance please simply open a new topic (linking to this one if necessary)
and one of the team will be only too happy to help.

[Author]

Posts