Styling Issues in Configurable Workspace: Strikethrough Text and Dark Icons When Selecting Elements
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
2 hours ago
Hi ServiceNow Community!
I'm currently customizing the look and feel of a Configurable Workspace using Theme Builder, and I've encountered two visual issues that I haven't been able to resolve.
Both issues seem to occur when UI elements are active or selected.
1. Strikethrough Text on Selected Tabs
When selecting certain tabs, such as "Overview" or "Work notes", a horizontal line appears across the text, making it look like it has a strikethrough effect.
What I've found so far:
The issue occurs when tabs are selected.
I identified that the color of this line is related to the UI Colors → Interactive → Selection Primary property in Theme Builder.
When I change the Selection Primary color, the line also changes to the same color.
However, I haven't found a configuration that allows me to remove only this line.
Expected behavior:
I would like to remove the line crossing the text while keeping the normal active-tab indicator, such as the underline below the selected tab.
2. Icons Turning Dark When Interacting with Them
I've also noticed a similar issue with navigation icons.
The icons display correctly in their default state. However, when I click on an icon, its appearance changes and it becomes very dark, almost black.
This causes the icons to lose visibility and contrast against the colors configured in the theme.
What I've found so far:
The issue occurs when interacting with icons or when they remain selected.
The icons display correctly in their default state.
The color change seems to be related to the styles applied to active or selected states.
I haven't been able to identify which specific property controls this behavior.
Expected behavior:
I would like the icons to maintain a visible color that matches the theme, even when they are active or selected.
Questions
Has anyone experienced similar behavior when customizing a Configurable Workspace using Theme Builder?
I've attached screenshots showing both behaviors.
Any guidance or recommendations would be greatly appreciated!
Thank you!
