Avatar Group

No notes defined.

<!-- Default -->
<ul class="sds-overlapItems list-unstyled">

    <li>

        <div class="sds-avatar centeredBgi">

            <img class="img-fluid" src="../../media/snet/avatars/avatarUser.png" alt="">

        </div>
    </li>

    <li>

        <div class="sds-avatar centeredBgi">

            <img class="img-fluid" src="../../media/snet/avatars/avatarUser.png" alt="">

        </div>
    </li>

    <li>

        <div class="sds-avatar centeredBgi">

            <img class="img-fluid" src="../../media/snet/avatars/avatarUser.png" alt="">

        </div>
    </li>

    <li>

        <div class="sds-avatar centeredBgi">

            <img class="img-fluid" src="../../media/snet/avatars/avatarUser.png" alt="">

        </div>
    </li>

    <li>

        <div class="sds-avatar centeredBgi">

            <img class="img-fluid" src="../../media/snet/avatars/avatarUser.png" alt="">

        </div>
    </li>

</ul>


<!-- Small -->
<ul class="sds-overlapItems list-unstyled -overlapSm">

    <li>

        <div class="sds-avatar centeredBgi -avatarSm">

            <img class="img-fluid" src="../../media/snet/avatars/avatarUser.png" alt="">

        </div>
    </li>

    <li>

        <div class="sds-avatar centeredBgi -avatarSm">

            <img class="img-fluid" src="../../media/snet/avatars/avatarUser.png" alt="">

        </div>
    </li>

    <li>

        <div class="sds-avatar centeredBgi -avatarSm">

            <img class="img-fluid" src="../../media/snet/avatars/avatarUser.png" alt="">

        </div>
    </li>

    <li>

        <div class="sds-avatar centeredBgi -avatarSm">

            <img class="img-fluid" src="../../media/snet/avatars/avatarUser.png" alt="">

        </div>
    </li>

    <li>

        <div class="sds-avatar centeredBgi -avatarSm">

            <img class="img-fluid" src="../../media/snet/avatars/avatarUser.png" alt="">

        </div>
    </li>

</ul>


<!-- Overlap Shadow -->
<ul class="sds-overlapItems -overlapShadow list-unstyled">

    <li>

        <div class="sds-avatar centeredBgi">

            <img class="img-fluid" src="../../media/snet/avatars/avatarUser.png" alt="">

        </div>
    </li>

    <li>

        <div class="sds-avatar centeredBgi">

            <img class="img-fluid" src="../../media/snet/avatars/avatarUser.png" alt="">

        </div>
    </li>

    <li>

        <div class="sds-avatar centeredBgi">

            <img class="img-fluid" src="../../media/snet/avatars/avatarUser.png" alt="">

        </div>
    </li>

    <li>

        <div class="sds-avatar centeredBgi">

            <img class="img-fluid" src="../../media/snet/avatars/avatarUser.png" alt="">

        </div>
    </li>

    <li>

        <div class="sds-avatar centeredBgi">

            <img class="img-fluid" src="../../media/snet/avatars/avatarUser.png" alt="">

        </div>
    </li>

</ul>


<!-- Default -->
<ul class="{{ namespace }}overlapItems{% for mod in modifiers %} {{ mod }}{% endfor %}{% for mod in classes %} {{ mod }}{% endfor %} list-unstyled">
	{% for key, item in items %}
		<li>
			{% render "@avatar--image" %}
		</li>
	{% endfor %}
</ul>

<!-- Small -->
<ul class="{{ namespace }}overlapItems list-unstyled{% for mod in modifiers %} {{ mod }}{% endfor %}{% for mod in classes %} {{ mod }}{% endfor %}">
	{% for key, item in items %}
		<li>
			{% render "@avatar--image-small" %}
		</li>
	{% endfor %}
</ul>

<!-- Overlap Shadow -->
<ul class="{{ namespace }}overlapItems{% for mod in modifiers %} {{ mod }}{% endfor %}{% for mod in classes %} {{ mod }}{% endfor %} list-unstyled">
	{% for key, item in items %}
		<li>
			{% render "@avatar--image" %}
		</li>
	{% endfor %}
</ul>