۞ قُرْطُبَة
v2.0.1 · M4 · RTL-First

إطار عمل قُرْطُبَة
للواجهات العربية والإسلامية

مُصمَّم من الصفر لدعم الاتجاه من اليمين لليسار، والخطوط العربية، والمكوّنات الإسلامية، والثيمات الجاهزة. بديل Bootstrap للمحتوى العربي — بدون أي مكتبات خارجية.

ابدأ التعلّم ← جرّب مباشرةً GitHub
🧭

RTL أصلي

كل المكوّنات مبنية بخصائص CSS المنطقية (logical properties) لتعمل بشكل تلقائي من اليمين لليسار ومن اليسار لليمين.

🕌

هوية إسلامية

خطوط المصحف، علامات الآيات، التقويم الهجري، أوقات الصلاة، الأذكار، اتجاه القبلة، وحاسبة الزكاة.

🎨

ثيمات فورية

6 ثيمات جاهزة (رمضان، المسجد، الصحراء، الليل، المتجر المصري، أكاديمية الخليج) + الوضع الليلي — بتبديل فوري.

⚙️

رموز تصميمية

نظام تصميم مبني على متغيّرات CSS وخرائط Sass. كل الألوان والمقاييس قابلة للتخصيص وقت التشغيل.

📦

بدون اعتماديات

CSS خام + JavaScript خفيف (6KB) بدون أي مكتبات. يعمل في كل المتصفحات الحديثة.

متاح وآمن

حلقات تركيز للأ لوحة المفاتيح، سمات ARIA، احترام تفضيل تقليل الحركة، وتباين ألوان محسوب تلقائياً.

التثبيت في دقيقة

HTML — ابدأ فوراً
<!DOCTYPE html>
<html lang="ar" dir="rtl">
<head>
  <link rel="stylesheet" href="dist/qrtoba.min.css">
</head>
<body class="q-bg-body q-text">
  <button class="q-btn q-btn-primary">مرحباً قُرْطُبَة</button>
  <script src="dist/js/qrtoba.js"></script>
</body>
</html>
💡
نصيحة
أضف data-q-theme="ramadan" على وسم <html> لتفعيل أي ثيم جاهز، و data-theme="dark" للوضع الليلي — وهما مستقلان تماماً.

استكشف الموقع

📖 توثيق المكوّنات 🖼️ معرض الثيمات ⚡ ساحة التجربة 🔄 الترحيل من Bootstrap