moep/dynamicweb
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Align text to flex-start or flex-end for timeline

Browse source
This commit is contained in:
M.Ravi 2017-11-17 16:30:44 +01:00
parent e9b3e77752
commit 501dc08b0e
2 changed files with 36 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

34
ungleich_page/static/ungleich_page/css/ungleich.css
View file

@ -126,3 +126,37 @@
.header_slider > .carousel .item {
padding-top: 150px;
}
.timeline>li .timeline-panel {
display: flex;
min-height: 80px;
align-items: center;
padding-bottom: 15px;
}
.flex-justify-content-end{
justify-content: flex-end;
}
.flex-justify-content-start{
justify-content: flex-start;
}
.timeline>li.timeline-inverted>.timeline-panel {
padding-bottom: 0;
}
@media (min-width: 768px) and (max-width: 991px) {
.timeline>li .timeline-panel {
min-height: 100px;
}
}
@media (min-width: 992px) {
.timeline>li .timeline-panel {
min-height: 170px;
}
}

2
ungleich_page/templates/ungleich_page/glasfaser/_about_item.html
View file

@ -4,7 +4,7 @@
<img class="img-circle img-responsive" src="{{ instance.image.url }}" alt="">
</div>
{% if instance.link_url %}</a>{% endif %}
<div class="timeline-panel wow {% if instance.inverted %}slideInRight{% else %}slideInLeft{% endif %}">
<div class="timeline-panel wow {% if instance.inverted %}slideInRight flex-justify-content-start {% else %}slideInLeft flex-justify-content-end{% endif %}">
<div class="timeline-body">
<p>{{ instance.title }}</p>
</div>