Merge pull request #832 from pixelfed/frontend-ui-refactor

Frontend ui refactor

public/mix-manifest.json

@@ -8,5 +8,5 @@
     "/js/micro.js": "/js/micro.js?id=69703f96f09e6ff04be6",
     "/js/profile.js": "/js/profile.js?id=dd006b565cac9962d5ad",
     "/js/status.js": "/js/status.js?id=281d075819ccc5ea794d",
-    "/js/timeline.js": "/js/timeline.js?id=5bd746e687f9a8a894b7"
+    "/js/timeline.js": "/js/timeline.js?id=cf161bb68f03837565d9"
 }

resources/assets/js/components/Timeline.vue

@@ -138,7 +138,7 @@
 					</div>
 				</div>
 			</div>
-			<div v-if="modes.infinite == false && !loading && feed.length > 0" class="pagination d-none">
+			<div v-if="modes.infinite == false && !loading && feed.length > 0" class="pagination">
 				<p class="btn btn-outline-secondary font-weight-bold btn-block" v-on:click="loadMore">Load more posts</p>
 			</div>
 			<div v-if="!loading && scope == 'home' && feed.length == 0">
@@ -421,10 +421,11 @@
 				});
 			},
 
-			loadMore() {
+			loadMore(event) {
 				let homeTimeline = '/api/v1/timelines/home';
 				let localTimeline = '/api/v1/timelines/public';
 				let apiUrl = this.scope == 'home' ? homeTimeline : localTimeline;
+				event.target.innerText = 'Loading...';
 				axios.get(apiUrl, {
 					params: {
 						page: this.page,
@@ -440,6 +441,7 @@
 						}
 						this.page += 1;
 						this.loading = false;
+						event.target.innerText = 'Load more posts';
 					} else {
 					}
 				});