tone/tonePage
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: 优化首页语义化

Browse Source
This commit is contained in:
tone
2025-12-20 22:39:48 +08:00
parent ddc9e613e2
commit 60d8ad8e8a
2 changed files with 33 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
apps/frontend/app/(with-header-footer)/page.tsx
View File

@@ -2,22 +2,36 @@ import Image from 'next/image';
export default function Home() {
return (
<div className="w-full flex-1 flex flex-col items-center justify-center">
<Image
src="/avatar.png"
alt="TONE's avatar"
width={180}
height={180}
className="rounded-full duration-400 size-35 md:size-45 select-none"
priority
quality={100}
/>
<section className="w-full flex-1 flex flex-col items-center justify-center">
<figure className="flex flex-col items-center">
<Image
src="/avatar.png"
alt="TONE 的个人头像"
width={180}
height={180}
className="rounded-full duration-400 size-35 md:size-45 select-none"
priority
quality={100}
/>
</figure>
<h1 className='text-4xl md:text-5xl font-bold mt-5 md:mt-8 gradient-title duration-400 select-none'>特恩(TONE)</h1>
<h2 className='text-lg sm:text-xl md:text-2xl mt-3 font-medium text-zinc-400 duration-400 select-none'>一名在各个领域反复横跳的程序员</h2>
<div className='flex sm:flex-row flex-col gap-2 sm:gap-10 mt-5 md:mt-8 duration-400'>
<a href='https://space.bilibili.com/474156211' target='_black' className='bg-[#488fe9] hover:bg-[#3972ba] text-center text-white w-45 sm:w-32 px-6 py-2 text-lg rounded-full cursor-pointer'>哔哩哔哩</a>
<a href='https://github.com/tonecn' className='bg-[#da843f] hover:bg-[#c87d3e] text-center text-white w-45 sm:w-32 px-6 py-2 text-lg rounded-full cursor-pointer'>GitHub</a>
</div>
</div>
<p className='text-lg sm:text-xl md:text-2xl mt-3 font-medium text-zinc-400 duration-400 select-none'>一名在各个领域反复横跳的程序员</p>
<nav className='flex sm:flex-row flex-col gap-2 sm:gap-10 mt-5 md:mt-8 duration-400' aria-label="社交媒体链接">
<a href='https://space.bilibili.com/474156211'
target='_black'
rel="noopener noreferrer"
className='bg-[#488fe9] hover:bg-[#3972ba] text-center text-white w-45 sm:w-32 px-6 py-2 text-lg rounded-full cursor-pointer'
>
哔哩哔哩
</a>
<a href='https://github.com/tonecn'
target='_black'
rel="noopener noreferrer"
className='bg-[#da843f] hover:bg-[#c87d3e] text-center text-white w-45 sm:w-32 px-6 py-2 text-lg rounded-full cursor-pointer'
>
GitHub
</a>
</nav>
</section>
);
}

8
apps/frontend/app/layout.tsx
View File

@@ -26,7 +26,7 @@ export default async function RootLayout({
const user = await UserAPI.me().catch(() => null);
return (
<html lang="en" suppressHydrationWarning>
<html lang="zh-CN" suppressHydrationWarning>
<link rel="icon" href="/favicon.ico" />
<body
className={`${geistSans.variable} ${geistMono.variable} antialiased min-h-screen flex flex-col`}
@@ -39,10 +39,8 @@ export default async function RootLayout({
enableSystem
disableTransitionOnChange
>
<main className="flex-1 flex flex-col bg-zinc-50">
{children}
<Toaster />
</main>
{children}
<Toaster />
</ThemeProvider>
</ClientProvider>
</body>