mirror of
https://github.com/tabler/tabler.git
synced 2026-07-28 14:04:38 +04:00
codecalm
103 lines
4.1 KiB
HTML
103 lines
4.1 KiB
HTML
<div class="card">
|
|
<div class="card-header">
|
|
<div class="input-group">
|
|
<input type="text" class="form-control" placeholder="Message">
|
|
<div class="input-group-append">
|
|
{% include ui/button.html icon="camera" icon-only=true color="secondary" %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<ul class="list-group card-list-group">
|
|
<li class="list-group-item py-4">
|
|
<div class="d-flex">
|
|
<div>
|
|
{% include ui/avatar.html person-id=5 class="mr-3" %}
|
|
</div>
|
|
<div class="flex-fill">
|
|
<div>
|
|
<small class="float-right text-muted">4 min</small>
|
|
<h4>{{ site.data.people[4].first_name }} {{ site.data.people[4].last_name }}</h4>
|
|
</div>
|
|
|
|
<div>
|
|
Aenean lacinia bibendum nulla sed consectetur. Vestibulum id ligula porta felis euismod semper. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Cras
|
|
justo odio, dapibus ac facilisis in, egestas eget quam. Vestibulum id ligula porta felis euismod semper. Cum sociis natoque penatibus et magnis dis parturient montes,
|
|
nascetur ridiculus mus.
|
|
</div>
|
|
|
|
<ul class="list-unstyled">
|
|
<li class="d-flex mt-4">
|
|
<div>
|
|
{% include ui/avatar.html person-id=8 class="mr-3" %}
|
|
</div>
|
|
<div class="flex-fill">
|
|
<strong>{{ site.data.people[7].first_name }} {{ site.data.people[7].last_name }}: </strong>
|
|
Donec id elit non mi porta gravida at eget metus. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Donec ullamcorper nulla non metus
|
|
auctor fringilla. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Sed posuere consectetur est at lobortis.
|
|
</div>
|
|
</li>
|
|
<li class="d-flex mt-4">
|
|
<div>
|
|
{% include ui/avatar.html person-id=10 class="mr-3" %}
|
|
</div>
|
|
<div class="flex-fill">
|
|
<strong>{{ site.data.people[9].first_name }} {{ site.data.people[9].last_name }}: </strong>
|
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit
|
|
amet risus.
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
<li class="list-group-item py-4">
|
|
<div class="d-flex">
|
|
<div>
|
|
{% include ui/avatar.html person-id=11 class="mr-3" %}
|
|
</div>
|
|
<div class="flex-fill">
|
|
<div>
|
|
<small class="float-right text-muted">12 min</small>
|
|
<h4>{{ site.data.people[10].first_name }} {{ site.data.people[10].last_name }}</h4>
|
|
</div>
|
|
<div>
|
|
Donec id elit non mi porta gravida at eget metus. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Cum sociis natoque penatibus et magnis dis
|
|
parturient montes, nascetur ridiculus mus. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
<li class="list-group-item py-4">
|
|
<div class="d-flex">
|
|
<div>
|
|
{% include ui/avatar.html person-id=15 class="mr-3" %}
|
|
</div>
|
|
<div class="flex-fill">
|
|
<div>
|
|
<small class="float-right text-muted">34 min</small>
|
|
<h4>{{ site.data.people[14].first_name }} {{ site.data.people[14].last_name }}</h4>
|
|
</div>
|
|
|
|
<div>
|
|
Donec ullamcorper nulla non metus auctor fringilla. Vestibulum id ligula porta felis euismod semper. Aenean eu leo quam. Pellentesque ornare sem lacinia quam
|
|
venenatis vestibulum. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui.
|
|
</div>
|
|
|
|
<ul class="list-unstyled">
|
|
<li class="d-flex mt-4">
|
|
<div>
|
|
{% include ui/avatar.html person-id=6 class="mr-3" %}
|
|
</div>
|
|
<div class="flex-fill">
|
|
<strong>{{ site.data.people[5].first_name }} {{ site.data.people[5].last_name }}: </strong>
|
|
Donec id elit non mi porta gravida at eget metus. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Donec ullamcorper nulla non metus
|
|
auctor fringilla. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Sed posuere consectetur est at lobortis.
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|