easyorders 0.1.15 → 0.1.17

package/dist/template/theme/home-sections/category-mosaic/template.liquid

@@ -1,8 +1,15 @@
 <section
-  class="category-mosaic eo-hs{% if section_data.gap_tight %} category-mosaic--tight{% endif %}{% if section_data.mosaic_category_ids == blank or section_data.mosaic_category_ids.size == 0 %} eo-hs--empty{% endif %}"
-  style="--mosaic-cols: {{ section_data.columns | default: '3' }};"
-  data-eo-hs-entity="categories"
-  data-eo-hs-ids="{{ section_data.mosaic_category_ids | join: ',' | strip }}"
+  class="eo-home-section category-mosaic{% if section_data.gap_tight %} category-mosaic--tight{% endif %}"
+  style="
+    --mosaic-cols: {{ section_data.columns | default: '3' }};
+    {% if section_data.section_background != blank %}--mosaic-section-bg: {{ section_data.section_background }};{% endif %}
+    {% if section_data.heading_title_color != blank %}--mosaic-head-title-color: {{ section_data.heading_title_color }};{% endif %}
+    --mosaic-head-title-size: {{ section_data.heading_title_size | default: 38 }}px;
+    --mosaic-head-title-weight: {{ section_data.heading_title_weight | default: '500' }};
+    {% if section_data.heading_subtitle_color != blank %}--mosaic-head-subtitle-color: {{ section_data.heading_subtitle_color }};{% endif %}
+    --mosaic-head-subtitle-size: {{ section_data.heading_subtitle_size | default: 16 }}px;
+    --mosaic-head-subtitle-weight: {{ section_data.heading_subtitle_weight | default: '400' }};
+  "
 >
   <div class="category-mosaic__head">
     {% if section_data.title != blank %}
@@ -13,21 +20,51 @@
     {% endif %}
   </div>
 
-  <div class="category-mosaic__grid" data-eo-hs-mount>
-    {% if section_data.mosaic_category_ids and section_data.mosaic_category_ids.size > 0 %}
-      {% for id in section_data.mosaic_category_ids %}
-        <div class="eo-hs-skeleton eo-hs-skeleton--category" aria-hidden="true"></div>
+  {% if section_data.tiles and section_data.tiles.size > 0 %}
+    <div class="category-mosaic__grid">
+      {% for tile in section_data.tiles %}
+        <a
+          class="category-mosaic__tile"
+          href="#"
+          {% if tile.category_id != blank %}
+            data-eo-hs-cta="1"
+            data-eo-hs-cta-entity="categories"
+            data-eo-hs-cta-id="{{ tile.category_id }}"
+          {% endif %}
+        >
+          <div class="category-mosaic__visual">
+            {% if tile.image != blank %}
+              <img
+                class="category-mosaic__img"
+                src="{{ tile.image }}"
+                alt="{{ tile.label }}"
+                loading="lazy"
+                width="640"
+                height="800"
+              />
+            {% else %}
+              <div class="category-mosaic__img-fallback" aria-hidden="true"></div>
+            {% endif %}
+            <div class="category-mosaic__shade" aria-hidden="true"></div>
+          </div>
+          <div class="category-mosaic__meta">
+            {% if tile.label != blank %}
+              <span class="category-mosaic__label">{{ tile.label }}</span>
+            {% endif %}
+            {% if tile.tagline != blank %}
+              <span class="category-mosaic__tagline">{{ tile.tagline }}</span>
+            {% endif %}
+          </div>
+        </a>
       {% endfor %}
