# تذييل الموقع

> شعار الموقع وسطره بجانب أعمدة روابط بعناوينها، ثم سطر أخير بحقوق النشر وملاحظة قصيرة والروابط القانونية.

الصفحة: https://ritla.app/ar/ui/marketing-footer

## التثبيت

يُفتح التثبيت من السجل قريبًا، وهذه هي الأوامر التي ستشغّلها حينها.

```bash
npx ritla add marketing-footer
```

أو بأداة shadcn:

```bash
npx shadcn@latest add @ritla/marketing-footer
```

## الاستخدام

```tsx
import { MarketingFooter } from "@/components/ui/marketing-footer";

<MarketingFooter
  logo={<Wordmark />}
  tagline="Thoughtfully Arabic. Naturally bilingual."
  groups={[{ title: "Product", links: [{ label: "Components", href: "/ui" }] }]}
  copyright="© 2026 Ritla"
  legal={[{ label: "Privacy", href: "/legal/privacy" }]}
/>
```

## مرجع الخصائص

### `MarketingFooter`

| الخاصية | النوع | الافتراضي | الوصف |
| --- | --- | --- | --- |
| `logo` | `ReactNode` | لا يوجد | شعار الموقع، مرتبطًا بالصفحة الرئيسية. |
| `tagline` | `ReactNode` | لا يوجد | سطر أو سطران تحت الشعار. |
| `groups` | `{ title, links: { label, href, lang? }[] }[]` | لا يوجد | أعمدة الروابط، كلٌّ تحت عنوانه. |
| `copyright` | `ReactNode` | لا يوجد | بداية السطر الأخير: «© 2026 ريتلا». |
| `note` | `ReactNode` | لا يوجد | سطر قصير في وسط السطر الأخير. |
| `legal` | `{ label, href, lang? }[]` | لا يوجد | الروابط القانونية في نهاية السطر الأخير. |

## إمكانية الوصول

لوحة المفاتيح (المفاتيح مكتوبة للاتجاه من اليسار إلى اليمين، ويتبادل السهمان في الاتجاه من اليمين إلى اليسار):

- `Tab`: الشعار ثم الروابط عمودًا عمودًا ثم الروابط القانونية.

ARIA:

- التذييل معلم معلومات الصفحة (`footer`)، وكل عمود له عنوان من المستوى الثاني.
- أسماء المنتجات اللاتينية تحمل `lang="en"` حين تبقى لاتينية في الصفحة العربية.

## ملاحظات العربية والاتجاه

ينعكس:

- عمود الشعار في بداية السطر على اليمين، والأعمدة تليه إلى اليسار.

لا ينعكس:

- الشعار نفسه لاتيني ولا ينعكس.

الأرقام: السنة في حقوق النشر كما تكتبها.

الخط العربي: العناوين `label-14` بوزن Semibold، والروابط `body-14`، والسطر الأخير `body-12`.