1
0
mirror of https://github.com/stonith404/pingvin-share.git synced 2024-10-03 18:00:15 +02:00

fix: prevent zoom on input field click on mobile

This commit is contained in:
Elias Schneider 2024-02-11 16:22:19 +01:00
parent e663da45b1
commit 9c734ec439
No known key found for this signature in database
GPG Key ID: 07E623B294202B6C

View File

@ -12,6 +12,7 @@ import { getCookie, setCookie } from "cookies-next";
import { GetServerSidePropsContext } from "next"; import { GetServerSidePropsContext } from "next";
import type { AppProps } from "next/app"; import type { AppProps } from "next/app";
import getConfig from "next/config"; import getConfig from "next/config";
import Head from "next/head";
import { useRouter } from "next/router"; import { useRouter } from "next/router";
import { useEffect, useRef, useState } from "react"; import { useEffect, useRef, useState } from "react";
import { IntlProvider } from "react-intl"; import { IntlProvider } from "react-intl";
@ -41,7 +42,7 @@ function App({ Component, pageProps }: AppProps) {
const [route, setRoute] = useState<string>(pageProps.route); const [route, setRoute] = useState<string>(pageProps.route);
const [configVariables, setConfigVariables] = useState<Config[]>( const [configVariables, setConfigVariables] = useState<Config[]>(
pageProps.configVariables, pageProps.configVariables
); );
useEffect(() => { useEffect(() => {
@ -80,57 +81,65 @@ function App({ Component, pageProps }: AppProps) {
const language = useRef(pageProps.language); const language = useRef(pageProps.language);
return ( return (
<IntlProvider <>
messages={i18nUtil.getLocaleByCode(language.current)?.messages} <Head>
locale={language.current} <meta
defaultLocale={LOCALES.ENGLISH.code} name="viewport"
> content="minimum-scale=1, initial-scale=1, width=device-width, user-scalable=no"
<MantineProvider />
withGlobalStyles </Head>
withNormalizeCSS <IntlProvider
theme={{ colorScheme, ...globalStyle }} messages={i18nUtil.getLocaleByCode(language.current)?.messages}
locale={language.current}
defaultLocale={LOCALES.ENGLISH.code}
> >
<ColorSchemeProvider <MantineProvider
colorScheme={colorScheme} withGlobalStyles
toggleColorScheme={toggleColorScheme} withNormalizeCSS
theme={{ colorScheme, ...globalStyle }}
> >
<GlobalStyle /> <ColorSchemeProvider
<Notifications /> colorScheme={colorScheme}
<ModalsProvider> toggleColorScheme={toggleColorScheme}
<ConfigContext.Provider >
value={{ <GlobalStyle />
configVariables, <Notifications />
refresh: async () => { <ModalsProvider>
setConfigVariables(await configService.list()); <ConfigContext.Provider
},
}}
>
<UserContext.Provider
value={{ value={{
user, configVariables,
refreshUser: async () => { refresh: async () => {
const user = await userService.getCurrentUser(); setConfigVariables(await configService.list());
setUser(user);
return user;
}, },
}} }}
> >
{excludeDefaultLayoutRoutes.includes(route) ? ( <UserContext.Provider
<Component {...pageProps} /> value={{
) : ( user,
<> refreshUser: async () => {
<Header /> const user = await userService.getCurrentUser();
<Container> setUser(user);
<Component {...pageProps} /> return user;
</Container> },
</> }}
)} >
</UserContext.Provider> {excludeDefaultLayoutRoutes.includes(route) ? (
</ConfigContext.Provider> <Component {...pageProps} />
</ModalsProvider> ) : (
</ColorSchemeProvider> <>
</MantineProvider> <Header />
</IntlProvider> <Container>
<Component {...pageProps} />
</Container>
</>
)}
</UserContext.Provider>
</ConfigContext.Provider>
</ModalsProvider>
</ColorSchemeProvider>
</MantineProvider>
</IntlProvider>
</>
); );
} }
@ -165,7 +174,7 @@ App.getInitialProps = async ({ ctx }: { ctx: GetServerSidePropsContext }) => {
pageProps.route = ctx.req.url; pageProps.route = ctx.req.url;
const requestLanguage = i18nUtil.getLanguageFromAcceptHeader( const requestLanguage = i18nUtil.getLanguageFromAcceptHeader(
ctx.req.headers["accept-language"], ctx.req.headers["accept-language"]
); );
pageProps.language = ctx.req.cookies["language"] ?? requestLanguage; pageProps.language = ctx.req.cookies["language"] ?? requestLanguage;