1
0
mirror of https://github.com/tabler/tabler.git synced 2026-07-29 14:34:37 +04:00

profile timeline fixes

This commit is contained in:
codecalm
2019-12-29 14:00:57 +01:00
parent 8583868a2c
commit 84b60ab5d7
4 changed files with 57 additions and 30 deletions
+39 -29
View File
@@ -3,20 +3,20 @@
<div class="input-group"> <div class="input-group">
<input type="text" class="form-control" placeholder="Message"> <input type="text" class="form-control" placeholder="Message">
<div class="input-group-append"> <div class="input-group-append">
<button type="button" class="btn btn-secondary"> {% include ui/button.html icon="camera" icon-only=true color="secondary" %}
<i class="fe fe-camera"></i>
</button>
</div> </div>
</div> </div>
</div> </div>
<ul class="list-group card-list-group"> <ul class="list-group card-list-group">
<li class="list-group-item py-4"> <li class="list-group-item py-4">
<div class="media"> <div class="d-flex">
<div class="media-object avatar avatar-md mr-4" style="background-image: url({{ site.data.people[4].photo }})"></div> <div>
<div class="media-body"> {% include ui/avatar.html person-id=5 class="mr-3" %}
<div class="media-heading"> </div>
<div class="flex-fill">
<div>
<small class="float-right text-muted">4 min</small> <small class="float-right text-muted">4 min</small>
<h4 class="font-semibold">{{ site.data.people[4].first_name }} {{ site.data.people[4].last_name }}</h4 class="font-semibold"> <h4>{{ site.data.people[4].first_name }} {{ site.data.people[4].last_name }}</h4>
</div> </div>
<div> <div>
@@ -25,18 +25,22 @@
nascetur ridiculus mus. nascetur ridiculus mus.
</div> </div>
<ul class="media-list"> <ul class="list-unstyled">
<li class="media mt-4"> <li class="d-flex mt-4">
<div class="media-object avatar mr-4" style="background-image: url({{ site.data.people[7].photo }})"></div> <div>
<div class="media-body"> {% 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> <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 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. auctor fringilla. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Sed posuere consectetur est at lobortis.
</div> </div>
</li> </li>
<li class="media mt-4"> <li class="d-flex mt-4">
<div class="media-object avatar mr-4" style="background-image: url({{ site.data.people[9].photo }})"></div> <div>
<div class="media-body"> {% 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> <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 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. amet risus.
@@ -47,12 +51,14 @@
</div> </div>
</li> </li>
<li class="list-group-item py-4"> <li class="list-group-item py-4">
<div class="media"> <div class="d-flex">
<div class="media-object avatar avatar-md mr-4" style="background-image: url({{ site.data.people[4].photo }})"></div> <div>
<div class="media-body"> {% include ui/avatar.html person-id=11 class="mr-3" %}
<div class="media-heading"> </div>
<div class="flex-fill">
<div>
<small class="float-right text-muted">12 min</small> <small class="float-right text-muted">12 min</small>
<h4 class="font-semibold">{{ site.data.people[4].first_name }} {{ site.data.people[4].last_name }}</h4 class="font-semibold"> <h4>{{ site.data.people[10].first_name }} {{ site.data.people[10].last_name }}</h4>
</div> </div>
<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 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
@@ -62,12 +68,14 @@
</div> </div>
</li> </li>
<li class="list-group-item py-4"> <li class="list-group-item py-4">
<div class="media"> <div class="d-flex">
<div class="media-object avatar avatar-md mr-4" style="background-image: url({{ site.data.people[4].photo }})"></div> <div>
<div class="media-body"> {% include ui/avatar.html person-id=15 class="mr-3" %}
<div class="media-heading"> </div>
<div class="flex-fill">
<div>
<small class="float-right text-muted">34 min</small> <small class="float-right text-muted">34 min</small>
<h4 class="font-semibold">{{ site.data.people[4].first_name }} {{ site.data.people[4].last_name }}</h4 class="font-semibold"> <h4>{{ site.data.people[14].first_name }} {{ site.data.people[14].last_name }}</h4>
</div> </div>
<div> <div>
@@ -75,10 +83,12 @@
venenatis vestibulum. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. venenatis vestibulum. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui.
</div> </div>
<ul class="media-list"> <ul class="list-unstyled">
<li class="media mt-4"> <li class="d-flex mt-4">
<div class="media-object avatar mr-4" style="background-image: url({{ site.data.people[5].photo }})"></div> <div>
<div class="media-body"> {% 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> <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 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. auctor fringilla. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Sed posuere consectetur est at lobortis.
+2 -1
View File
@@ -1,9 +1,10 @@
{% removeemptylines %} {% removeemptylines %}
{% assign spinner-class = false %} {% assign spinner-class = false %}
{% assign color = include.color | default: 'secondary' %}
{% assign provider = include.provider | default: 'fe' %} {% assign provider = include.provider | default: 'fe' %}
{% if include.text %}{% assign spinner-class="mr-2" %}{% endif %} {% if include.text %}{% assign spinner-class="mr-2" %}{% endif %}
{% assign e = include.element | default: 'a' %} {% assign e = include.element | default: 'a' %}
<{{ e }}{% if e == 'a' %} href="{% if include.href %}{{ site.base }}/{{ include.href }}{% else %}#{% endif %}"{% endif %}{% if include.type %} type="{{ include.type }}"{% endif %} class="btn{% if include.height %} btn-{{ include.height }}{% endif %}{% if include.color %} btn-{% if include.outline %}outline-{% endif %}{{ include.color }}{% endif %}{% if include.disabled %} disabled{% endif %}{% if include.square %} btn-square{% endif %}{% if include.pill %} btn-pill{% endif %}{% if include['size'] %} btn-{{ include['size'] }}{% endif %}{% if include.class %} {{ include.class }}{% endif %}{% if include.block %} btn-block{% endif %}{% if include.link %} btn-link{% endif %}{% if include.icon-only %} btn-icon{% endif %}"> <{{ e }}{% if e == 'a' %} href="{% if include.href %}{{ site.base }}/{{ include.href }}{% else %}#{% endif %}"{% endif %}{% if include.type %} type="{{ include.type }}"{% endif %} class="btn{% if include.height %} btn-{{ include.height }}{% endif %}{% if color %} btn-{% if include.outline %}outline-{% endif %}{{ color }}{% endif %}{% if include.disabled %} disabled{% endif %}{% if include.square %} btn-square{% endif %}{% if include.pill %} btn-pill{% endif %}{% if include['size'] %} btn-{{ include['size'] }}{% endif %}{% if include.class %} {{ include.class }}{% endif %}{% if include.block %} btn-block{% endif %}{% if include.link %} btn-link{% endif %}{% if include.icon-only %} btn-icon{% endif %}">
{% if include.spinner %} {% if include.spinner %}
{% include ui/spinner.html color=false size="sm" class=spinner-class element="span" %}{% endif %} {% include ui/spinner.html color=false size="sm" class=spinner-class element="span" %}{% endif %}
{% if include.icon %}{% include_cached ui/icon.html icon=include.icon use-svg=true %}{% endif %} {% if include.icon %}{% include_cached ui/icon.html icon=include.icon use-svg=true %}{% endif %}
+12
View File
@@ -0,0 +1,12 @@
---
title: Music components
page-title: Music components
---
<div class="card">
{% for track in site.data.tracks %}
<div class="card-body">
{{ track.name }}
</div>
{% endfor %}
</div>
+4
View File
@@ -185,6 +185,10 @@
> :last-child { > :last-child {
margin-bottom: 0; margin-bottom: 0;
} }
& + & {
border-top: 1px solid $border-color;
}
} }
.card-body-scrollable { .card-body-scrollable {