Reduce opacity of popup icon containers

Ask the Community Customization
1

My Team photos are dark and, when viewing a popup, the Close and Carousel icons are difficult to see. How can I change the background/container opacity and color to make the icons more visible?

Image 7-15-24 at 4.30 PM

I tried this, but there were no visible changes:
.global-styles, [class^=“PopupCloseControl__PopupCloseControlContainer-sc”] {
background-color: rgba(255, 255, 255);
}
This almost worked, but now they’re square:
.global-styles, [class^=“Popup__PopupCloseInsideInner-sc”] {
background-color: rgba(255, 255, 255);
}
Image 7-15-24 at 5.07 PM

1 Like
3

This code should work for you:

.global-styles,
[class*="ArrowControl__ArrowControlContainer-sc"] {
  background-color: rgba(17, 17, 17, 1) !important;
}

.global-styles,
[class*="PopupCloseControl__PopupCloseControlContainer-sc"] {
  background-color: rgba(255, 255, 255, 1) !important;
}

Check it out and let me know if it helped :wink: