diff --git a/resources/assets/js/components/StoryTimelineComponent.vue b/resources/assets/js/components/StoryTimelineComponent.vue
index 9a4051c2..fa372474 100644
--- a/resources/assets/js/components/StoryTimelineComponent.vue
+++ b/resources/assets/js/components/StoryTimelineComponent.vue
@@ -1,6 +1,6 @@
 <template>
 	<div>
-		<div v-if="stories.length != 0">
+		<div v-if="show" class="card card-body p-0 border mt-4 mb-3 shadow-none">
 			<div id="storyContainer" :class="[list == true ? 'mt-1 mr-3 mb-0 ml-1':'mx-3 mt-3 mb-0 pb-0']"></div>
 		</div>
 	</div>
@@ -21,6 +21,7 @@
 		props: ['list'],
 		data() {
 			return {
+				show: false,
 				stories: {},
 			}
 		},
@@ -34,6 +35,10 @@
 				axios.get('/api/stories/v0/recent')
 				.then(res => {
 					let data = res.data;
+					if(!res.data.length) {
+						this.show = false;
+						return;
+					}
 					let stories = new Zuck('storyContainer', {
 						list: this.list == true ? true : false,
 						stories: data,
@@ -70,6 +75,7 @@
 						});
 					});
 				});
+				this.show = true;
 			}
 		}
 	}
diff --git a/resources/assets/js/components/Timeline.vue b/resources/assets/js/components/Timeline.vue
index dff242f9..f4c2cb5a 100644
--- a/resources/assets/js/components/Timeline.vue
+++ b/resources/assets/js/components/Timeline.vue
@@ -7,7 +7,7 @@
 			</p>
 		</div>
 		<div :class="[modes.distractionFree ? 'col-md-8 col-lg-8 offset-md-2 px-0 mb-sm-3 timeline order-2 order-md-1':'col-md-8 col-lg-8 px-0 mb-sm-3 timeline order-2 order-md-1']">
-			<div v-if="config.features.stories" class="card card-body p-0 border mt-4 mb-3 shadow-none">
+			<div style="margin-top:32px;">
 				<story-component v-if="config.features.stories"></story-component>
 			</div>
 			<div>