تخطَّ إلى المحتوى
خديجة Khadija

قالب متجر · محرك Twilight من سلة

متجر أزياء بهدوء المجلات، لا بضجيج القوالب.

١٤ مكوّنًا مخصصًا و٩٥ إعدادًا للتاجر.

تصفّح المكوّنات جرّبي تسوق الإطلالة github.com/omaroiddd/khadija
مكوّن جاهز
24
إعداد للتاجر
136
خاصية معلَنة
17
مفتاح ترجمة
164
حزمة بناء
12
القدرات twilight.json

ما الذي يقدّمه قالب خديجة

الخصائص المعلَنة في twilight.json

    المكوّنات src/views/components/home/

    ٢٠ مكوّنًا للصفحة الرئيسية

      المكوّن المميز home/K_product_set.twig

      ضعي النقطة، واقرئي الإحداثيات

      صورة الإطلالة الافتراضية في القالب

      ما يُكتب في twilight.json

      {
  "products_list.x": "46",
  "products_list.y": "38",
  "products_list.product": [ … ]
}

      وما يُصيَّره K_product_set.twig

      <div class="hps-hotspot"
     style="bottom: 38%;
            left: 46%">

      نظام التصميم src/views/layouts/variables.twig

      أدر المقبض، واقرأ المتغيّر

      الإعدادات

      معاينة حيّة

      متجري
      خصم حتى ٣٠٪ تسوّق الآن

      المخرَج في layouts/variables.twig

      :root {
  --color-primary: #927651;
  --store-bg: #FFFFFF;
  --footer-bg-color: #271C11;
  --border-radius-button: 20px;
  --border-radius-card: 0px;
  --container-max-width: 1280px;
}
/* master.twig maps space_inner → */ mb-6 md:mb-10

      ألوان القالب الافتراضية

      • store_brand_color#271C11
      • header_text_color_light#927651
      • newsletter_btn_color#B38A5C
      • insta_username_color#C5A059
      • store_bg#FFFFFF
      • text_primary#231815
      • text_secondary#6B7280
      • border_color#DEE2E6

      نظام الحاويات

      • .container-narrow1200px
      • .container-base1280px
      • .container-wide1600px
      • .container-full100%

      الاتجاه

      <html lang="{{ language.code }}"
      dir="{{ theme.is_rtl ? 'rtl' : 'ltr' }}">
      • 02-generic/rtl.scss29
      • 02-generic/ltr.scss24
      • locales/ar.json · en.json86
      بطاقة المنتج js/partials/product-card.js

      ثمانية مفاتيح، بطاقة واحدة

      المفاتيح

      -29%

      سماعات متوفر

      سماعة لاسلكية

      عزل ضوضاء نشط

      4.0

      ٤٩٩ ر.س ٦٩٩ ر.س

      ينتهي خلال 02:14:39

      مرّر فوق البطاقة لإظهار أزرار الإجراءات.

      الكائن المُمرَّر إلى JavaScript

      لوحة التاجر twilight.json → settings

      البنية webpack.config.js · app.scss

      كيف بُني القالب

      مداخل البناء

        حزم محفوظة

          طبقات الأنماط