amirhosein.ashourlooandClaude Sonnet 5
d090f57540
- New shared SVG icon set (src/components/ui/icons.tsx): Menu, User, Cart, Close, ChevronLeft — replaces emoji (☰ 👤 🛒 ✕) across the header, and the literal "←" text arrow on every "view more"-style link (SectionTitle's action, the mega-menu link, BlogCarousel's "ادامه مطلب"). - Header desktop account/cart area redesigned as a borderless chip: cart icon button (right) + divider + account icon-badge/two-line "حساب کاربری / ورود/ثبتنام" (left), matching a supplied reference. Got the RTL DOM order backwards on the first pass (cart needs to be first in DOM to render rightmost) and corrected it. - Header logo: -10px (was already doubled from an earlier request). - Footer: background is now bg-[#9a21291a] (exact hex given, not a token substitute) with black text throughout instead of solid dark-red/white; footer logo doubled; the meshkee-credit logo gets brightness-0 so the white source asset stays visible on the new light background. - Fixed a real layout bug: <main> had no flex-1, so on any page shorter than the viewport the footer stuck to the content instead of the bottom of the screen, leaving a gap of bare background beneath it. Standard sticky-footer flex fix. - CONTEXT.md: documented the icon set, the account/cart chip's RTL DOM ordering (to stop this regressing again), and the footer's new color scheme + the flex-1 fix. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
43 lines
1.2 KiB
TypeScript
43 lines
1.2 KiB
TypeScript
import { ChevronLeftIcon } from "@/components/ui/icons";
|
|
|
|
type SectionTitleProps = {
|
|
title: string;
|
|
enTitle?: string;
|
|
subtitle?: string;
|
|
action?: string;
|
|
actionHref?: string;
|
|
};
|
|
|
|
export function SectionTitle({ title, enTitle, subtitle, action, actionHref }: SectionTitleProps) {
|
|
return (
|
|
<div className="mb-6 flex items-center justify-between gap-4">
|
|
<div>
|
|
<div className="flex flex-wrap items-baseline gap-x-3 gap-y-1">
|
|
<h2 className="text-xl font-bold text-red-dark md:text-2xl">{title}</h2>
|
|
{enTitle && (
|
|
<span
|
|
className="font-display text-sm font-semibold tracking-wide text-red-dark/30 uppercase md:text-base"
|
|
lang="en"
|
|
dir="ltr"
|
|
>
|
|
{enTitle}
|
|
</span>
|
|
)}
|
|
</div>
|
|
{subtitle && (
|
|
<p className="mt-1 text-sm text-muted">{subtitle}</p>
|
|
)}
|
|
</div>
|
|
{action && actionHref && (
|
|
<a
|
|
href={actionHref}
|
|
className="flex shrink-0 items-center gap-1.5 rounded-lg bg-red px-4 py-2 text-sm font-medium text-white transition-colors hover:bg-red-dark"
|
|
>
|
|
{action}
|
|
<ChevronLeftIcon className="h-4 w-4" />
|
|
</a>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|