From 4ad51672c15814841421d4b5076a0f3040f10c6d Mon Sep 17 00:00:00 2001
From: syuilo <syuilotan@yahoo.co.jp>
Date: Thu, 17 May 2018 23:53:55 +0900
Subject: [PATCH] Fix bug

---
 .../app/mobile/views/components/notes.vue     | 19 ++++++++++---------
 .../app/mobile/views/components/ui.header.vue |  5 +++++
 src/client/app/store.ts                       |  5 +++++
 3 files changed, 20 insertions(+), 9 deletions(-)

diff --git a/src/client/app/mobile/views/components/notes.vue b/src/client/app/mobile/views/components/notes.vue
index 53e232e52..e77698dea 100644
--- a/src/client/app/mobile/views/components/notes.vue
+++ b/src/client/app/mobile/views/components/notes.vue
@@ -1,7 +1,5 @@
 <template>
 <div class="mk-notes">
-	<div class="newer-indicator" :style="{ top: $store.state.uiHeaderHeight + 'px' }" v-show="queue.length > 0"></div>
-
 	<slot name="head"></slot>
 
 	<slot name="empty" v-if="notes.length == 0 && !fetching && requestInitPromise == null"></slot>
@@ -71,6 +69,16 @@ export default Vue.extend({
 		}
 	},
 
+	watch: {
+		queue(x) {
+			if (x.length > 0) {
+				this.$store.commit('indicate', true);
+			} else {
+				this.$store.commit('indicate', false);
+			}
+		}
+	},
+
 	mounted() {
 		document.addEventListener('visibilitychange', this.onVisibilitychange, false);
 		window.addEventListener('scroll', this.onScroll);
@@ -238,13 +246,6 @@ root(isDark)
 			[data-fa]
 				margin-right 8px
 
-	> .newer-indicator
-		position -webkit-sticky
-		position sticky
-		z-index 100
-		height 3px
-		background $theme-color
-
 	> .init
 		padding 64px 0
 		text-align center
diff --git a/src/client/app/mobile/views/components/ui.header.vue b/src/client/app/mobile/views/components/ui.header.vue
index 509463333..a49462b15 100644
--- a/src/client/app/mobile/views/components/ui.header.vue
+++ b/src/client/app/mobile/views/components/ui.header.vue
@@ -13,6 +13,7 @@
 			<slot name="func"></slot>
 		</div>
 	</div>
+	<div class="indicator" v-show="$store.state.indicate"></div>
 </div>
 </template>
 
@@ -156,6 +157,10 @@ root(isDark)
 	&, *
 		user-select none
 
+	> .indicator
+		height 3px
+		background $theme-color
+
 	> .main
 		color rgba(#fff, 0.9)
 
diff --git a/src/client/app/store.ts b/src/client/app/store.ts
index e9cd952bd..1f1189054 100644
--- a/src/client/app/store.ts
+++ b/src/client/app/store.ts
@@ -24,10 +24,15 @@ export default (os: MiOS) => new Vuex.Store({
 	}],
 
 	state: {
+		indicate: false,
 		uiHeaderHeight: 0
 	},
 
 	mutations: {
+		indicate(state, x) {
+			state.indicate = x;
+		},
+
 		setUiHeaderHeight(state, height) {
 			state.uiHeaderHeight = height;
 		}