ng2-encrm-components/src/app/element-list/elements/avatars-preview/avatars-preview.component.html

angular 2 components

<div class="col-xs-12">
  <h1 id="avatars">Avatars</h1>
  <br>
  <en-avatar src="http://goo.gl/vMSPTk" label="Chewbacca"></en-avatar>
  <en-avatar avatar2x src="http://goo.gl/vMSPTk"></en-avatar>
  <div class="card card-inverse bg-inverse">
    <en-avatar src="http://goo.gl/vMSPTk" fName="Chew" lName="Bacca" inverse
               class="m-a-1"></en-avatar>
  </div>
  <br><br>
  <tabset>
    <tab heading="HTML">
      <pre><code highlight class="html">
&lt;en-avatar src=&quot;http://goo.gl/vMSPTk&quot; label=&quot;Chewbacca&quot;&gt;&lt;/en-avatar&gt;
&lt;en-avatar avatar2x src=&quot;http://goo.gl/vMSPTk&quot;&gt;&lt;/en-avatar&gt;
&lt;!--set [inverse] to inverse color of label--&gt;
&lt;div class=&quot;card card-inverse bg-inverse&quot;&gt;
  &lt;en-avatar src=&quot;http://goo.gl/vMSPTk&quot; fName=&quot;Chew&quot; lName=&quot;Bacca&quot; inverse class=&quot;m-a-1&quot;&gt;&lt;/en-avatar&gt;
&lt;/div&gt;
      </code></pre>
    </tab>
  </tabset>
</div>