diff --git a/CONTEXT.md b/CONTEXT.md index 6593116..e52753d 100644 --- a/CONTEXT.md +++ b/CONTEXT.md @@ -222,14 +222,17 @@ time the page renders, with zero code changes. `SectionTitle`'s `enTitle` prop is optional for exactly this reason — these dynamic groups only have one `title` string from the API, not a Persian/ -English pair, so the inline English-caps subtitle just doesn't render for -them. Instead, each carousel shows an English caption *under* the title -(`SectionTitle`'s separate `enSubtitle` prop, `opacity-50`, its own line) — -`StoreSpecialCarousels.englishLabelFromKey()` formats the group's `key` -(e.g. `top-selling` → "TOP SELLING") rather than inventing a translation of -`title`; there's no real localized-English field to translate from, and a -made-up translation would be fabricated data. Skips rendering if the key -has no letters at all (fell back to a bare numeric id). +English pair. Each carousel still shows an English caption using that same +`enTitle` slot (inline, beside the title — the same treatment as every +other section heading on the site, e.g. BlogCarousel's "آخرین مطالب وبلاگ / +LATEST BLOG"; there was a brief detour through a separate "below the title, +opacity-50, own line" `enSubtitle` prop, which the user then asked to match +the existing inline convention instead — don't reintroduce that below-title +variant). `StoreSpecialCarousels.englishLabelFromKey()` formats the group's +`key` (e.g. `top-selling` → "TOP SELLING") rather than inventing a +translation of `title`; there's no real localized-English field to +translate from, and a made-up translation would be fabricated data. Skips +rendering if the key has no letters at all (fell back to a bare numeric id). **Banner interleaving**: the two static-image banner sections (`TwoBanners`, `ThreeBanners`) are rendered *inside* `StoreSpecialCarousels`, one inserted @@ -238,6 +241,14 @@ cycling through the two if there end up being more than two carousels. Don't move them back out to `page.tsx` as fixed-position siblings — that only works for a known, fixed carousel count, which this deliberately isn't. +`SectionTitle`'s title/action row uses `items-center` (not `items-end`) — +needed once carousel titles could carry more content (the inline `enTitle` +caption) than a single line, so bottom-aligning the row left the action +button visibly offset from the title block. The `action` button itself is +styled like the site's other primary buttons (filled `bg-red`, white text, +`rounded-lg` — the same look as `ProductCard`'s "افزودن به سبد"), not a +plain text link. + **"مشاهده همه" (view all)**: each carousel's action button links to `/products?specialId={group.id}`. `store-specials` groups are admin-curated, already-complete lists (the endpoint has no pagination) — there's no @@ -263,6 +274,21 @@ render a `` and browsers aren't guaranteed to prefer the second one, so keeping both was silently serving the stale static icon. Don't add `app/favicon.ico` (or `public/favicon.ico`) back. +## Footer: Meshkee credit widget + +The footer's bottom-right link ("Designed And Developed By Meshkee +E-Commerce Team" → `https://meshkee.com`) intentionally matches the credit +badge Meshkee's own storefronts use elsewhere (reference: safeteb.com) — +same markup shape (frame + logo + two-line label), same animated corner +border (four 1px lines that draw in on hover, staggered L→B→R→T, and +un-draw in reverse on mouse-leave via matching `transition-delay`s on the +resting state). `public/images/meshkee-logo-white.png` is that reference +site's own logo asset, pulled down and committed here since it's the +platform's shared credit-widget logo, not something unique to safeteb.com. +If this ever needs to change, re-derive the exact hover-timing values from +a live Meshkee site rather than guessing new ones — the staggered reverse +un-draw is the distinctive part, not just "a border that appears." + ## Route map | Route | Notes | diff --git a/public/images/meshkee-logo-white.png b/public/images/meshkee-logo-white.png new file mode 100644 index 0000000..a10ecd3 Binary files /dev/null and b/public/images/meshkee-logo-white.png differ diff --git a/src/components/home/Footer.tsx b/src/components/home/Footer.tsx index 9f05520..6502483 100644 --- a/src/components/home/Footer.tsx +++ b/src/components/home/Footer.tsx @@ -116,10 +116,30 @@ export function Footer({ - Powered by meshkee.com + diff --git a/src/components/home/StoreSpecialCarousels.tsx b/src/components/home/StoreSpecialCarousels.tsx index 0654c4b..67d2a68 100644 --- a/src/components/home/StoreSpecialCarousels.tsx +++ b/src/components/home/StoreSpecialCarousels.tsx @@ -11,8 +11,9 @@ import { productHref, type ProductGroup, type StaticImageWithUrl } from "@/lib/m // localized English field to pull a real translation from, and inventing // one would be fabricated data. `key` is real data and usually a readable // English slug (e.g. "top-selling"), so it's what gets formatted into the -// English caption under the title. Skip it if the key has no letters at -// all (e.g. it fell back to a bare numeric id). +// English caption beside the title (same inline treatment as every other +// section heading on the site, e.g. BlogCarousel's "LATEST BLOG"). Skip it +// if the key has no letters at all (e.g. it fell back to a bare numeric id). function englishLabelFromKey(key: string): string | undefined { const label = key.replace(/[-_]+/g, " ").trim(); return /[a-zA-Z]/.test(label) ? label.toUpperCase() : undefined; @@ -58,7 +59,7 @@ export function StoreSpecialCarousels({
diff --git a/src/components/ui/SectionTitle.tsx b/src/components/ui/SectionTitle.tsx index 2d621e3..4559dec 100644 --- a/src/components/ui/SectionTitle.tsx +++ b/src/components/ui/SectionTitle.tsx @@ -1,24 +1,14 @@ type SectionTitleProps = { title: string; enTitle?: string; - // Shown on its own line under the title (not inline like enTitle), at 50% - // opacity — used for the homepage's dynamic store-specials carousels. - enSubtitle?: string; subtitle?: string; action?: string; actionHref?: string; }; -export function SectionTitle({ - title, - enTitle, - enSubtitle, - subtitle, - action, - actionHref, -}: SectionTitleProps) { +export function SectionTitle({ title, enTitle, subtitle, action, actionHref }: SectionTitleProps) { return ( -
+

{title}

@@ -32,15 +22,6 @@ export function SectionTitle({ )}
- {enSubtitle && ( -

- {enSubtitle} -

- )} {subtitle && (

{subtitle}

)} @@ -48,7 +29,7 @@ export function SectionTitle({ {action && actionHref && ( {action} ←