When I first launch the page it doesn’t show the stylings, but if I go to another page and return to the first, it shows well
I am using styled components, and I’m initializing the whole thing in gatsby-browser.js and gatsby-ssr.js
---- gatsby-browser.js/gatsby-ssr.js:
import React from "react"
import Layout from "./src/components/Layout"
import { GlobalStyles, globalTheme } from "./src/globals/globalStyles"
import { ThemeProvider } from "styled-components"
import GlobalContextProvider from "./src/globals/globalContextProvider"
export const wrapRootElement = ({ element }) => {
return (
<ThemeProvider theme={globalTheme}>
<GlobalStyles />
<GlobalContextProvider>
<Layout>{element}</Layout>
</GlobalContextProvider>
</ThemeProvider>
)
}
The first page would be About Us, so the pages index.js and about.js are literally the same
In the next image, on the left is the page as it shows for the first launch, on the right, as it shows when navigating to another page and returning to the first one
The site name is: https://dainty-smakager-18ee0d.netlify.app/
The GitHub address is: https://github.com/rafaelsoteldosilva/serenity-gb-without-model