Dockery/Homarr
1
0
Fork 0
mirror of https://github.com/ajnart/homarr.git synced 2025-11-11 07:55:52 +01:00
Code Issues Packages Projects Releases Wiki Activity

♻️ Improve header experimental note

Browse Source
This commit is contained in:
Meier Lukas
2023-08-10 19:54:19 +02:00
parent 30c8f5cfdf
commit 558beae12f
2 changed files with 29 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
public/locales/en/layout/header.json
View File

@@ -1,6 +1,6 @@
{ {
"experimentalNote": { "experimentalNote": {
"label": "This is an experimental feature of Homarr. Please report any issues to the official Homarr team." "label": "This is an experimental feature of Homarr. Please report any issues on <gh>GitHub</gh> or <dc>Discord</dc>."
}, },
"search": { "search": {
"label": "Search", "label": "Search",

52
src/components/layout/header/Header.tsx
View File

@@ -2,7 +2,6 @@ import {
Anchor, Anchor,
Box, Box,
Center, Center,
Divider,
Flex, Flex,
Group, Group,
Header, Header,
@@ -12,8 +11,7 @@ import {
} from '@mantine/core'; } from '@mantine/core';
import { useMediaQuery } from '@mantine/hooks'; import { useMediaQuery } from '@mantine/hooks';
import { IconAlertTriangle } from '@tabler/icons-react'; import { IconAlertTriangle } from '@tabler/icons-react';
import { useTranslation } from 'next-i18next'; import { Trans, useTranslation } from 'next-i18next';
import Link from 'next/link';
import { Logo } from '../Common/Logo'; import { Logo } from '../Common/Logo';
import { AvatarMenu } from './AvatarMenu'; import { AvatarMenu } from './AvatarMenu';
@@ -80,27 +78,33 @@ const ExperimentalHeaderNote = ({ visible = false, height = 30 }: ExperimentalHe
return ( return (
<Box bg="red" h={height} p={3} px={6} style={{ overflow: 'hidden' }}> <Box bg="red" h={height} p={3} px={6} style={{ overflow: 'hidden' }}>
<Group position="apart" noWrap> <Flex h="100%" align="center" columnGap={7}>
<Flex h="100%" align="center" columnGap={7}> <IconAlertTriangle color="white" size="1rem" style={{ minWidth: '1rem' }} />
<IconAlertTriangle color="white" size="1rem" style={{ minWidth: '1rem' }} /> <Text color="white" lineClamp={height === 30 ? 1 : 2}>
<Text color="white" lineClamp={height === 30 ? 1 : 2}> <Trans
{t('experimentalNote.label')} t={t}
</Text> i18nKey="experimentalNote.label"
</Flex> components={{
<Group noWrap> gh: (
<Anchor <Anchor
target="_blank" color="inherit"
href="https://github.com/ajnart/homarr/issues/new?assignees=&labels=%F0%9F%90%9B+Bug&projects=&template=bug.yml&title=[Authentication%20beta]:%20%3Ctitle%3E" style={{ textDecoration: 'underline' }}
color="gray.4" target="_blank"
> href="https://github.com/ajnart/homarr/issues/new?assignees=&labels=%F0%9F%90%9B+Bug&projects=&template=bug.yml&title=[Authentication%20Beta]:%20%3Ctitle%3E&version=1.14-beta"
Create issue />
</Anchor> ),
<Divider orientation="vertical" my={5} color="white" opacity={0.4} /> dc: (
<Anchor target="_blank" href="https://discord.com/invite/aCsmEV5RgA" color="gray.4"> <Anchor
Discord color="inherit"
</Anchor> style={{ textDecoration: 'underline' }}
</Group> target="_blank"
</Group> href="https://discord.com/invite/aCsmEV5RgA"
/>
),
}}
/>
</Text>
</Flex>
</Box> </Box>
); );
}; };