Hide Opening Hours

Ask the Community Customization
1

  • Issue description:
    I know your current Store Locator app doesn’t have 24 hours option. So, it can be quite confusing to people to see “Open until 11:59 PM”. Is there a way to hide the opening hours for the NamNam Changi Airport (the 4th one shown in the link or the attached screenshot)?

  • Link to the page with the widget in question:

  • Outlet Locator | Vietnamese Food, Restaurant Singapore

CleanShot 2025-06-12 at 19.18.15@2x
CleanShot 2025-06-12 at 19.18.15@2x892×1304 219 KB

1 Like
2

I agree, this is unfortunate that 24/7 option is not available at the moment. Am I right that you’d love to hide this info only for specific stores that are open 24/7?

4

If so, here’s the code that hides the openning hours info for the items with the 24 hours badge:

[class*="location-preview__Title-sc"]:has([class*="badge__StyledBadge-sc"]) + [class*="location-preview__Metainfo-sc"] {
  display: none;
}
6

Although it worked, it presented another issue after that.

Please see the screenshot below. You can see that now there’s an empty space right after the tel no. Can the address be brought lower to make it look more balanced like “NamNam Takashimaya”

CleanShot 2025-06-12 at 20.54.35@2x
CleanShot 2025-06-12 at 20.54.35@2x774×800 98.5 KB

When I click on the outlet, the opening hours are not hidden. Can I hide this, too?

CleanShot 2025-06-12 at 20.54.09@2x
CleanShot 2025-06-12 at 20.54.09@2x736×1150 117 KB

1 Like
7

Oh, I see. I’ve shared this issue with the developers, and I’ll get back to you when I have a solution :slight_smile:

8

Hi @MelvinNeo,

We’ve updated the CSS code to hide the opening hours in the popup as well. Here’s the code we used:

.global-styles,
[class*="business-logo-image__DefaultLogo-sc"] {
width: 60px !important;
}

.active [class*="marker__Container-sc"] [class*='marker__MarkerBody-sc'] path {   fill: #421400 !important; }

[class*='marker__Icon-sc'] svg {
  height: 2em;
  width: 2em;
}

.global-styles,
[class*="location-card-popup__ScrollableWrapper-sc"]:has([class*="badge__StyledBadge-sc"]) [class*="content__Block-sc"]:has([class*="status-indicator__Container-sc"]),
[class*="location-preview__Title-sc"]:has([class*="badge__StyledBadge-sc"]) + [class*="location-preview__Metainfo-sc"] {
  display: none;
}

As for an empty space, I’m afraid it goes from the image. Here’s the code that can help you reduce the image height:

[class*="location-preview__StyledLocationPreviewImageLayout-sc"]:has([class*="badge__StyledBadge-sc"]) [class*="location-preview-image-layout__StyledMediaImage-sc"] {
  padding-top: 100px !important;
}

Let me know if it helped :slight_smile:

1 Like
9

Hi,

It helped. Thank you.

1 Like