Browse Source

Update Timeline, fix padding

Daniel Supernault 4 years ago
parent
commit
3b071e56ac
1 changed files with 12 additions and 8 deletions
  1. 12 8
      resources/assets/js/components/Timeline.vue

+ 12 - 8
resources/assets/js/components/Timeline.vue

@@ -24,7 +24,7 @@
 								<announcements-card v-on:show-tips="showTips = $event"></announcements-card>
 								<announcements-card v-on:show-tips="showTips = $event"></announcements-card>
 							</div>
 							</div>
 
 
-							<div v-if="index == 2 && showSuggestions == true && suggestions.length" class="card mb-sm-4 status-card card-md-rounded-0 shadow-none border">
+							<div v-if="index == 2 && showSuggestions == true && suggestions.length" class="card status-card rounded-0 shadow-none border">
 								<div class="card-header d-flex align-items-center justify-content-between bg-white border-0 pb-0">
 								<div class="card-header d-flex align-items-center justify-content-between bg-white border-0 pb-0">
 									<h6 class="text-muted font-weight-bold mb-0">Suggestions For You</h6>
 									<h6 class="text-muted font-weight-bold mb-0">Suggestions For You</h6>
 									<span class="cursor-pointer text-muted" v-on:click="hideSuggestions"><i class="fas fa-times"></i></span>
 									<span class="cursor-pointer text-muted" v-on:click="hideSuggestions"><i class="fas fa-times"></i></span>
@@ -55,7 +55,7 @@
 								</div>
 								</div>
 							</div>
 							</div>
 
 
-							<div v-if="index == 4 && showHashtagPosts && hashtagPosts.length" class="card mb-sm-4 status-card card-md-rounded-0 shadow-none border">
+							<div v-if="index == 4 && showHashtagPosts && hashtagPosts.length" class="card status-card rounded-0 shadow-none border">
 								<div class="card-header d-flex align-items-center justify-content-between bg-white border-0 pb-0">
 								<div class="card-header d-flex align-items-center justify-content-between bg-white border-0 pb-0">
 									<span></span>
 									<span></span>
 									<h6 class="text-muted font-weight-bold mb-0"><a :href="'/discover/tags/'+hashtagPostsName+'?src=tr'">#{{hashtagPostsName}}</a></h6>
 									<h6 class="text-muted font-weight-bold mb-0"><a :href="'/discover/tags/'+hashtagPostsName+'?src=tr'">#{{hashtagPostsName}}</a></h6>
@@ -113,7 +113,7 @@
 						</div>
 						</div>
 
 
 						<div v-if="!loading && feed.length">
 						<div v-if="!loading && feed.length">
-							<div class="card rounded-0 border-top-0 status-card card-md-rounded-0 shadow-none border">
+							<div class="card rounded-0 border-top-0 status-card rounded-0 shadow-none border">
 								<div class="card-body py-5 my-5">
 								<div class="card-body py-5 my-5">
 									<infinite-loading @infinite="infiniteTimeline" :distance="800">
 									<infinite-loading @infinite="infiniteTimeline" :distance="800">
 										<div slot="no-more">
 										<div slot="no-more">
@@ -158,8 +158,9 @@
 								</div>
 								</div>
 							</div>
 							</div>
 						</div>
 						</div>
+
 						<div v-if="!loading && scope == 'home' && feed.length == 0">
 						<div v-if="!loading && scope == 'home' && feed.length == 0">
-							<div class="card rounded-0 mt-4 status-card card-md-rounded-0 shadow-none border">
+							<div class="card rounded-0 mt-4 status-card rounded-0 shadow-none border">
 								<div v-if="profile.following_count != '0'" class="card-body py-5 my-5">
 								<div v-if="profile.following_count != '0'" class="card-body py-5 my-5">
 									<p class="text-center"><i class="far fa-check-circle fa-8x text-lighter"></i></p>
 									<p class="text-center"><i class="far fa-check-circle fa-8x text-lighter"></i></p>
 									<p class="text-center h3 font-weight-light">You're All Caught Up!</p>
 									<p class="text-center h3 font-weight-light">You're All Caught Up!</p>
@@ -195,7 +196,7 @@
 							 v-for="(status, index) in discover_feed"
 							 v-for="(status, index) in discover_feed"
 							 :key="`discover_feed-${index}-${status.id}`">
 							 :key="`discover_feed-${index}-${status.id}`">
 
 
-							<div v-if="index == 2 && showSuggestions == true && suggestions.length" class="card mb-sm-4 status-card card-md-rounded-0 shadow-none border">
+							<div v-if="index == 2 && showSuggestions == true && suggestions.length" class="card status-card rounded-0 shadow-none border">
 								<div class="card-header d-flex align-items-center justify-content-between bg-white border-0 pb-0">
 								<div class="card-header d-flex align-items-center justify-content-between bg-white border-0 pb-0">
 									<h6 class="text-muted font-weight-bold mb-0">Suggestions For You</h6>
 									<h6 class="text-muted font-weight-bold mb-0">Suggestions For You</h6>
 									<span class="cursor-pointer text-muted" v-on:click="hideSuggestions"><i class="fas fa-times"></i></span>
 									<span class="cursor-pointer text-muted" v-on:click="hideSuggestions"><i class="fas fa-times"></i></span>
@@ -274,7 +275,10 @@
 								</div>
 								</div>
 							</div>
 							</div>
 
 
-							<status-card :status="status" :recommended="true" />
+							<status-card
+								:class="{'border-top': index === 0}"
+								:status="status"
+								:recommended="true" />
 						</div>
 						</div>
 					</div>
 					</div>
 				</div>
 				</div>
@@ -294,10 +298,10 @@
 										<a :href="!userStory ? profile.url : '/stories/' + profile.acct" class="mr-3">
 										<a :href="!userStory ? profile.url : '/stories/' + profile.acct" class="mr-3">
 											<!-- <img class="mr-3 rounded-circle box-shadow" :src="profile.avatar || '/storage/avatars/default.png'" alt="avatar" width="64px" height="64px" onerror="this.onerror=null;this.src='/storage/avatars/default.png?v=2'"> -->
 											<!-- <img class="mr-3 rounded-circle box-shadow" :src="profile.avatar || '/storage/avatars/default.png'" alt="avatar" width="64px" height="64px" onerror="this.onerror=null;this.src='/storage/avatars/default.png?v=2'"> -->
 											<div v-if="userStory" class="has-story cursor-pointer shadow-sm" @click="storyRedirect()">
 											<div v-if="userStory" class="has-story cursor-pointer shadow-sm" @click="storyRedirect()">
-												<img class="rounded-circle box-shadow" :src="profile.avatar" width="64px" height="64px" onerror="this.onerror=null;this.src='/storage/avatars/default.png?v=2'" alt="avatar" v-once>
+												<img class="rounded-circle box-shadow" :src="profile.avatar" width="64px" height="64px" onerror="this.onerror=null;this.src='/storage/avatars/default.png?v=2'" alt="avatar">
 											</div>
 											</div>
 											<div v-else>
 											<div v-else>
-												<img class="rounded-circle box-shadow" :src="profile.avatar" width="64px" height="64px" onerror="this.onerror=null;this.src='/storage/avatars/default.png?v=2'" alt="avatar" v-once>
+												<img class="rounded-circle box-shadow" :src="profile.avatar" width="64px" height="64px" onerror="this.onerror=null;this.src='/storage/avatars/default.png?v=2'" alt="avatar">
 											</div>
 											</div>
 										</a>
 										</a>
 										<div class="media-body d-flex justify-content-between word-break" >
 										<div class="media-body d-flex justify-content-between word-break" >