SIA Web Design Library

UN SDGs

No notes defined.

<div class='c-sdgs c-sdgs--un-sdgs-icon'>
    <p class='c-sdgs__items'>
        <a class='c-link c-link--muted c-tags__link ' href="#a" itemprop="item" itemid="#a"><span itemprop="name">Zero Hunger</span></a>, <a class='c-link c-link--muted c-tags__link ' href="#b" itemprop="item" itemid="#b"><span itemprop="name">Life Below Water</span></a>
    </p>
</div>
 
<div class='{{ get_component_class( 'sdgs', display ) }} c-sdgs--un-sdgs-icon'>
    <p class='c-sdgs__items'>
        {% for item in items %}
            {% if item.href %}
                {% include get_template( 'link', 'base' ) with item|merge( { display: { component: 'tags', modifiers: [ 'muted' ] } } ) %}{% if not loop.last %},{% endif %}
            {% else %}
                {{ item.text }}{% if not loop.last %},{% endif %}
            {% endif %}
        {% endfor %}
    </p>
</div>
 
{
  "items": [
    {
      "text": "Zero Hunger",
      "href": "#a"
    },
    {
      "text": "Life Below Water",
      "href": "#b"
    }
  ]
}