الهوية البصرية

أين توجد الهوية البصرية

كل لون رمز (token) يُعرَّف مرة للمظهر الفاتح (:root) ومرة للمظهر الداكن (:root[data-theme="dark"]). تقرأ المكونات الرموز فقط، لذلك يصل تغيير الرمز إلى كل صفحة. غيّر لون العلامة في الكتلتين، وإلا احتفظ مظهر واحد باللون القديم.

اسم الموقع وقيمه الاحتياطية

في storefront/src/config/brand.config.ts وstorefront/src/config/booking.config.ts:

// brand.config.ts
name: { en: "Hollina", ar: "Hollina" },     // tab titles, sharing cards, the wordmark, the manifest
tagline: { en: "...", ar: "..." },           // until the dashboard's settings answer
description: { en: "...", ar: "..." },       // the installable app's description
contactEmail: "hello@example.com",           // until the dashboard's settings answer
contactPhone: "+1 202 555 0147",             // until the dashboard's settings answer
keywords: ["vacation rental", ...],          // the meta keywords

// booking.config.ts
DEFAULT_TIMEZONE = "America/New_York";       // calendar days, "today", the i18n clock
DEFAULT_CURRENCY = "USD";                    // prices without a currency of their own

الاسم النصي بجوار الرمز نص حي بخط Outfit (src/components/BrandMark.tsx)، لذلك يتبع name. ويظهر اسم الشركة أيضًا في جمل، باللغتين: ابحث في messages/ عن Hollina وأعد كتابة تلك الأسطر. أما وقت الرد في صفحة التواصل وفي نافذة السؤال («عادة خلال يوم») فهو نص في messages/contact وmessages/inquiry.

رمز الموقع وأيقوناته وصوره

استبدل الملفات وأبقِ أسماءها، أو غيّر mark.color وmark.white في إعداد العلامة. تخدم واجهة API صور الشركة من public/media/hollina/site/ في مجلد واجهة API: 01-hero.webp (صورة المشاركة لكل صفحة ليس لها صورة خاصة بها)، وhow-dates.webp وhow-pay.webp وhow-arrive.webp (الخطوات الثلاث في «كيف تحجز»)، وhost-desk.webp (بطاقة الفريق المضيف في صفحة التواصل). استبدلها بالأسماء نفسها. أما صور الإقامات والوجهات فتُرفع من لوحة التحكم.

ألوان الموقع وخطوطه

يسرد storefront/BRANDING.md كل رمز لوني. تأكد أن النص على ألوانك ما زال يُقرأ بنسبة 4.5 إلى 1 في السمتين. تُشحن ملفات الخطوط في src/fonts/ وتُحمَّل بـ next/font/local، فلا ينزّلها البناء أبدًا ولا يرسل الموقع أي طلب إلى Google: Outfit للنص اللاتيني والاسم النصي، وInstrument Serif للعناوين الكبيرة، وNoto Sans Arabic للنص العربي، كلها بترخيص SIL Open Font License. ولون منطقة الخريطة هو STAY_AREA_COLOR في src/lib/map/mapConfig.ts، وألوان شريط المتصفح هي themeColor.light وthemeColor.dark في إعداد العلامة.

نتائج البحث، والمشاركة، والأسعار، والنطاق

• NEXT_PUBLIC_SITE_URL هو أساس كل عنوان أساسي، وبدائل اللغات، وبطاقات المشاركة، وrobots.txt، وخريطة الموقع. اضبطه على عنوانك الحقيقي قبل أن تبني.
• عناوين الصفحات وأوصافها تحت meta في كل مساحة أسماء من messages/ (للصفحة الرئيسية في messages/home، والافتراضي في messages/layouts). وتستخدم صفحة الإقامة عنوان SEO ووصف الإقامة نفسها، المكتوبين في المحرر، وصورة غلافها.
• تُنسَّق الأسعار في مكان واحد، src/lib/utils/formatPrice.ts، برمز العملة متبوعًا بالمبلغ بالأرقام اللاتينية (USD 240)، ويرسمها src/components/PriceDisplay. ويضيف سعر الليلة فترته من الترجمات (/ night، common.stay.perNight في messages/common).

فاتح وداكن ونظام

لكلا التطبيقين زر سمة فيه النظام والفاتح والداكن. يتبع النظام نظام التشغيل ويتغير معه. يُحفظ الاختيار في localStorage بالمتصفح (hollina-theme في الموقع، وhollina-admin-theme في لوحة التحكم)، ولا يُرسل شيء إلى واجهة API، ويطبّقه سكربت قصير في رأس الصفحة قبل أول رسم، فلا تومض السمة الأخرى عند إعادة التحميل.

اسم لوحة التحكم ورمزها وألوانها

• الاسم: name في src/config/brand.config.ts هو الاسم النصي والجزء الخاص بالعلامة في كل عنوان صفحة (Bookings | Hollina)؛ وmeta يحمل العنوان والوصف والكلمات المفتاحية والمؤلف الافتراضية، وdomain.url أساس عناوين البيانات الوصفية المطلقة، وmanifest التطبيق القابل للتثبيت. وعنوان كل صفحة تحت meta.titles في مساحتي dashboard وauth من messages/، والنص بجوار الاسم النصي في الترويسة هو header.workspace في messages/dashboard.
• الرمز: استبدل public/brand/hollina-mark.svg وhollina-mark-white.svg وأبقِ الاسمين؛ يرسمهما BrandMark من رمز --logo-bg-image في src/styles/theme-variables.css. أيقونة تبويب المتصفح هي src/app/icon0.svg، وأيقونة iPhone هي src/app/apple-icon.png، وأيقونات التطبيق القابل للتثبيت هي ملفا web-app-manifest في public/.
• الألوان: --primaryColor و--primaryColorHover و--on-primary و--primary-tint و--background و--surface و--text و--text-muted و--border و--errorColor، مع أزواج --tone-* لشارات الحالة، في src/styles/theme-variables.css، مرة لكل سمة. وأي حالة تأخذ أي درجة موجود في src/config/statusTones.ts.
• الخطوط: Outfit وNoto Sans Arabic، تُشحن في src/fonts/، وتُحمَّل في src/app/layout.tsx، وتُسند في src/styles/base.css.

بيانات الشركة نفسها

ما يقرؤه الضيوف عن الشركة بيانات لا كود. تُعدَّل في إعدادات لوحة التحكم ويقرؤها الموقع من GET /api/settings/public، وهو يعود إلى إعداد العلامة فقط إلى أن يجيب.

العملة هي USD والمنطقة الزمنية America/New_York، وهما الخياران الوحيدان في لوحة التحكم. أما شعار العلامة فلا يُرفع من لوحة التحكم: يأتي من الملفات أعلاه.

الصياغة وسياسة الخصوصية

كل جملة ظاهرة موجودة في messages/، بمجلد لكل جزء فيه en.json وar.json. أعد كتابة النص في الملفين. سياسة الخصوصية في messages/privacy نص قالب وتقول ذلك في الصفحة: أعد كتابتها لشركتك وبلدك قبل الإطلاق، ثم أزل تلك الملاحظة (اللوحة المؤطرة في src/features/privacy/components/PrivacyHeader.tsx، ومفتاحها templateNote في الملفين). ويعرض سطر التواصل فيها البريد من إعدادات لوحة التحكم.

• اللغات