Info item

  • Nemovitosti 255m 
  •         {% include "@Components/items/info-item/info-item.twig" with {
    props: {
      title: "Nemovitosti",
      value: "255m"
    }
  }
%}

      
  •           
<div class="i-info">
	<span class="i-info__title">Nemovitosti</span>
	<span class="i-info__value">
					255m
			</span>
</div>

Info item with a link

  • Stránky projektu www www 
  •         {% include "@Components/items/info-item/info-item.twig" with {
	props: {
		title: "Stránky projektu",
		link: {
			title: "www",
			href: '//www.mestanskydumtrebic.cz',
			attributes: ['target="_blank"'],
			color: 'primary',
			icon: {
				src: "images/svg/link.svg",
				size: "sm",
                title: "www"
			}
		}
	}
} %}

      
  •           
<div class="i-info">
	<span class="i-info__title">Stránky projektu</span>
	<span class="i-info__value">
					  <a class="link --primary" href="//www.mestanskydumtrebic.cz" target="_blank">
      <span class="link__title">
      <span class="link__title-wrap">www</span>
    </span>
        <span class="link__icon ">
      <span class="icon  --sm">
      <img src="images/svg/link.svg" alt="www" loading="lazy">
  
  </span>
          </span>
  </a>
			</span>
</div>

Schema 

    {
	"props": {
		"title": {
			"type": "string",
			"description": "Title of the component"
		},
		"value": {
			"type": "object",
			"description": "Value of the component"
		},
		"link": {
			"type": "object",
			"description": "Object of Link component, if this is used, value is not used. Instead put value as link.title maybe"
		}
	}
}