mirror of
https://github.com/hedgedoc/hedgedoc.git
synced 2025-05-22 11:15:23 -04:00
Add browser meta tags for favicon and title (#1746)
Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de>
This commit is contained in:
parent
0a4ab9fb0a
commit
194183a7eb
11 changed files with 111 additions and 48 deletions
|
@ -6,15 +6,12 @@
|
|||
|
||||
import React, { Fragment } from 'react'
|
||||
import { Container } from 'react-bootstrap'
|
||||
import { useDocumentTitle } from '../../hooks/common/use-document-title'
|
||||
import { MotdModal } from '../common/motd-modal/motd-modal'
|
||||
import { Footer } from './footer/footer'
|
||||
import { HeaderBar } from './navigation/header-bar/header-bar'
|
||||
import { UiNotifications } from '../notifications/ui-notifications'
|
||||
|
||||
export const LandingLayout: React.FC = ({ children }) => {
|
||||
useDocumentTitle()
|
||||
|
||||
return (
|
||||
<Fragment>
|
||||
<UiNotifications />
|
||||
|
|
25
src/components/layout/base-head.tsx
Normal file
25
src/components/layout/base-head.tsx
Normal file
|
@ -0,0 +1,25 @@
|
|||
/*
|
||||
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
|
||||
*
|
||||
* SPDX-License-Identifier: AGPL-3.0-only
|
||||
*/
|
||||
|
||||
import React from 'react'
|
||||
import Head from 'next/head'
|
||||
import { useAppTitle } from '../../hooks/common/use-app-title'
|
||||
import { FavIcon } from './fav-icon'
|
||||
|
||||
/**
|
||||
* Sets basic browser meta tags.
|
||||
*/
|
||||
export const BaseHead: React.FC = () => {
|
||||
const appTitle = useAppTitle()
|
||||
|
||||
return (
|
||||
<Head>
|
||||
<title>{appTitle}</title>
|
||||
<FavIcon />
|
||||
<meta content='width=device-width, initial-scale=1' name='viewport' />
|
||||
</Head>
|
||||
)
|
||||
}
|
29
src/components/layout/fav-icon.tsx
Normal file
29
src/components/layout/fav-icon.tsx
Normal file
|
@ -0,0 +1,29 @@
|
|||
/*
|
||||
* SPDX-FileCopyrightText: 2022 The HedgeDoc developers (see AUTHORS file)
|
||||
*
|
||||
* SPDX-License-Identifier: AGPL-3.0-only
|
||||
*/
|
||||
|
||||
import React, { Fragment } from 'react'
|
||||
|
||||
/**
|
||||
* Sets meta tags for the favicon.
|
||||
*/
|
||||
export const FavIcon: React.FC = () => {
|
||||
return (
|
||||
<Fragment>
|
||||
<link href='/icons/apple-touch-icon.png' rel='apple-touch-icon' sizes='180x180' />
|
||||
<link href='/icons/favicon-32x32.png' rel='icon' sizes='32x32' type='image/png' />
|
||||
<link href='/icons/favicon-16x16.png' rel='icon' sizes='16x16' type='image/png' />
|
||||
<link href='/icons/site.webmanifest' rel='manifest' />
|
||||
<link href='/icons/favicon.ico' rel='shortcut icon' />
|
||||
<link color='#b51f08' href='/icons/safari-pinned-tab.svg' rel='mask-icon' />
|
||||
<meta name='apple-mobile-web-app-title' content='HedgeDoc' />
|
||||
<meta name='application-name' content='HedgeDoc' />
|
||||
<meta name='msapplication-TileColor' content='#b51f08' />
|
||||
<meta name='theme-color' content='#b51f08' />
|
||||
<meta content='/icons/browserconfig.xml' name='msapplication-config' />
|
||||
<meta content='HedgeDoc - Collaborative markdown notes' name='description' />
|
||||
</Fragment>
|
||||
)
|
||||
}
|
28
src/components/layout/note-and-app-title-head.tsx
Normal file
28
src/components/layout/note-and-app-title-head.tsx
Normal file
|
@ -0,0 +1,28 @@
|
|||
/*
|
||||
* SPDX-FileCopyrightText: 2022 The HedgeDoc developers (see AUTHORS file)
|
||||
*
|
||||
* SPDX-License-Identifier: AGPL-3.0-only
|
||||
*/
|
||||
|
||||
import Head from 'next/head'
|
||||
import React, { useMemo } from 'react'
|
||||
import { useNoteTitle } from '../../hooks/common/use-note-title'
|
||||
import { useAppTitle } from '../../hooks/common/use-app-title'
|
||||
|
||||
/**
|
||||
* Sets the note and app title for the browser window
|
||||
*/
|
||||
export const NoteAndAppTitleHead: React.FC = () => {
|
||||
const noteTitle = useNoteTitle()
|
||||
const appTitle = useAppTitle()
|
||||
|
||||
const noteAndAppTitle = useMemo(() => {
|
||||
return noteTitle + ' - ' + appTitle
|
||||
}, [appTitle, noteTitle])
|
||||
|
||||
return (
|
||||
<Head>
|
||||
<title>{noteAndAppTitle}</title>
|
||||
</Head>
|
||||
)
|
||||
}
|
Loading…
Add table
Add a link
Reference in a new issue