Custom CSS works as expect on browser, not on Plash (https://zoom.earth/maps/temperature-feel/)

[fmaiabatista]

Describe the bug

I'm trying to use this page on Plash: https://zoom.earth/maps/temperature-feel/, and I have created a custom CSS to make it look nicer. The styles work when I view the page on the browser, but not when I add them to the CSS field on Plash.

Also, there's also something happening that I'm always greeted with the "Welcome" popup - which is something I can't even reproduce again on the browser even if I clear all application data + local/session storages

To reproduce

Steps to reproduce the behavior:

1. Go to https://zoom.earth/maps/temperature-feel/
2. Add the custom CSS styles below via DevTools

.panel,
button,
div.group,
.footer-coordinate,
footer,
.tooltip {
  display: none !important;
}

div.legend.celsius {
  position: relative !important;
  top: calc(100vh - 28px) !important;
}

3. Check that the elements will properly hide/be repositioned (screenshot).
4. Add the site to Plash, add the same CSS in the CSS box.
5. Verify that the screen will not be the same, the elements will not be affected by the CSS.

Expected behavior

View should be the same between browser and Plash.

Screenshots

Default view:

View with custom CSS on browser:

When I add it to Plash with the custom CSS, this is how it looks:

In addition, whenever it reloads I see the "Welcome" popup again:

Info

• macOS version: Sonoma 14.6.1
• Plash version: 2.15.0 (57)
• Using on the second monitor only (LG HDR WQHD)
• Chrome: Version 131.0.6778.109 (Official Build) (x86_64)

Additional context

N/A

Thanks for your help!

[sindresorhus]

If you right-click when in "browsing mode" in Plash, you can access dev tools there and try out the CSS there too.

[fmaiabatista]

Hey, thanks for the quick reply

I just tried it and when I apply it to the CSS devtools panel within Plash, it works:

Then when the site reloads, it's back to the "wrong view":