OffHealth component library

Social links component 

<ul class="n7-social-links flex items-center gap-8">

    <li class="flex items-center">
        <a href="url" class="n7-link text-3xl lg:text-2xl text-secondary-600">
            <span class="sr-only">Vai al profilo Facebook di ???</span>

            <svg class="inline-block align-middle fill-current w-1e h-1e" aria-hidden="true" focusable="false" role="img">
                <use xlink:href="../../icons.svg#solid--facebook" />
            </svg>

        </a>
    </li>

    <li class="flex items-center">
        <a href="url" class="n7-link text-3xl lg:text-2xl text-secondary-600">
            <span class="sr-only">Vai al profilo Instagram di ???</span>

            <svg class="inline-block align-middle fill-current w-1e h-1e" aria-hidden="true" focusable="false" role="img">
                <use xlink:href="../../icons.svg#solid--instagram" />
            </svg>

        </a>
    </li>

    <li class="flex items-center">
        <a href="url" class="n7-link text-3xl lg:text-2xl text-secondary-600">
            <span class="sr-only">Vai al canale YouTube di ???</span>

            <svg class="inline-block align-middle fill-current w-1e h-1e" aria-hidden="true" focusable="false" role="img">
                <use xlink:href="../../icons.svg#solid--youtube" />
            </svg>

        </a>
    </li>

    <li class="flex items-center">
        <a href="url" class="n7-link text-3xl lg:text-2xl text-secondary-600">
            <span class="sr-only">Vai al canale LinkedIn di ???</span>

            <svg class="inline-block align-middle fill-current w-1e h-1e" aria-hidden="true" focusable="false" role="img">
                <use xlink:href="../../icons.svg#solid--linkedin" />
            </svg>

        </a>
    </li>

</ul>
 
<ul class="n7-social-links flex items-center{% if listGap %} {{ listGap }} {% else %} gap-8{% endif %}">
    {% for item in items %}
    <li class="{% if item.classes %}{{ item.classes }}{% endif %}">
        {% render '@link--lg',{ label:item.label, href: item.href, iconOnly:true, icon:item.icon, classes:'text-3xl lg:text-2xl text-secondary-600' }, true %}
    </li>
    {% endfor %}
</ul>
 
{
  "items": [
    {
      "label": "Vai al profilo Facebook di ???",
      "icon": "solid--facebook",
      "classes": "flex items-center",
      "href": "url"
    },
    {
      "label": "Vai al profilo Instagram di ???",
      "icon": "solid--instagram",
      "classes": "flex items-center",
      "href": "url"
    },
    {
      "label": "Vai al canale YouTube di ???",
      "icon": "solid--youtube",
      "classes": "flex items-center",
      "href": "url"
    },
    {
      "label": "Vai al canale LinkedIn di ???",
      "icon": "solid--linkedin",
      "classes": "flex items-center",
      "href": "url"
    }
  ]
}

No notes defined.