@CCZMAX1
The bold styling might be coming from a default CSS rule applied to the sub-menu items in the advanced navigation menu. You can override this by explicitly setting the font-weight property in your custom CSS.
Here’s an example:
.nav-menu .sub-menu-item {
font-weight: normal !important; /* Change bold to normal */
}
You should inspect the specific HTML and classes applied to the sub-menu items (e.g., .sub-menu-item or similar) and target them accordingly.
Other CSS Variables for Expanded Navigation:
You can adjust many aspects of the advanced portal navigation menu by leveraging predefined SCSS variables in ServiceNow. Since you’ve already modified $expanded-bg, here are some other common variables that may affect navigation:
- $expanded-text-color: Controls the color of text in the expanded navigation.
- $expanded-link-color: Color of the link text in the expanded menu.
- $expanded-hover-bg: Background color when hovering over expanded items.
- $expanded-active-bg: Background color of the active item in the expanded menu.
- $expanded-border-color: Border color of the expanded navigation.
You can find these variables in the SCSS files within your Service Portal theme. If you're not familiar with where these files are located, check:
- Service Portal > Themes in the application navigator.
- Open your custom theme, and under the CSS Variables tab, you’ll find predefined variables that you can customize.
Comprehensive List of CSS Variables:
Unfortunately, ServiceNow doesn’t provide a full list of SCSS variables out-of-the-box in one place. However, you can review the core SCSS files used by the platform to get an idea of the available variables.
To access these files:
- Go to Service Portal > Themes.
- Look for your theme or the default theme you're using.
- In the theme's SCSS/CSS files, you can browse and see the variables used.
✔️ If this solves your issue, please mark it as Correct.
✔️ If you found it helpful, please mark it as Helpful.
—
Shubham Jain
