[Resolved] Mobile website has inverted colors

[Jason]

Hello!

The aesthetics between the desktop/tablet sites and the mobile site look quite different, with the mobile site inverting the colors on many of the pictures, as well as the site background color itself.

The site is loclwatch.com if you’re able to visit on a desktop. I’ve attached a screenshot of the mobile view – the whole background is dark and all the text is light. Some of the pictures’ colors are also inverted.

Is there a way to control this?

Thanks, and so far loving GP!

Jason

[Jason]

The Dropbox link below includes the site screenshot.

LOCL Screenshot

[David]

Hi there,

i am not seeing that on my phone… are you using a Dark Mode extension on the browser ?

[Jason]

Ha, I was hoping it would be something simple. That was it, thanks for your help!

Can I hijack this thread for one additional question or should I create a new one? In case I can, I think it should be quick – in the attached screenshot, I cannot seem to add spacing between the picture and the heading. The two sections of grid are next to each other on larger screens, but on mobile they are vertical and the spacing section is not having an impact.

Thanks again!

Jason

[David]

Theres a few options.
Simplest one – select the Grid Block ( not the individual on containers within the grid ) – and increase the vertical gap:

https://docs.generateblocks.com/article/grid-overview/#vertical-gap

You can apply this to just Mobile, by selecting the mobile tab first.

[Jason]

You’re awesome, thanks again!

[David]

You’re welcome

[Author]

Posts