diff --git a/public/images/Logo.png b/public/images/Logo.png new file mode 100644 index 0000000..0737733 Binary files /dev/null and b/public/images/Logo.png differ diff --git a/src/app/(marketing)/layout.tsx b/src/app/(marketing)/layout.tsx index 42946ff..e9a5205 100644 --- a/src/app/(marketing)/layout.tsx +++ b/src/app/(marketing)/layout.tsx @@ -1,8 +1,10 @@ +import { LandingFooter } from "@/components/landing/LandingFooter"; +import { LandingHeader } from "@/components/landing/LandingHeader"; import { LandingWrapper } from "@/components/landing/LandingWrapper"; import { makePageMetadata } from "@/seo/metadata"; export const metadata = makePageMetadata({ - title: "PlanMate — 맞춤형 데일리 플래너", + title: "MyPlanMate — 맞춤형 데일리 플래너", description: "원하는 모듈을 조합해 나만의 플래너를 만드는 PlanMate 랜딩 페이지", canonical: "/", }); @@ -12,7 +14,9 @@ export default function MarketingLayout({ children }: { children: React.ReactNod +
{children}
+ diff --git a/src/components/landing/LandingCopyright.tsx b/src/components/landing/LandingCopyright.tsx new file mode 100644 index 0000000..8290c1d --- /dev/null +++ b/src/components/landing/LandingCopyright.tsx @@ -0,0 +1,11 @@ +import { useCurrentYear } from "@/hooks/useCurrentYear"; + +export function LandingCopyright() { + const year = useCurrentYear(); + + return ( +

+ © {year} MyPlanMate. All rights reserved. +

+ ); +} diff --git a/src/components/landing/LandingFooter.tsx b/src/components/landing/LandingFooter.tsx new file mode 100644 index 0000000..cdba9fb --- /dev/null +++ b/src/components/landing/LandingFooter.tsx @@ -0,0 +1,64 @@ +import { FooterLink } from "@/types/landing"; +import Image from "next/image"; +import Link from "next/link"; +import { LandingCopyright } from "./LandingCopyright"; +import { LandingFooterColumn } from "./LandingFooterColumn"; + +export function LandingFooter() { + const productLinks: FooterLink[] = [ + { label: "기능 소개", href: "/features" }, + { label: "요금제", href: "/pricing" }, + { label: "업데이트", href: "/changelog" }, + ]; + + const supportLinks: FooterLink[] = [ + { label: "FAQ", href: "/faq" }, + { label: "문의하기", href: "/support" }, + { label: "개인정보처리방침", href: "/privacy" }, + ]; + + return ( + + ); +} diff --git a/src/components/landing/LandingFooterColumn.tsx b/src/components/landing/LandingFooterColumn.tsx new file mode 100644 index 0000000..dbfcbce --- /dev/null +++ b/src/components/landing/LandingFooterColumn.tsx @@ -0,0 +1,23 @@ +import { LandingFooterColumnProps } from "@/types/landing"; +import Link from "next/link"; + +export function LandingFooterColumn({ title, links }: LandingFooterColumnProps) { + return ( +
+

{title}

+ +
+ ); +} diff --git a/src/components/landing/LandingHeader.tsx b/src/components/landing/LandingHeader.tsx new file mode 100644 index 0000000..4491af3 --- /dev/null +++ b/src/components/landing/LandingHeader.tsx @@ -0,0 +1,10 @@ +import { cn } from "@/lib/utils"; +import { LandingNavBar } from "./LandingNavBar"; + +export function LandingHeader() { + return ( +
+ +
+ ); +} diff --git a/src/components/landing/LandingNavBar.tsx b/src/components/landing/LandingNavBar.tsx new file mode 100644 index 0000000..3891ab4 --- /dev/null +++ b/src/components/landing/LandingNavBar.tsx @@ -0,0 +1,43 @@ +// src/components/landing/LandingNavBar.tsx +import { cn } from "@/lib/utils"; +import Image from "next/image"; +import Link from "next/link"; + +export function LandingNavBar() { + return ( + + ); +} diff --git a/src/hooks/useCurrentYear.ts b/src/hooks/useCurrentYear.ts new file mode 100644 index 0000000..e519385 --- /dev/null +++ b/src/hooks/useCurrentYear.ts @@ -0,0 +1,3 @@ +export function useCurrentYear(): number { + return new Date().getFullYear(); +} diff --git a/src/lib/variants/button.hero.ts b/src/lib/variants/button.hero.ts index 67a7e80..950b4fb 100644 --- a/src/lib/variants/button.hero.ts +++ b/src/lib/variants/button.hero.ts @@ -17,7 +17,7 @@ export const heroButtonVariants = cva( "bg-[var(--color-white)] text-[var(--color-gray-900)] border border-[var(--color-gray-300)]", // Hover invert (black/white/black) - "hover:bg-[var(--color-black)] hover:text-[var(--color-white)] hover:border-[var(--color-black)]]", + "hover:bg-[var(--color-black)] hover:text-[var(--color-white)] hover:border-[var(--color-black)]", ].join(" "), { variants: { diff --git a/src/types/landing.ts b/src/types/landing.ts index d485d98..5291974 100644 --- a/src/types/landing.ts +++ b/src/types/landing.ts @@ -2,3 +2,13 @@ export type LandingWrapperProps = { children: React.ReactNode; className?: string; }; + +export type FooterLink = { + label: string; + href: string; +}; + +export type LandingFooterColumnProps = { + title: string; + links: FooterLink[]; +};