Add common header to manage pages

This commit is contained in:
Manuel
2023-07-30 16:30:48 +02:00
parent d100d41ce6
commit fc70a34e7d
4 changed files with 33 additions and 13 deletions

View File

@@ -46,6 +46,7 @@ import { useScreenLargerThan } from '~/hooks/useScreenLargerThan';
import { usePackageAttributesStore } from '~/tools/client/zustands/usePackageAttributesStore'; import { usePackageAttributesStore } from '~/tools/client/zustands/usePackageAttributesStore';
import { Logo } from '../Logo'; import { Logo } from '../Logo';
import { CommonHeader } from '../common-header';
import { MainHeader } from '../new-header/Header'; import { MainHeader } from '../new-header/Header';
interface MainLayoutProps { interface MainLayoutProps {
@@ -140,17 +141,7 @@ export const MainLayout = ({ children }: MainLayoutProps) => {
); );
return ( return (
<> <>
<Head> <CommonHeader />
<link rel="shortcut icon" href="/imgs/favicon/favicon.svg" />
<link rel="manifest" href="/site.webmanifest" />
{/* configure apple splash screen & touch icon */}
<link rel="apple-touch-icon" href="/imgs/favicon/favicon.svg" />
<meta name="apple-mobile-web-app-title" content="Homarr" />
<meta name="apple-mobile-web-app-capable" content="yes" />
</Head>
<AppShell <AppShell
styles={{ styles={{
root: { root: {

View File

@@ -0,0 +1,24 @@
import Head from 'next/head';
import { ReactNode } from 'react';
interface CommonHeaderProps {
children?: ReactNode;
}
export const CommonHeader = ({ children }: CommonHeaderProps) => {
return (
<Head>
<link rel="shortcut icon" href="/imgs/favicon/favicon.svg" />
<link rel="manifest" href="/site.webmanifest" />
{/* configure apple splash screen & touch icon */}
<link rel="apple-touch-icon" href="/imgs/favicon/favicon.svg" />
<meta name="apple-mobile-web-app-title" content="Homarr" />
<meta name="apple-mobile-web-app-capable" content="yes" />
{children}
</Head>
);
};

View File

@@ -19,6 +19,7 @@ import { useTranslation } from 'next-i18next';
import { serverSideTranslations } from 'next-i18next/serverSideTranslations'; import { serverSideTranslations } from 'next-i18next/serverSideTranslations';
import { useRouter } from 'next/router'; import { useRouter } from 'next/router';
import { z } from 'zod'; import { z } from 'zod';
import { CommonHeader } from '~/components/layout/common-header';
import { signInSchema } from '~/validations/user'; import { signInSchema } from '~/validations/user';
import { loginNamespaces } from '../../tools/server/translation-namespaces'; import { loginNamespaces } from '../../tools/server/translation-namespaces';
@@ -44,6 +45,9 @@ export default function LoginPage() {
return ( return (
<Flex h="100dvh" display="flex" w="100%" direction="column" align="center" justify="center"> <Flex h="100dvh" display="flex" w="100%" direction="column" align="center" justify="center">
<CommonHeader>
<title>Login Homarr</title>
</CommonHeader>
<Card withBorder shadow="md" p="xl" radius="md" w="90%" maw={420}> <Card withBorder shadow="md" p="xl" radius="md" w="90%" maw={420}>
<Title align="center" weight={900}> <Title align="center" weight={900}>
{t('title')} {t('title')}

View File

@@ -3,6 +3,7 @@ import Head from 'next/head';
import { forwardRef } from 'react'; import { forwardRef } from 'react';
import { AccessibilitySettings } from '~/components/Settings/Customization/Accessibility/AccessibilitySettings'; import { AccessibilitySettings } from '~/components/Settings/Customization/Accessibility/AccessibilitySettings';
import { MainLayout } from '~/components/layout/admin/main-admin.layout'; import { MainLayout } from '~/components/layout/admin/main-admin.layout';
import { CommonHeader } from '~/components/layout/common-header';
import { languages } from '~/tools/language'; import { languages } from '~/tools/language';
const PreferencesPage = () => { const PreferencesPage = () => {
@@ -15,9 +16,9 @@ const PreferencesPage = () => {
})); }));
return ( return (
<MainLayout> <MainLayout>
<Head> <CommonHeader>
<title>Preferences Homarr</title> <title>Preferences Homarr</title>
</Head> </CommonHeader>
<Title mb="xl">Preferences</Title> <Title mb="xl">Preferences</Title>
<Stack spacing={5}> <Stack spacing={5}>