feat: restructure News layout with new header and footer components; remove redundant files

This commit is contained in:
Ardeman 2025-02-03 17:01:56 +08:00
parent d9070b1b49
commit 7ee342f493
9 changed files with 29 additions and 33 deletions

View File

@ -1,31 +1,7 @@
import React, { type FC, type PropsWithChildren } from 'react' export const NewsPage = () => {
import { FooterLinks } from './footer-links'
import { FooterNewsletter } from './footer-newsletter'
import { HeaderMenu } from './header-menu'
import { HeaderTop } from './header-top'
export const NewsPage: FC<PropsWithChildren> = ({ children }) => {
return ( return (
<main className="relative min-h-dvh bg-[#ECECEC]">
<header>
<HeaderTop />
<HeaderMenu />
</header>
<div className="mx-[50px] my-[25px] grid gap-y-[25px]">
<img
src="/images/banner.png"
alt="banner"
className="h-[100px] w-full object-contain"
/>
<div className="border-[.2px] border-black bg-white p-[30px]"> <div className="border-[.2px] border-black bg-white p-[30px]">
{children} <div>News</div>
</div> </div>
</div>
<footer className="grid w-full grid-cols-5 gap-16 bg-[#2E2F7C] px-16 py-20 text-white">
<FooterNewsletter />
<FooterLinks />
</footer>
</main>
) )
} }

View File

@ -1,5 +1,7 @@
import { NewsPage } from '~/pages/news'
const NewsIndexLayout = () => { const NewsIndexLayout = () => {
return <div>News</div> return <NewsPage />
} }
export default NewsIndexLayout export default NewsIndexLayout

View File

@ -1,12 +1,30 @@
import { Outlet } from 'react-router' import { Outlet } from 'react-router'
import { NewsPage } from '~/pages/news' import { FooterLinks } from '~/layouts/footer-links'
import { FooterNewsletter } from '~/layouts/footer-newsletter'
import { HeaderMenu } from '~/layouts/header-menu'
import { HeaderTop } from '~/layouts/header-top'
const NewsLayout = () => { const NewsLayout = () => {
return ( return (
<NewsPage> <main className="relative min-h-dvh bg-[#ECECEC]">
<header>
<HeaderTop />
<HeaderMenu />
</header>
<div className="mx-[50px] my-[25px] grid gap-y-[25px]">
<img
src="/images/banner.png"
alt="banner"
className="h-[100px] w-full object-contain"
/>
<Outlet /> <Outlet />
</NewsPage> </div>
<footer className="grid w-full grid-cols-5 gap-16 bg-[#2E2F7C] px-16 py-20 text-white">
<FooterNewsletter />
<FooterLinks />
</footer>
</main>
) )
} }