stack/src/components/sections/text-and-media-section/text-and-media-section.twig line 1

Open in your IDE?
  1. {% set com_props = props %}
  3. {%- set section_extra = [
  4.   props.order in ["reverse", "default"] ? "--" ~ props.order : "--default",
  5.   props.variant in ["product"] ? "--" ~ props.variant : null,
  6.   props.extra_class
  7. ]|join(' ')|trim -%}
  9. {% set section_props = {
  10.   name: "s-text-media",
  11.   id: props.id,
  12.   is_container: props.is_container,
  13.   spacing: props.spacing,
  14.   extra_class: section_extra,
  15.   bg_color: props.bg_color,
  16. } %}
  18. {% set header_position = props.header_position|default("in") %}
  20. {% set header_in_props = {
  21.   heading: {
  22.     title: props.header.heading.title,
  23.     level: props.header.heading.level|default(2),
  24.     style: "h2",
  25.   },
  26.   spacing: "sm",
  27.   variant: "left",
  28.   extra_class: "s-text-media__header-in",
  29. } %}
  31. {% set buttons = {} %}
  33. {% if props.buttons.primary %}
  34.   {% set buttons = {
  35.     primary: {
  36.       title: props.buttons.primary.title,
  37.       url: props.buttons.primary.url,
  38.       icon: {
  39.         src: "@Images/svg/chevron-right.svg",
  40.         size: "lg"
  41.       }
  42.     }
  43.   } %}
  45. {% else %}
  46.   {% set buttons = {
  47.     outline: {
  48.       title: props.buttons.outline.title,
  49.       url: props.buttons.outline.url
  50.     }
  51.   } %}
  52. {% endif %}
  54. {% set buttons_props = {
  55.   buttons: buttons,
  56.   align: "left",
  57.   spacing: "lg",
  58. } %}
  60. {% embed "@Components/base-section/base-section.twig" with {props: section_props} %}
  61.   {% block content %}
  63.     {% if com_props.header and header_position == "out" %}
  64.       {% include "@Components/base-header/base-header.twig" with {props: com_props.header} %}
  65.     {% endif %}
  67.     <div class="s-text-media__grid">
  69.       {% if com_props.media %}
  70.         <div class="s-text-media__col --media-col w-100">
  71.           {% include "@Components/items/media-item/media-item.twig" with {props: com_props.media|merge({
  72.             variant: com_props.variant
  73.           })} %}
  74.         </div>
  76.       {% else %}
  77.         <div class="s-text-media__col --media-col w-100">
  78.           {% include "@Components/items/media-item/media-item.twig" with {props: {
  79.             variant: com_props.variant,
  80.             tag: com_props.tag
  81.           }} %}
  82.         </div>
  83.       {% endif %}
  85.       <div class="s-text-media__col --content-col d-flex flex-column justify-content-center w-100">
  87.         {% if com_props.header and header_position == "in" %}
  88.           {% include "@Components/base-header/base-header.twig" with {props: header_in_props} %}
  89.         {% endif %}
  91.         {% if com_props.description %}
  92.           <div class="s-text-media__description d-flex flex-column gap-6 mb-3">
  93.             <div class="s-text-media__meta d-flex flex-column gap-1">
  94.               {% if com_props.description.family %}
  95.                 <div class="s-text-media__family d-flex flex-wrap gap-1 u-color-primary u-fz-sm u-fw-600">
  96.                   <div class="u-color-primary-500 u-fw-400 s-text-media__meta-label">{{ "Rodina:"|trans }}</div>
  97.                   {{ com_props.description.family }}
  98.                 </div>
  99.               {% endif %}
  101.               {% if com_props.description.category %}
  102.                 <div class="s-text-media__category d-flex flex-wrap gap-1 u-color-primary u-fz-sm u-fw-600">
  103.                   <div class="u-color-primary-500 u-fw-400 s-text-media__meta-label">{{ "Kategorie:"|trans }}</div>
  104.                   {{ com_props.description.category }}
  105.                 </div>
  106.               {% endif %}
  108.               {% if com_props.description.code %}
  109.                 <div class="s-text-media__code d-flex flex-wrap gap-1 u-color-primary u-fz-sm u-fw-600">
  110.                   <div class="u-color-primary-500 u-fw-400 s-text-media__meta-label">{{ "Kód:"|trans }}</div>
  111.                   {{ com_props.description.code }}
  112.                 </div>
  113.               {% endif %}
  114.             </div>
  116.             {% if com_props.description.specs %}
  117.               <div class="s-text-media__specs d-flex flex-wrap gap-2 u-posr">
  118.                 {% for item in com_props.description.specs %}
  119.                   {% include "@Components/items/tooltip-item/tooltip-item.twig" with {props: item.tooltip|merge({
  120.                     extra_class: "s-text-media__tooltip"
  121.                   })} %}
  122.                 {% endfor %}
  123.               </div>
  124.             {% endif %}
  125.           </div>
  126.         {% endif %}
  128.         {% if com_props.content %}
  129.           <div class="s-text-media__body entry-content u-color-primary-500">
  130.             {{ com_props.content|raw }}
  131.           </div>
  132.         {% endif %}
  134.         {% if com_props.buttons %}
  135.           {% include "@Components/groups/buttons-group/buttons-group.twig" with {props: buttons_props} %}
  136.         {% endif %}
  137.       </div>
  139.     </div>
  140.   {% endblock %}
  141. {% endembed %}