@govbr-ds/core
Version:
Padrão Digital de Governo
35 lines (34 loc) • 2.11 kB
HTML
<div class="col-sm-6 col-md-4 col-lg-3">
<div class="br-card h-fixed">
<div class="card-header">
<div class="d-flex"><span class="br-avatar mt-1" title="Fulano da Silva"><span class="content"><img src="https://picsum.photos/id/823/400"/></span></span>
<div class="ml-3">
<div class="text-weight-semi-bold text-up-02">Maria Amorim</div>
<div>UX Designer</div>
</div>
<div class="ml-auto">
<button class="br-button circle" type="button" aria-label="Ícone ilustrativo"><i class="fas fa-ellipsis-v" aria-hidden="true"></i>
</button>
</div>
</div>
</div>
<div class="card-content" tabindex="0">
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Tempore perferendis nam porro atque ex at, numquam non optio ab eveniet error vel ad exercitationem, earum et fugiat recusandae harum? Assumenda. Lorem ipsum dolor sit, amet consectetur adipisicing elit. Tempore perferendis nam porro atque ex at, numquam non optio ab eveniet error vel ad exercitationem, earum et fugiat recusandae harum? Assumenda.</p>
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Tempore perferendis nam porro atque ex at, numquam non optio ab eveniet error vel ad exercitationem, earum et fugiat recusandae harum? Assumenda. Lorem ipsum dolor sit, amet consectetur adipisicing elit. Tempore perferendis nam porro atque ex at, numquam non optio ab eveniet error vel ad exercitationem, earum et fugiat recusandae harum? Assumenda.</p>
</div>
<div class="card-footer">
<div class="d-flex">
<div>
<button class="br-button" type="button">Button
</button>
</div>
<div class="ml-auto">
<button class="br-button circle" type="button" aria-label="Ícone ilustrativo"><i class="fas fa-heart" aria-hidden="true"></i>
</button>
<button class="br-button circle" type="button" aria-label="Ícone ilustrativo 3"><i class="fas fa-share-alt" aria-hidden="true"></i>
</button>
</div>
</div>
</div>
</div>
</div>