Docs

[hwolfe]

Hi, all! I have an events widget on the home page of a site that is pulling the styling from my theme. I need to be able to change that font size on the event to something much smaller. (It is the Upcoming Events area)

Can you help? Ideally, I would like to have Upcoming Events stay the size it is, and have the actual event font size be smaller.

Thank you!

[hwolfe]

This reply has been marked as private.

[Christopher]

Hi there,

Please add following code in Customize -> Custom -> Global CSS :

.x-widget-area .h-widget {
    font-size: 15px;
}
.x-widget-area #vsel {
    font-size: 8px;
}

.x-widget-area .vsel-widget-link {
    font-size: 10px;
}

Hope that helps.

[hwolfe]

That worked perfectly! I need to change the case on the font so I added a text-transform command, but it only worked on “upcoming events”. What did I do wrong on the #vsel line of code?

.x-widget-area .h-widget {
    font-size: 20px;
    text-transform: capitalize;
}
.x-widget-area #vsel {
    font-size: 10px;
    text-transform: capitalize;
}

.x-widget-area .vsel-widget-link {
    font-size: 10px;
}

Thank you!!

[Christopher]

Hi there,

Please add this code :

#vsel .vsel-meta-title {
    text-transform: capitalize;
}

Hope it helps.

[Author]

Posts