|
anotheropus
|
January 19, 2017 at 8:11 am
Hello,
When viewing the calendar in week view, days that have more than one event show events and text overlapping.
Is there a way to automatically increase the z-index value for overlapping (shorter time duration) events, and add a solid bg color to differentiate them?
Screenshot of issue: https://www.screencast.com/t/KHVO4oqsVxR6
Screenshot of possible solution: https://www.screencast.com/t/Halycust
NOTES FROM SCREENSHOT
Currently, in calendar week view, multiple same-day events have overlapping text.
This is a visual example of that corrected by changing elements of events that have shorter time duration.
The following elements have changed:
1. The border color of shorter duration events is darker.
2. The div elements of shorter duration events is placed higher (closer to the views) in the calendars z-index.
3. The div elements of shorter duration events has a solid bg color that covers events behind it.
Thank you for your help with this important issue.
Chris
|
|
Josh
|
January 20, 2017 at 10:27 am
You can actually set those events to a category, then you can target specific events that belong to the category with some CSS. First, you go to Event Espresso > Calendar and set Enable CSS for Categories to Yes. Then if you haven’t already done so, you assign a category to the events you want to target. The name of the category will be the CSS class. Once that set you can apply background-color, z-index, and border-color.
|
|
anotheropus
|
January 22, 2017 at 10:49 am
Nice! 🙂 …very nice. Thank you for building things like this so that we can tweak them when needed!
|
