pinafore/src/routes/_components/timeline/LoadingFooter.html

32 lines
705 B
HTML

<div class="loading-footer {shown ? '' : 'hidden'}">
<LoadingSpinner size={48} />
<span class="loading-footer-info">
Loading more...
</span>
</div>
<style>
.loading-footer {
padding: 20px 0 10px;
display: flex;
align-items: center;
justify-content: center;
}
.loading-footer-info {
margin-left: 20px;
font-size: 1.3em;
}
</style>
<script>
import LoadingSpinner from '../LoadingSpinner.html'
import { store } from '../../_store/store'
export default {
store: () => store,
computed: {
shown: ({ $timelineInitialized, $runningUpdate }) => ($timelineInitialized && $runningUpdate)
},
components: {
LoadingSpinner
}
}
</script>