diff --git a/frontend/public/locales/en/common.json b/frontend/public/locales/en/common.json index 23b623dc27804e6390f5ce5422ae88d408e85172..713a15ba11df4cc1687f3576cf281ae912279930 100644 --- a/frontend/public/locales/en/common.json +++ b/frontend/public/locales/en/common.json @@ -8,8 +8,8 @@ }, "fnr": "National identity number", "header": { - "applicationTitleShort": "GREG", - "applicationTitleLong": "Guest Registration", + "applicationTitle": "Guest Registration", + "applicationDescription": "Registration service for guests", "selectLanguage": "Select language" }, "loading": "Loading...", diff --git a/frontend/public/locales/nb/common.json b/frontend/public/locales/nb/common.json index d916c4911609a188677a2bbf3dffcdf27761dbc4..57d358c0dd322350f45ef0216625428a6e76b6ea 100644 --- a/frontend/public/locales/nb/common.json +++ b/frontend/public/locales/nb/common.json @@ -8,8 +8,8 @@ }, "fnr": "Fødselsnummer", "header":{ - "applicationTitleShort": "GREG", - "applicationTitleLong": "Gjesteregistrering", + "applicationTitle": "Gjesteregistrering", + "applicationDescription": "Registreringstjeneste for gjester", "selectLanguage": "Velg språk" }, "loading": "Laster...", diff --git a/frontend/public/locales/nn/common.json b/frontend/public/locales/nn/common.json index db11f21eacd26a8402d7d1244315094909efbe62..2e76d48dfcb7f5e3e9582083fdffa687b333cb54 100644 --- a/frontend/public/locales/nn/common.json +++ b/frontend/public/locales/nn/common.json @@ -9,8 +9,8 @@ }, "fnr": "National identity number", "header":{ - "applicationTitleShort": "GREG", - "applicationTitleLong": "Gjesteregistrering", + "applicationTitle": "Gjesteregistrering", + "applicationDescription": "Registreringsteneste for gjester", "selectLanguage": "Velg språk" }, "loading": "Lastar...", diff --git a/frontend/src/routes/components/header.tsx b/frontend/src/routes/components/header.tsx index 0a4f62cbdfa3e2ff31d8a8d7a05155ed1abf5361..bb96b6b82cbf60461f09d60366b50d5187da2619 100644 --- a/frontend/src/routes/components/header.tsx +++ b/frontend/src/routes/components/header.tsx @@ -1,10 +1,10 @@ import React from 'react' +import { Link } from 'react-router-dom' import styled from 'styled-components/macro' import { useTranslation } from 'react-i18next' import LogoBar from '../../components/logobars/LogoBar' import LanguageSelector from '../../components/languageselector' - const MainWrapper = styled.div` color: ${({ theme }) => theme.page.headerColor}; background-color: ${({ theme }) => theme.page.headerBackgroundColor}; @@ -14,8 +14,9 @@ const Main = styled.div` display: flex; justify-content: space-between; margin: 0 auto; - max-width: ${props => props.theme.appMaxWidth}; - padding: ${props => `0.5rem ${props.theme.horizontalPadding} 1rem ${props.theme.horizontalPadding}`}; + max-width: ${(props) => props.theme.appMaxWidth}; + padding: ${(props) => + `0.5rem ${props.theme.horizontalPadding} 1rem ${props.theme.horizontalPadding}`}; ` const Menu = styled.ul` @@ -33,15 +34,15 @@ const TitleBox = styled.div` padding-left: 3rem; ` -const ShortTitle = styled.div` +const Title = styled.div` font-size: 2rem; ` -const LongTitle = styled.div` +const Description = styled.div` font-size: 1rem; ` -function Header() { +const Header = () => { const { t } = useTranslation('common') return ( @@ -50,12 +51,14 @@ function Header() { <MainWrapper> <Main> <TitleBox> - <ShortTitle>{t('header.applicationTitleShort')}</ShortTitle> - <LongTitle>{t('header.applicationTitleLong')}</LongTitle> + <Link to="/"> + <Title>{t('header.applicationTitle')}</Title> + </Link> + <Description>{t('header.applicationDescription')}</Description> </TitleBox> <Menu> <MenuItem> - <LanguageSelector/> + <LanguageSelector /> </MenuItem> </Menu> </Main>