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'
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 }) => {
export const NewsPage = () => {
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]">
{children}
<div>News</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 = () => {
return <div>News</div>
return <NewsPage />
}
export default NewsIndexLayout

View File

@ -1,12 +1,30 @@
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 = () => {
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 />
</NewsPage>
</div>
<footer className="grid w-full grid-cols-5 gap-16 bg-[#2E2F7C] px-16 py-20 text-white">
<FooterNewsletter />
<FooterLinks />
</footer>
</main>
)
}