feat: 修改底部版权区域,使用 Wrap 组件来实现文字间的间隔,把结束年份动态获取当前年份

This commit is contained in:
HouKunLin 2023-05-16 16:21:42 +08:00
parent 67b87f685d
commit 29bce26acb

View File

@ -1,8 +1,9 @@
import { Center, Flex, Link, Text } from '@chakra-ui/react'; import { Center, Flex, Link, Text, Wrap, WrapItem } from '@chakra-ui/react';
import { Suspense } from 'react'; import { Suspense, useMemo } from 'react';
import { SDKVersion } from './SDKVersion'; import { SDKVersion } from './SDKVersion';
export function Footer() { export function Footer() {
const year = useMemo(() => new Date().getFullYear(), []);
return ( return (
<Center height="footer.container"> <Center height="footer.container">
<Center <Center
@ -18,23 +19,23 @@ export function Footer() {
flexDir="column" flexDir="column"
> >
<Flex as={Text}> <Flex as={Text}>
{'音乐解锁 (__APP_VERSION_SHORT__'} (__APP_VERSION_SHORT__
<Suspense> <Suspense>
<SDKVersion /> <SDKVersion />
</Suspense> </Suspense>
{') - 移除已购音乐的加密保护。'} ) -
</Flex> </Flex>
<Text> <Wrap>
{'Copyright © 2019 - 2023 '} <WrapItem>Copyright © 2019 - {year}</WrapItem>
<Link href="https://git.unlock-music.dev/um" isExternal> <WrapItem>
UnlockMusic <Link href="https://git.unlock-music.dev/um" isExternal>UnlockMusic </Link>
</Link> </WrapItem>
{' | 音乐解锁授权基于'} <WrapItem>|</WrapItem>
<Link href="https://git.unlock-music.dev/um/um-react/src/branch/main/LICENSE" isExternal> <WrapItem></WrapItem>
MIT许可协议 <WrapItem>
</Link> <Link href="https://git.unlock-music.dev/um/um-react/src/branch/main/LICENSE" isExternal>MIT许可协议</Link>
</WrapItem>
</Text> </Wrap>
</Center> </Center>
</Center> </Center>
); );