-    {% else %}
-      <p class="category-mosaic__placeholder">Choose categories in the section settings to build this mosaic.</p>
-    {% endif %}
-  </div>
+    </div>
+  {% endif %}
 </section>
 
 <style>
   .category-mosaic {
     padding: clamp(2.5rem, 5vw, 4rem) 1.25rem 3rem;
-    background: #fff;
+    background: var(--mosaic-section-bg, #fff);
     color: #141218;
   }
   .category-mosaic--tight .category-mosaic__grid {
@@ -41,14 +78,16 @@
   .category-mosaic__title {
     margin: 0 0 0.5rem;
     font-family: ui-serif, Georgia, Cambria, 'Times New Roman', Times, serif;
-    font-weight: 500;
-    font-size: clamp(1.75rem, 4vw, 2.35rem);
+    font-weight: var(--mosaic-head-title-weight, 500);
+    font-size: clamp(1.25rem, 3vw, var(--mosaic-head-title-size, 38px));
+    color: var(--mosaic-head-title-color, #141218);
   }
   .category-mosaic__subtitle {
     margin: 0;
-    font-size: 1rem;
+    font-size: var(--mosaic-head-subtitle-size, 16px);
     line-height: 1.6;
-    color: #5c5852;
+    font-weight: var(--mosaic-head-subtitle-weight, 400);
+    color: var(--mosaic-head-subtitle-color, #5c5852);
   }
   .category-mosaic__grid {
     max-width: 1200px;
@@ -57,9 +96,6 @@
     grid-template-columns: repeat(var(--mosaic-cols, 3), minmax(0, 1fr));
     gap: 1.25rem;
   }
-  .category-mosaic__grid.eo-hs-loading {
-    opacity: 0.85;
-  }
   @media (max-width: 899px) {
     .category-mosaic__grid {
       grid-template-columns: repeat(2, minmax(0, 1fr));
@@ -70,26 +106,7 @@
       grid-template-columns: 1fr;
     }
   }
-  .category-mosaic .eo-hs-skeleton--category {
-    aspect-ratio: 3 / 4;
-    border-radius: 6px;
-    background: linear-gradient(110deg, #ece8e2 8%, #f5f2ee 18%, #ece8e2 33%);
-    background-size: 200% 100%;
-    animation: category-mosaic-shimmer 1.2s ease-in-out infinite;
-  }
-  .category-mosaic__placeholder {
-    grid-column: 1 / -1;
-    margin: 0;
-    padding: 1.25rem;
-    text-align: center;
-    color: #7a7368;
-    font-size: 0.9rem;
-  }
-  .category-mosaic.eo-hs--empty .category-mosaic__grid {
-    display: flex;
-    justify-content: center;
-  }
-  .category-mosaic .eo-hs-card--category {
+  .category-mosaic__tile {
     position: relative;
     display: block;
     text-decoration: none;
@@ -99,57 +116,55 @@
     background: #ece8e1;
     transition: transform 0.25s ease, box-shadow 0.25s ease;
   }
-  .category-mosaic .eo-hs-card--category:hover {
+  .category-mosaic__tile:hover {
     transform: translateY(-4px);
     box-shadow: 0 22px 50px rgba(20, 18, 24, 0.18);
   }
-  .category-mosaic .eo-hs-card--category .eo-hs-card__media {
-    display: block;
-    aspect-ratio: 3 / 4;
-    background: #ece8e2;
+  .category-mosaic__visual {
+    position: relative;
+    aspect-ratio: 1 / 1;
     overflow: hidden;
   }
-  .category-mosaic .eo-hs-card--category .eo-hs-card__media--empty {
-    min-height: 200px;
-  }
-  .category-mosaic .eo-hs-card--category .eo-hs-card__media img {
+  .category-mosaic__img,
+  .category-mosaic__img-fallback {
     width: 100%;
     height: 100%;
     object-fit: cover;
     display: block;
     transition: transform 0.45s ease;
   }
-  .category-mosaic .eo-hs-card--category:hover .eo-hs-card__media img {
+  .category-mosaic__img-fallback {
+    background: linear-gradient(160deg, #d4cec4, #a39a8f);
+  }
+  .category-mosaic__tile:hover .category-mosaic__img {
     transform: scale(1.04);
   }
-  .category-mosaic .eo-hs-card--category .eo-hs-card__body {
+  .category-mosaic__shade {
+    position: absolute;
+    inset: 0;
+    background: linear-gradient(to top, rgba(12, 10, 14, 0.72), transparent 55%);
+    pointer-events: none;
+  }
+  .category-mosaic__meta {
     position: absolute;
     left: 0;
     right: 0;
     bottom: 0;
     padding: 1.25rem 1.1rem 1.1rem;
-    background: linear-gradient(to top, rgba(12, 10, 14, 0.72), transparent 55%);
+    display: flex;
+    flex-direction: column;
+    gap: 0.2rem;
+    color: #fff;
   }
-  .category-mosaic .eo-hs-card--category .eo-hs-card__title {
+  .category-mosaic__label {
     font-size: 1.05rem;
     font-weight: 600;
     letter-spacing: 0.02em;
-    color: #fff;
-  }
-  .category-mosaic .eo-hs-error {
-    grid-column: 1 / -1;
-    margin: 0;
-    padding: 1rem;
-    text-align: center;
-    font-size: 0.88rem;
-    color: #8b3225;
   }
-  @keyframes category-mosaic-shimmer {
-    0% {
-      background-position: 100% 0;
-    }
-    100% {
-      background-position: -100% 0;
-    }
+  .category-mosaic__tagline {
+    font-size: 0.82rem;
+    opacity: 0.88;
+    letter-spacing: 0.04em;
+    text-transform: uppercase;
   }
 </style>

package/dist/template/theme/home-sections/different-hero/config.json

@@ -0,0 +1,199 @@
+{
+    "icon": "https://files.easy-orders.net/1778106603822306532.png",
+    "label": "Hero (Full width)",
+    "section_schema": [
+      {
+        "name": "image_desktop",
+        "type": "image",
+        "default": "",
+        "description": "صورة الخلفية (ديسكتوب)"
+      },
+      {
+        "name": "image_mobile",
+        "type": "image",
+        "default": "",
+        "description": "صورة الخلفية (موبايل)"
+      },
+      {
+        "name": "overlay_strength",
+        "type": "number",
+        "default": 42,
+        "description": "قوة التعتيم (0 - 100)"
+      },
+      {
+        "name": "height_dt",
+        "type": "number",
+        "default": 70,
+        "description": "طول القسم للديسكتوب (svh) max:100 svh"
+      },
+      {
+        "name": "height_mb",
+        "type": "number",
+        "default": 70,
+        "description": "طول القسم للموبايل (svh) max:100 svh"
+      },
+      {
+        "name": "alignment",
+        "type": "select",
+        "default": "center",
+        "description": "محاذاة المحتوى",
+        "options": [
+          { "label": "في المنتصف", "value": "center" },
+          { "label": "لليسار", "value": "left" },
+          { "label": "لليمين", "value": "right" }
+        ]
+      },
+      {
+        "name": "gap_dt",
+        "type": "number",
+        "default": 24,
+        "description": "المسافة بين العناصر - ديسكتوب (px)"
+      },
+      {
+        "name": "gap_mb",
+        "type": "number",
+        "default": 16,
+        "description": "المسافة بين العناصر - موبايل (px)"
+      },
+      {
+        "name": "kicker",
+        "type": "string",
+        "default": "New season",
+        "description": "الكلمة الصغيرة فوق العنوان"
+      },
+      {
+        "name": "accent_color",
+        "type": "color",
+        "default": "#C9A962",
+        "description": "اللون المميز (للكلمة الصغيرة وخلفية الزرار)"
+      },
+      {
+        "name": "headline",
+        "type": "string",
+        "default": "The spring edit",
+        "description": "العنوان الرئيسي"
+      },
+      {
+        "name": "title_color",
+        "type": "color",
+        "default": "#FAF7F2",
+        "description": "لون العنوان"
+      },
+      {
+        "name": "title_size_dt",
+        "type": "number",
+        "default": 60,
+        "description": "حجم العنوان - ديسكتوب (px)"
+      },
+      {
+        "name": "title_size_mb",
+        "type": "number",
+        "default": 36,
+        "description": "حجم العنوان - موبايل (px)"
+      },
+      {
+        "name": "subheadline",
+        "type": "string",
+        "default": "Silhouettes, textures, and tones curated for everyday luxury.",
+        "description": "الوصف"
+      },
+      {
+        "name": "desc_color",
+        "type": "color",
+        "default": "#FAF7F2",
+        "description": "لون الوصف"
+      },
+      {
+        "name": "desc_size_dt",
+        "type": "number",
+        "default": 18,
+        "description": "حجم الوصف - ديسكتوب (px)"
+      },
+      {
+        "name": "desc_size_mb",
+        "type": "number",
+        "default": 15,
+        "description": "حجم الوصف - موبايل (px)"
+      },
+      {
+        "name": "primary_label",
+        "type": "string",
+        "default": "Shop collection",
+        "description": "نص الزرار"
+      },
+      {
+        "name": "cta_link_type",
+        "type": "select",
+        "default": "category",
+        "description": "نوع لينك الزرار مهم اختار اولا",
+        "options": [
+          { "label": "قسم (Category)", "value": "category" },
+          { "label": "منتج (Product)", "value": "product" }
+        ]
+      },
+      {
+        "name": "cta_category_id",
+        "type": "category_single_select",
+        "description": "اختيار القسم (لو نوع اللينك = قسم)"
+      },
+      {
+        "name": "cta_product_id",
+        "type": "product_single_select",
+        "description": "اختيار المنتج (لو نوع اللينك = منتج)"
+      },
+      {
+        "name": "btn_text_color",
+        "type": "color",
+        "default": "#141218",
+        "description": "لون نص الزرار"
+      },
+      {
+        "name": "btn_size_dt",
+        "type": "number",
+        "default": 14,
+        "description": "حجم خط الزرار - ديسكتوب (px)"
+      },
+      {
+        "name": "btn_size_mb",
+        "type": "number",
+        "default": 13,
+        "description": "حجم خط الزرار - موبايل (px)"
+      },
+      {
+        "name": "btn_show_border",
+        "type": "select",
+        "default": "none",
+        "description": "إظهار حدود للزرار؟",
+        "options": [
+          { "label": "بدون حدود (نص فقط)", "value": "none" },
+          { "label": "بحدود (Solid)", "value": "solid" }
+        ]
+      },
+      {
+        "name": "btn_radius",
+        "type": "number",
+        "default": 99,
+        "description": "استدارة حواف الزرار (px)"
+      },
+      {
+        "name": "enable_animation",
+        "type": "boolean",
+        "default": true,
+        "description": "تشغيل أنيميشن السكشن"
+      },
+      {
+        "name": "animation_style",
+        "type": "select",
+        "default": "fade-up",
+        "description": "شكل الأنيميشن",
+        "options": [
+          { "label": "Fade Up", "value": "fade-up" },
+          { "label": "Zoom In", "value": "zoom-in" },
+          { "label": "Blur Reveal", "value": "blur-reveal" },
+          { "label": "Slide Cascade", "value": "slide-cascade" },
+          { "label": "Fade Right", "value": "fade-right" },
+          { "label": "Flip Up", "value": "flip-up" }
+        ]
+      }
+    ]
+  }

package/dist/template/theme/home-sections/different-hero/template.liquid

@@ -0,0 +1,219 @@
+<section
+  class="rnw-hero rnw-hero--{{ section_data.alignment | default: 'center' }}"
+  {% if section_data.enable_animation != false %}data-section-anim="{{ section_data.animation_style | default: 'fade-up' }}"{% endif %}
+  style="
+    --rnw-h-dt: {{ section_data.height_dt | default: 70 }}svh;
+    --rnw-h-mb: {{ section_data.height_mb | default: 70 }}svh;
+    --rnw-gap-dt: {{ section_data.gap_dt | default: 24 }}px;
+    --rnw-gap-mb: {{ section_data.gap_mb | default: 16 }}px;
+    --rnw-accent: {{ section_data.accent_color | default: '#C9A962' }};
+    --rnw-overlay: {{ section_data.overlay_strength | default: 42 }};
+    
+    --rnw-t-color: {{ section_data.title_color | default: '#FAF7F2' }};
+    --rnw-t-dt: {{ section_data.title_size_dt | default: 60 }}px;
+    --rnw-t-mb: {{ section_data.title_size_mb | default: 36 }}px;
+    
+    --rnw-d-color: {{ section_data.desc_color | default: '#FAF7F2' }};
+    --rnw-d-dt: {{ section_data.desc_size_dt | default: 18 }}px;
+    --rnw-d-mb: {{ section_data.desc_size_mb | default: 15 }}px;
+    
+    --rnw-b-txt: {{ section_data.btn_text_color | default: '#141218' }};
+    --rnw-b-dt: {{ section_data.btn_size_dt | default: 14 }}px;
+    --rnw-b-mb: {{ section_data.btn_size_mb | default: 13 }}px;
+    --rnw-b-border: {{ section_data.btn_show_border | default: 'none' }};
+    --rnw-b-rad: {{ section_data.btn_radius | default: 99 }}px;
+  "
+>
+  <div class="rnw-hero__bg">
+    {% assign img_dt = section_data.image_desktop %}
+    {% assign img_mb = section_data.image_mobile | default: img_dt %}
+    {% if img_dt != blank %}
+      <picture>
+        <source media="(max-width: 768px)" srcset="{{ img_mb }}">
+        <img src="{{ img_dt }}" alt="{{ section_data.headline }}" loading="lazy">
+      </picture>
+    {% else %}
+      <div class="rnw-placeholder"></div>
+    {% endif %}
+  </div>
+
+  <div class="rnw-hero__overlay" aria-hidden="true"></div>
+  
+  <div class="rnw-hero__inner">
+    {% if section_data.kicker != blank %}
+      <p class="rnw-hero__kicker ab-anim-el">{{ section_data.kicker }}</p>
+    {% endif %}
+    
+    {% if section_data.headline != blank %}
+      <h1 class="rnw-hero__title ab-anim-el">{{ section_data.headline }}</h1>
+    {% endif %}
+    
+    {% if section_data.subheadline != blank %}
+      <p class="rnw-hero__lede ab-anim-el">{{ section_data.subheadline }}</p>
+    {% endif %}
+    
+    <div class="rnw-hero__actions ab-anim-el">
+      {% if section_data.primary_label != blank %}
+        {% assign cta_type = section_data.cta_link_type | default: 'category' %}
+        {% if cta_type == 'category' and section_data.cta_category_id != blank %}
+          <a class="rnw-btn" href="#"
+            data-eo-hs-cta="1"
+            data-eo-hs-cta-entity="categories"
+            data-eo-hs-cta-id="{{ section_data.cta_category_id }}"
+          >
+            {{ section_data.primary_label }}
+          </a>
+        {% elsif cta_type == 'product' and section_data.cta_product_id != blank %}
+          <a class="rnw-btn" href="#"
+            data-eo-hs-cta="1"
+            data-eo-hs-cta-entity="products"
+            data-eo-hs-cta-id="{{ section_data.cta_product_id }}"
+          >
+            {{ section_data.primary_label }}
+          </a>
+        {% else %}
+          <a class="rnw-btn" href="/products">
+            {{ section_data.primary_label }}
+          </a>
+        {% endif %}
+      {% endif %}
+    </div>
+  </div>
+</section>
+
+<style>
+  .rnw-hero {
+    position: relative;
+    isolation: isolate;
+    min-height: var(--rnw-h-mb);
+    display: flex;
+    align-items: center;
+    justify-content: center; /* الوسط كوضع افتراضي */
+    padding: 3rem 1.5rem;
+    background-color: #141218;
+    overflow: hidden;
+  margin-left: -10px ;
+  margin-right: -10px ;
+  max-width: none ;
+  margin-bottom: 15px;
+  }
+  
+  /* التحكم في محاذاة الحاوية الداخلية بالنسبة للقسم الكبير */
+  .rnw-hero--left { justify-content: flex-start; }
+  .rnw-hero--right { justify-content: flex-end; }
+
+  .rnw-hero__bg { position: absolute; inset: 0; z-index: -2; }
+  .rnw-hero__bg img { width: 100%; height: 100%; object-fit: cover; }
+  .rnw-placeholder { width: 100%; height: 100%; background-color: #141218; }
+
+  .rnw-hero__overlay {
+    position: absolute;
+    inset: 0;
+    z-index: -1;
+    background: linear-gradient(
+      105deg,
+      rgba(8, 6, 10, calc((var(--rnw-overlay) / 100) + 0.12)) 0%,
+      rgba(8, 6, 10, calc(var(--rnw-overlay) / 100)) 45%,
+      rgba(8, 6, 10, calc((var(--rnw-overlay) / 100) * 0.55)) 100%
+    );
+  }
+
+  .rnw-hero__inner {
+    position: relative;
+    z-index: 1;
+    max-width: 42rem;
+    display: flex;
+    flex-direction: column;
+    gap: var(--rnw-gap-mb);
+    /* السحر هنا: المحاذاة الداخلية للعناصر */
+    align-items: center; 
+    text-align: center;
+  }
+  
+  /* تعديل المحاذاة الداخلية بناءً على اختيار اليوزر */
+  .rnw-hero--left .rnw-hero__inner { align-items: flex-start; text-align: left; }
+  .rnw-hero--right .rnw-hero__inner { align-items: flex-end; text-align: right; }
+
+  .rnw-hero__kicker {
+    margin: 0;
+    font-size: 0.75rem;
+    letter-spacing: 0.35em;
+    text-transform: uppercase;
+    color: var(--rnw-accent);
+    font-weight: 600;
+  }
+
+  .rnw-hero__title {
+    margin: 0;
+    color: var(--rnw-t-color);
+font-family: Newsreader, serif !important;
+    font-weight: 300;
+    font-size: var(--rnw-t-mb);
+    line-height: 1.05;
+  }
+
+  .rnw-hero__lede {
+    margin: 0;
+    color: var(--rnw-d-color);
+    font-size: var(--rnw-d-mb);
+    line-height: 1.6;
+    opacity: 0.95;
+    font-family: Newsreader, serif !important;
+        font-weight: 200;
+  }
+
+  .rnw-hero__actions {
+  display: flex;
+  width: 100%;
+  justify-content: center; 
+  margin-top: 0.5rem;
+}
+
+/* في حالة اختيار المحاذاة لليسار */
+.rnw-hero--left .rnw-hero__actions { 
+  justify-content: flex-start; 
+}
+
+/* في حالة اختيار المحاذاة لليمين */
+.rnw-hero--right .rnw-hero__actions { 
+  justify-content: flex-end; 
+}
+
+  .rnw-btn {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    text-decoration: none;
+    text-transform: uppercase;
+    font-weight: 600;
+    letter-spacing: 0.1em;
+    transition: all 0.3s ease;
+    
+    background-color: var(--rnw-accent);
+    color: var(--rnw-b-txt);
+    font-size: var(--rnw-b-mb);
+    border-radius: var(--rnw-b-rad);
+    
+    border: 1px var(--rnw-b-border) var(--rnw-b-txt);
+    padding: 12px 30px;
+  }
+  
+  /* وضع "بدون حدود" للزرار */
+  .rnw-hero[style*="--rnw-b-border: none"] .rnw-btn {
+    background-color: transparent;
+    color: var(--rnw-accent);
+    padding: 5px 0;
+    border-radius: 0;
+  }
+
+  .rnw-btn:hover { opacity: 0.8; transform: translateY(-2px); }
+
+  @media (min-width: 768px) {
+    .rnw-hero { min-height: var(--rnw-h-dt); }
+    .rnw-hero__inner { gap: var(--rnw-gap-dt); }
+    .rnw-hero__title { font-size: var(--rnw-t-dt); }
+    .rnw-hero__lede { font-size: var(--rnw-d-dt); }
+    .rnw-btn { font-size: var(--rnw-b-dt); }
+    
+  }
+</style>

package/dist/template/theme/home-sections/editorial-feature/config.json

@@ -1,5 +1,5 @@
 {
-  "icon": "https://api.iconify.design/lucide:layout-template.svg",
+  "icon": "https://files.easy-orders.net/1778107613842485243.png",
   "label": "Editorial feature",
   "section_schema": [
     {
@@ -57,11 +57,37 @@
         { "label": "Dark editorial", "value": "dark" }
       ]
     },
+    {
+      "name": "section_background",
+      "type": "color",
+      "default": "",
+      "description": "Section background override (leave empty to use mood preset)"
+    },
     {
       "name": "accent_color",
       "type": "color",
       "default": "#8B7355",
       "description": "Eyebrow and link accent"
+    },
+    {
+      "name": "enable_animation",
+      "type": "boolean",
+      "default": true,
+      "description": "Enable section animation"
+    },
+    {
+      "name": "animation_style",
+      "type": "select",
+      "default": "fade-up",
+      "description": "Animation style",
+      "options": [
+        { "label": "Fade Up", "value": "fade-up" },
+        { "label": "Zoom In", "value": "zoom-in" },
+        { "label": "Blur Reveal", "value": "blur-reveal" },
+        { "label": "Slide Cascade", "value": "slide-cascade" },
+        { "label": "Fade Right", "value": "fade-right" },
+        { "label": "Flip Up", "value": "flip-up" }
+      ]
     }
   ]
 }