Hi everyone,
I'm working in ServiceNow UI Builder, customizing a Calendar timeline component. I'm trying to apply custom CSS styles via the component's Styles section to adjust the layout and text behaviour (e.g., white-space, overflow, etc.). This is a screen shot of my calendar:
I've blurred the section header titles but you can see that they are truncated as they reach the end of the block before the calendar timelines section starts. I'd like the header titles to persist over that border so they fill the entire header section. So, it would like this:
I found the bit of CSS that would need to be amended and confirmed it by updating it live using the inspection tool but when I tried to add the CSS to the calendar component, I get the error message saying:
“Only global CSS block will be considered”
This means local component-level CSS is not applied, and I'm unable to target specific internal elements such as .tm-section-head-default-content or .text-content.
Where exactly should global CSS be defined if I want it to affect UI Builder components?
Is there a way to safely target internal classes of the Calendar or Timeline component? Preferably without amending the theme record.
Any help or clarification would be greatly appreciated! Thanks in advance.
