Avatar

v.0.0.1

Le composant d'avatar se déclare avec la classe .avatar.

Un border radius est appliqué directement sur l'image. L'image doit avoir ces caractéristiques :

Ratio : carré
Taille : 40*40 px
Format : jpg, png, gif

<div class="avatar">
  <div class="avatar-thumb">
    <img src="/assets/img/placeholder/avatar@1x.jpg" width="40" height="40" alt="Laurent Sutterlity" />
  </div>
</div>

Il est possible d'avoir une image rétina en utilisant l'attribut srcset (voir support navigateur).

<div class="avatar">
  <div class="avatar-thumb">
    <img src="assets/img/placeholder/avatar@1x.jpg"
         srcset="/assets/img/placeholder/avatar@1x.jpg 1x,
                 /assets/img/placeholder/avatar@2x.jpg 2x"
         width="40" height="40" alt="Laurent Sutterlity" />
  </div>
</div>