Change color and size of the Description text

CSS Codes Event Calendar
1

Add this code to the Custom CSS field on the Appearance tab of your Event Calendar widget’s settings:

/* Styles on Card */

/* Description */
.eapp-events-calendar-description-component div {
  font-size: 16px;
  color: rgb(70, 70, 70);
}

/* Styles on Popup */

/* Description */
.global-styles,
.eapp-events-calendar-modal-modal .eapp-events-calendar-tags-item {
  font-size: 14px;
  color: rgb(70, 70, 70);
}
2

hi, can i also change the link color of the description text.
actual it is blue on a violet background. :frowning:

1 Like
3

Hi there, @Alex_Zosel :wave:

This code should do the trick:

.global-styles, .eapp-events-calendar-popup-item-description a {
  color: red!important;
}

Give it a spin and let me know how it worked :wink:

4

Hi Max,

great. It works. :slight_smile: What I notice, however, is that the popup now does not show the beginning of the text, but the end of the text, i.e. the link.

Below that is the “Show more” link, then the text unfolds and jumps up to the beginning. Feels a bit like an anchor jump.

1 Like
5

Hi @Alex_Zosel :wave:

I’ve checked your widget and the popup shows the beginning of the description and the full text unfolds when clicking on the Show More button:

image
image642×778 43.7 KB


If the issue still persists, please send me a screenshot of what you see :pray:

6

Hi Max,

yes, I was also surprised this morning that it was true. :slight_smile:
Maybe a cache / browser issue somehow? But it’s perfect like this.

Many thanks

1 Like