Time component background and Text color changes, how?

Ask the Community Customization
1

Hello I attach an image here with arrows, and my question is where to change color of these elements.

Best regards

color_change
color_change814×922 55.8 KB

2 Likes
3

Hi there @user21789 :wave:

You can change the color of the event type right in the settings. Just go to the Event Types section on the Events tab, select the needed event type and set the color:

image
image328×547 13.3 KB
image
image331×435 7 KB

image
image621×760 47.1 KB


As for changing the background color of the time element, this code will do the trick:

.eapp-events-calendar-time-component {
  background-color: red;
}

Just add it to the Custom CSS field on the Style tab of your widget’s settings and let me know if it helped :slightly_smiling_face:

1 Like
4

Cool thanks! one more thing… here the text on red bg how to change it?

2 Likes
5

This CSS code should help:

.eapp-events-calendar-time-icon {
 fill: white;
}

.eapp-events-calendar-time-text {
  color: white;
}
2 Likes
6

Thank you so much for fast response and solution!

3 Likes
7

No problem!

In the meantime, we’d like to invite you to join our new challenge, where you can win 3 FREE months for your subscription. Check the details and participate :wink: - March Challenge: Share your results with Elfsight & win 3 FREE months!:rocket:

1 Like