add a nice fade effect

This commit is contained in:
Nolan Lawson 2018-01-21 14:31:59 -08:00
parent ff6c370ef1
commit 75d78d44a2
2 changed files with 6 additions and 3 deletions

View File

@ -2,7 +2,9 @@
<div class="timeline" role="feed" aria-label="{{label}}" on:initialized>
<VirtualList component="{{StatusListItem}}"
items="{{keyedStatuses}}"
on:scrollToBottom="onScrollToBottom()" />
on:scrollToBottom="onScrollToBottom()"
shown="{{initialized}}"
/>
</div>
<style>
.timeline {

View File

@ -1,5 +1,5 @@
<!-- TODO: setting height is hacky, just make this element the scroller -->
<div class="virtual-list" style="height: {{$height}}px;">
<div class="virtual-list {{shown ? '' : 'hidden'}}" style="height: {{$height}}px;">
{{#each $visibleItems as item @key}}
<VirtualListItem :component
offset="{{item.offset}}"
@ -12,6 +12,7 @@
<style>
.virtual-list {
position: relative;
transition: opacity 0.25s linear;
}
</style>
<script>