مدونة
ابق على اطلاع وإلهام!
{%- comment -%} يمكن لهذا المكون إنشاء علامة `img` أو `div style="background-..."`.
{%- endcomment -%} {%- assign is_global_asset = is_global_asset | default: false -%} {%- if bg -%} {%- comment -%} صورة الخلفية {%- endcomment -%} {%- assign tag_name = tag_name | default: 'div' -%} {%- assign self_closing = self_closing | default: false -%} {%- comment -%} نقوم بعرض السمات بأنفسنا ونقوم بتصفية `style`. {%- endcomment -%} {%- assign attr_list = attrs | to_attrs: list: true -%} {%- capture additional_attrs -%} {%- comment -%} تضمين السمات من السياق. {%- endcomment -%} {%- for attr in attr_list -%} {%- except attr[0] == 'style' -%} {{- ' ' -}} {{- attr[0] -}} {%- if attr[1].size > 0 -%} ="{{- attr[1] -}}" {%- endif -%} {%- endunless -%} {%- endfor -%} {{- ' ' -}} style=" {%- comment -%} عرض أنماط الخلفية. استخدم src إذا لم نحصل على صورة. {%- endcomment -%} {%- assign has_bg_image = false -%} {%- assign has_bg_size = false -%} {%- assign has_bg_position_x = false -%} {%- assign has_bg_position_y = false -%} {%- assign has_bg_repeat = false -%} {%- for prop in bg -%} {%- case prop[0] -%} {%- when 'image' -%} {%- assign has_bg_image = true -%} {%- when 'size' -%} {%- assign has_bg_size = true -%} {%- when 'position' -%} {%- assign has_bg_position_x = true -%} {%- assign has_bg_position_y = true -%} {%- when 'position-x' -%} {%- assign has_bg_position_x = true -%} {%- عندما يكون 'position-y' -%} {%- تعيين has_bg_position_y = true -%} {%- عندما يكون 'repeat' -%} {%- تعيين has_bg_repeat = true -%} {%- endcase -%} خلفية-{{- prop[0] -}}: {{- prop[1] -}}؛ {%- endfor -%} {%- ما لم يكن has_bg_image -%} صورة الخلفية: url('{{- src | asset_url: global: is_global_asset -}}'); {%- endunless -%} {%- ما لم يكن has_bg_size -%} حجم الخلفية: الغلاف؛ {%- endunless -%} {%- ما لم يكن has_bg_position_x -%} موضع الخلفية-x: المركز؛ {%- endunless -%} {%- except has_bg_position_y -%} background-position-y: center; {%- endunless -%} {%- except has_bg_repeat -%} background-repeat: no-repeat; {%- endunless -%} {%- comment -%} أضف أي أنماط من سمة النمط. {%- endcomment -%} {{- attrs.style -}} " {%- endcapture -%} {%- comment -%} قم بإزالة السمات حتى لا نقوم بعرضها مرتين. {%- endcomment -%} {%- assign attrs = nil -%} {%- else -%} {%- comment -%} وسم صورة عادي {%- endcomment -%} {%- assign tag_name = 'img' -%} {%- assign self_closing = true -%} {%- capture additional_attrs -%} {%- if srcset.size > 0 -%} {{- ' ' -}} srcset="{{ srcset }}" {%- endif -%} {%- if sizes.size > 0 -%} {{- ' ' -}} sizes="{{ sizes }}" {%- endif -%} {{- ' ' -}} alt="{{ alt }}" {{- ' ' -}} src="{{ src | asset_url: global: is_global_asset }}" {%- endcapture -%} {%- endif -%} {%- include 'atom/element', tag_name: tag_name, self_closing: self_closing, additional_attrs: additional_attrs -%}{%- comment -%} قم بإزالة المسافات البادئة واللاحقة من `tag_name`. {%- endcomment -%} {%- assign tag_name = tag_name | strip -%} {%- comment -%} قم بمعالجة حالة `tag_name: ''`. {%- endcomment -%} {%- if tag_name and tag_name.size < 1 -%} {%- assign tag_name = false -%} {%- endif -%} {%- if tag_name -%} <{{ tag_name }} {{- attrs | إلى_الكلمات -}} {{- الكلمات الإضافية -}} {%- إذا كان الإغلاق الذاتي == صحيح -%} {{- ' /' -}} {%- endif -%} > {%- endif -%} {%- ما لم يكن الإغلاق الذاتي == صحيح -%} {%- ifslot -%} {%- slot -%} {%- else -%} {{- inner_html -}} {%- endifslot -%} {%- إذا كان اسم العلامة -%} {%- نهاية -%} {%- نهاية لا نهاية -%}
{%- capture id_attr -%} {{- item.id -}} {%- endcapture -%} {%- if id_attr.size > 0 -%} {%- capture id_attr -%} id="{{ item.id }}" {%- endcapture -%} {%- endif -%} {%- assign attrs = item.attrs | merge_props: class: 'card card--post' -%} {%- if link == false أو item.link == nil أو item.link.size < 1 أو item.link_text == nil أو item.link_text.size < 1 -%} {% else % } {% endif %} {%- ما لم يكن img == false أو item.img == nil -%} {%- assign _img = item.img -%} {%- assign img_attrs = _img.attrs | merge_props: class: 'card__image' -%} {%- include 'atom/img', alt: _img.alt, src: _img.src, srcset: _img.srcset, sizes: _img.sizes, attrs: img_attrs, bg: _img.bg -%} {%- endunless -%} {{ عنوان العنصر }} {%- ما لم يكن المؤلف == خطأ أو مؤلف العنصر == لا شيء أو حجم مؤلف العنصر < 3 -%} {{ item.author }} {%- endunless -%} {%- ما لم يكن التاريخ == خطأ أو تاريخ العنصر == لا شيء أو حجم تاريخ العنصر < 3 -%} {{ item.date }} {%- endunless -%} {%- ما لم يكن الملخص == خطأ أو ملخص العنصر == لا شيء أو حجم ملخص العنصر < 1 -%} {{ملخص العنصر}} {%- endunless -%} {%- ما لم يكن الرابط == خطأ أو رابط العنصر == لا شيء أو حجم رابط العنصر < 1 أو نص رابط العنصر == لا شيء أو حجم رابط العنصر < 1 -%} {{ رابط العنصر }} {%- لا نهاية لها -%} {%- إذا كان الرابط == خطأ أو رابط العنصر == لا شيء أو حجم رابط العنصر < 1 أو نص رابط العنصر == لا شيء أو حجم نص رابط العنصر < 1 -%} {% وإلا %} {% نهاية %}