diff --git a/CONTEXT.md b/CONTEXT.md index e52753d..b9298fb 100644 --- a/CONTEXT.md +++ b/CONTEXT.md @@ -180,6 +180,28 @@ persistent memory as "for all the user's sites", not just this one) in the array — first DOM child renders rightmost under `dir="rtl"`). - Category tile images: 110px, no border, no border-radius (`FeaturedCategories.tsx`). +- **No emoji as icons** — `src/components/ui/icons.tsx` has the shared + light/outline SVG set (`MenuIcon`, `UserIcon`, `CartIcon`, `CloseIcon`, + `ChevronLeftIcon`), 24x24 viewBox, `stroke="currentColor"`. Use these + instead of characters like "☰"/"👤"/"🛒"/"✕". Every "view more"-style + link/button (`SectionTitle`'s `action`, the mega-menu's "مشاهده همه", + `BlogCarousel`'s "ادامه مطلب") uses `ChevronLeftIcon`, not a literal "←" + character — keep new ones consistent with that. +- **Header account/cart cluster** (`Header.tsx`, desktop only — + `hidden ... sm:flex`): a borderless `bg-surface` chip holding, in this + exact DOM order, `CartButton`, a divider, then the login link. That DOM + order is deliberate and easy to get backwards: under `dir="rtl"` the + first DOM child renders rightmost, so cart-first-in-DOM is what actually + puts the cart icon on the visual **right** and the login block on the + **left** (this was built backwards once and corrected). Same rule inside + the login link itself — the icon badge comes before the two-line text in + DOM so the icon renders right of the text. Neither `CartButton` nor this + wrapper has a border (removed on request — don't reintroduce one). + `CartButton` is a fixed 44px (`h-11 w-11`) icon-only square everywhere it + renders (also stands alone, un-wrapped, below `sm`); its unread-count + badge sits at `-top-1.5 -right-1.5`, not the product-card cart badge's + `-left-1.5` — don't copy that positioning between the two, they're + intentionally different corners for different-looking buttons. ## Static-image slots @@ -274,6 +296,25 @@ 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: light background, black text, sticky to viewport bottom + +The footer is `bg-[#9a21291a]` (a ~10%-opacity red-tint, given as an exact +hex by the user — not swapped for the closest design-token color) with +black text throughout (`text-black`, `/70`, `/50`, `/10`, `/20` opacity +steps) — it used to be a solid dark-red block with white text; don't revert +to that. The footer logo (`logoDarkUrl ?? logoUrl`) is `h-[72px]`, doubled +from its original size on request. Because `public/images/meshkee-logo- +white.png` (the credit-widget logo below) is a solid-white asset, it gets +`brightness-0` on this light background to render as a black silhouette +instead of invisible white-on-near-white — the same `opacity-60 → +group-hover:opacity-100` fade still applies on top of that. + +`
` has `flex-1` in `layout.tsx` (`body` is `flex flex-col`) so the +footer sits flush at the bottom of the viewport on short pages instead of +leaving a gap of bare `background` color beneath it — this is the standard +sticky-footer flex pattern. Don't remove `flex-1` from `main` without +re-checking a short page (e.g. `/contact`) for that gap coming back. + ## Footer: Meshkee credit widget The footer's bottom-right link ("Designed And Developed By Meshkee diff --git a/src/app/layout.tsx b/src/app/layout.tsx index d5910ad..d56df75 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -53,7 +53,7 @@ export default async function RootLayout({ children }: LayoutProps<"/">) {
-
{children}
+
{children}