Bullet point color bug in Splash Screen widget 2.16?

06-18-2020 01:51 PM
New Contributor III

I can't make the bullet points in the Splash Screen widget be any color other than white. When I change the foreground color, the text will change but not the bullet points. The same goes for a numbered list. This happens in both WAB online and developer. Has anyone else seen this behavior?

0 Kudos
1 Reply
MVP Emeritus


   The issue is that the bullets are HTML LI elements and by default, it is not possible to change the bullet color of a list item. But this link gives you a css workaround How To Change Bullet Color of a List 

This is what you need to add to the splash widgets css\style.css file:

.jimu-widget-splash .splash-container ul li{
  list-style: none; /* Remove default bullets */

.jimu-widget-splash .splash-container ul li::before{
  content: "\2022";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
  color: red; /* Change the color */
  font-weight: bold; /* If you want it to be bold */
  display: inline-block; /* Needed to add space between the bullet and the text */
  width: 1em; /* Also needed for space (tweak if needed) */
  margin-left: -1em; /* Also needed for space (tweak if needed) */