feat: update logo component to support caption display in footer

- Modified the Logo component to accept a new 'hasCaption' prop for conditional rendering of a caption.
- Updated the FooterSection to utilize the new 'hasCaption' prop, enhancing the logo presentation with additional text and a separator.
This commit is contained in:
2026-02-08 19:54:54 +03:30
parent ec6e121993
commit 0e2ea9b85b
2 changed files with 15 additions and 3 deletions
+1 -1
View File
@@ -20,7 +20,7 @@ export default function FooterSection() {
return ( return (
<footer className="py-16 md:py-16 bg-muted border-t"> <footer className="py-16 md:py-16 bg-muted border-t">
<div className="mx-auto max-w-5xl px-6 flex items-center flex-col"> <div className="mx-auto max-w-5xl px-6 flex items-center flex-col">
<Logo className="mx-auto" /> <Logo hasCaption className="mx-auto" />
<div className="my-4 flex flex-wrap justify-center gap-6 text-sm"> <div className="my-4 flex flex-wrap justify-center gap-6 text-sm">
{links.map((link, index) => ( {links.map((link, index) => (
+14 -2
View File
@@ -1,18 +1,30 @@
import { cn } from "@/lib/utils"; import { cn } from "@/lib/utils";
import Image from "next/image"; import Image from "next/image";
import Link from "next/link"; import Link from "next/link";
import { Separator } from "./ui/separator";
export const Logo = ({ export const Logo = ({
className, className,
uniColor, uniColor,
hasCaption
}: { }: {
className?: string; className?: string;
uniColor?: boolean; uniColor?: boolean;
hasCaption?: boolean;
}) => { }) => {
const _feep = <span className="font-bold text-xl leading-tight">فـــیــپ</span>
return ( return (
<Link href="/" className="flex items-center"> <Link href="/" className={`flex items-center ${hasCaption ? 'flex-col' : 'gap-2'}`}>
<LogoIcon className={className} uniColor={uniColor} /> <LogoIcon className={className} uniColor={uniColor} />
<span className="font-bold text-xl">فـــیــپ</span> {hasCaption ?
<span className="flex flex-col items-center">
{_feep}
<span className="text-xs text-muted-foreground font-normal leading-tight">
داده‌ها فهمیده می‌شوند
</span>
<Separator className="mt-2 max-w-10" />
</span>
: _feep}
</Link> </Link>
); );
}; };