🎨

package.json

@@ -219,6 +219,7 @@
 		"vue-router": "3.0.1",
 		"vue-style-loader": "4.1.2",
 		"vue-svg-inline-loader": "1.2.0",
+		"vue-sweetalert2": "1.5.5",
 		"vue-template-compiler": "2.5.17",
 		"vuedraggable": "2.16.0",
 		"vuewordcloud": "18.7.11",

src/client/app/app.styl

@@ -130,3 +130,16 @@ pre
 
 [data-fa]
 	display inline-block
+
+.swal2-popup
+	background var(--face) !important
+
+.swal-icon-only
+	width 180px !important
+
+	> .swal2-header
+		> .swal2-icon
+			margin 1.25em auto 1.875em
+
+		> .swal2-title
+			display none

src/client/app/common/views/components/note-menu.vue

@@ -103,6 +103,12 @@ export default Vue.extend({
 			(this as any).api('notes/favorites/create', {
 				noteId: this.note.id
 			}).then(() => {
+				this.$swal({
+					type: 'success',
+					showConfirmButton: false,
+					timer: 1250,
+					customClass: 'swal-icon-only'
+				});
 				this.destroyDom();
 			});
 		},

src/client/app/init.ts

@@ -8,6 +8,7 @@ import VueRouter from 'vue-router';
 import * as TreeView from 'vue-json-tree-view';
 import VAnimateCss from 'v-animate-css';
 import VModal from 'vue-js-modal';
+import VueSweetalert2 from 'vue-sweetalert2';
 
 import VueHotkey from './common/hotkey';
 import App from './app.vue';
@@ -26,6 +27,7 @@ Vue.use(TreeView);
 Vue.use(VAnimateCss);
 Vue.use(VModal);
 Vue.use(VueHotkey);
+Vue.use(VueSweetalert2);
 
 // Register global directives
 require('./common/views/directives');