محمود عبدالنبي
الأتمتة · قالب وإطار عمل · 1

دليل المستودع: حزمة إصلاح عرض الوضع الداكن للبريد العربي وواجهات RTL

صفحة تعريفية مستقلة بمستودع حزمة إصلاح عرض الوضع الداكن للبريد العربي وواجهات RTL. توضّح ما الذي يحاول حله، ولمن يناسب، وما الملفات التي ستجدها قبل الانتقال إلى المصدر.

المشكلة التي يعالجها

يوضح التوثيق الأصلي نطاق المشكلة بهذا الوصف:

Build an open-source Dark Mode and RTL email development boilerplate: 1) Master responsive HTML template compatible with Apple Mail, Outlook, Gmail, and Yahoo Mail, 2) Dual-mode CSS rules using @media (prefers-color-scheme: dark) and [data-ogsc] (Outlook Web), 3) Transparent logo handling techniques (subtle white outer-glow trick), 4) RTL table alignment fixtures.

لمن صُمم؟

الجمهور المحدد في README: PRO operating in high-growth e-commerce, digital publishing, and direct-response marketing across Saudi Arabia, UAE, and Egypt.

محتويات المستودع

الملفات الأساسية التي يسردها قسم بنية المستودع في README:

  • css/darkmode-rtl-resets.css
  • docs/client-compatibility-matrix.md
  • examples/promotional_newsletter_demo.html
  • examples/rendered-previews.md
  • LICENSE
  • playbooks/outlook-apple-mail-testing.md
  • README.md
  • snippets/outlook-darkmode-hacks.css
  • snippets/transparent-logo-fixes.css
  • templates/master-darkmode-rtl-template.html
  • templates/promotional-newsletter-rtl.html
  • templates/transactional-receipt-rtl.html

طريقة مراجعته واستخدامه

  1. ابدأ بقراءة README وتأكد أن المشكلة المذكورة تطابق احتياجك الفعلي.
  2. افحص الملفات المذكورة أعلاه؛ أسماء الملفات توضح مكان البيانات والأدوات والقوالب والاختبارات.
  3. اتبع Quick Start الموجود في README، وتحقق من المتطلبات قبل تشغيل أي أمر.
  4. قارن المخرجات بعينة موثقة، وراجع القيود قبل استخدامها في قرار أو عمل عميل.

خطوة البدء: افتح README وراجع قسم الاستخدام والمتطلبات.

النطاق والقيود

  • Inverted Contrast Safeguards: Prevents dark-mode email clients (Apple Mail, Outlook) from inverting dark brand logos into invisible dark backgrounds.
  • RTL Table Alignment: Employs 'dir="rtl"' on outer tables and wraps to prevent nested text containers from flipping incorrectly across desktop Outlook engines.
  • prefers-color-scheme Media Queries: Injects targeted CSS media queries to explicitly control custom dark theme colors rather than relying on browser auto-inversion.

هذه الصفحة تلخص التوثيق المتاح ولا تثبت أداءً أو نتيجة تجارية. تحقق من صلاحية البيانات والمتطلبات قبل الاستخدام.

مستودعات مرتبطة