[Client] Improve UI

2 files changed, 30 insertions, 13 deletions

diff --git a/src/client/app/common/views/components/alert.vue b/src/client/app/common/views/components/alert.vue
index edf04666cb..27d876c87a 100644
--- a/src/client/app/common/views/components/alert.vue
+++ b/src/client/app/common/views/components/alert.vue
@@ -1,11 +1,11 @@
 <template>
-<div class="felqjxyj" :class="{ pointer }">
+<div class="felqjxyj" :class="{ splash }">
 	<div class="bg" ref="bg" @click="onBgClick"></div>
 	<div class="main" ref="main">
 		<div class="icon" :class="type"><fa :icon="icon"/></div>
 		<header v-if="title" v-html="title"></header>
 		<div class="body" v-if="text" v-html="text"></div>
-		<ui-horizon-group no-grow class="buttons">
+		<ui-horizon-group no-grow class="buttons" v-if="!splash">
 			<ui-button @click="ok" primary autofocus>OK</ui-button>
 			<ui-button @click="cancel" v-if="showCancelButton">Cancel</ui-button>
 		</ui-horizon-group>
@@ -31,15 +31,15 @@ export default Vue.extend({
 		},
 		text: {
 			type: String,
-			required: true
+			required: false
 		},
 		showCancelButton: {
 			type: Boolean,
 			default: false
 		},
-		pointer: {
+		splash: {
 			type: Boolean,
-			default: true
+			default: false
 		}
 	},
 
@@ -72,6 +72,12 @@ export default Vue.extend({
 				duration: 300,
 				easing: [0, 0.5, 0.5, 1]
 			});
+
+			if (this.splash) {
+				setTimeout(() => {
+					this.close();
+				}, 1000);
+			}
 		});
 	},
 
@@ -125,8 +131,13 @@ export default Vue.extend({
 	width 100%
 	height 100%
 
-	&:not(.pointer)
-		pointer-events none
+	&.splash
+		&, *
+			pointer-events none !important
+
+		> .main
+			min-width 0
+			width initial
 
 	> .bg
 		display block
diff --git a/src/client/app/common/views/components/note-menu.vue b/src/client/app/common/views/components/note-menu.vue
index 72063c8758..d848cb765d 100644
--- a/src/client/app/common/views/components/note-menu.vue
+++ b/src/client/app/common/views/components/note-menu.vue
@@ -78,8 +78,10 @@ export default Vue.extend({
 			this.$root.api('i/pin', {
 				noteId: this.note.id
 			}).then(() => {
-				// TODO
-				//this.$root.new(Ok);
+				this.$root.alert({
+					type: 'success',
+					splash: true
+				});
 				this.destroyDom();
 			});
 		},
@@ -112,8 +114,10 @@ export default Vue.extend({
 			this.$root.api('notes/favorites/create', {
 				noteId: this.note.id
 			}).then(() => {
-				// TODO
-				//this.$root.new(Ok);
+				this.$root.alert({
+					type: 'success',
+					splash: true
+				});
 				this.destroyDom();
 			});
 		},
@@ -122,8 +126,10 @@ export default Vue.extend({
 			this.$root.api('notes/favorites/delete', {
 				noteId: this.note.id
 			}).then(() => {
-				// TODO
-				//this.$root.new(Ok);
+				this.$root.alert({
+					type: 'success',
+					splash: true
+				});
 				this.destroyDom();
 			});
 		},