Compress calendar entries, too much padding. CSS?

[j7seven]

I'm currently using the following CSS line to reduce the calendar date size:

.calendar-monthly-big .event-date { font-size: 2em }

As I'm using a Fire TV Stick on a 27" monitor in portrait mode, I'm restricted to the 540 x 960 resolution (Fire TV restriction), so every piece of screen real estate is important for me to fit my calendar that I'm trying to show 8 full weeks ahead.

I've modified the font size on the calendar settings as best I could before it becomes blurry/illegible. Now I'd like to subtly compress calendar entries for those where I have multiple calendar entries on the same day, which I believe should push me to the 8 weeks on the screen I'm looking for.
There is too much padding between them. Is there a CSS line I can add to accomplish this?

[Dan-Peck]

Hello, @j7seven -- Thank you for the inquiry!

While there is currently no built-in method to adjust the padding within calendar blocks, this can be accomplished with our Custom CSS feature. We do have several calendar types to choose form, however, and any Custom CSS used to modify it will generally depend upon which one is being used.

The area of content you might want to adjust may be subjective, but for the Big Monthly Calendar type, some additional sample CSS you could use to shrink the padded areas of its content might be:

.calendar-monthly-big .event-day LI {
    margin-bottom: 2px;
}

.calendar-monthly-big TD {
    padding: 0 !important;
}

For more information on the Custom CSS feature, you may also review the following support article:

https://dakboard.freshdesk.com/support/solutions/articles/35000178086-applying-custom-styles-to-screens