Gatsby Tricks: Viewport, CSS Modules Transition And i18n Tricks

Overriding Viewport settings, CSS modules transition and an i18n formatting tricks with Gatsby

Photo by Ronald Ladines on Unsplash

I share one trick a day until the end of the COVID-19 quarantine in Switzerland, April 19th 2020. Twenty-four days left until hopefully better days.

Today I developed further the new website I’m currently building with Gatsby for a new side project we have with two friends. I discovered some new tricks, that’s why there are the inspiration for my today’s diary entry.

Overriding Viewport

After a couple of hours of development, I had a basic website ready and even had developed the welcome page. I tested it across browsers and simulated different devices in Chrome, everything went fine until I tried out iPads.

I was a bit surprise because it did worked out everywhere else. As a skeptical person, of course my first reaction was “that’s probably a Chrome bug” (🤣), therefore I opened XCode and ran the same test on the simulator. To my surprise, the problem was still happening.

Concretely the following was happening.