Created a uniform menu for notes that works on mobile

Added list sorting
Added shared notes
Fixed some little bugs here and there

client/src/components/SideSlideMenuComponent.vue

@@ -0,0 +1,133 @@
+<style type="text/css" scoped>
+	.slide-container {
+		position: fixed;
+		top: 0;
+		left: 0;
+		right: 55%;
+		bottom: 0;
+		z-index: 400;
+		overflow: hidden;
+		height: 100%;
+	}
+	.slide-content {
+		box-sizing: border-box;
+		/*padding: 1em 1.5em;*/
+		height: calc(100% - 43px);
+		border-right: 1px solid var(--menu-border);
+		background-color: var(--background_color);
+		overflow-x: scroll;
+	}
+	.slide-shadow {
+		position: fixed;
+		top: 0;
+		left: 0;
+		right: 50%;
+		bottom: 0;
+		color: red;
+		background-color: rgba(0,0,0,0.5);
+		/*background: linear-gradient(90deg, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0) 55%);*/
+		z-index: 399;
+		overflow: hidden;
+		cursor: pointer;
+	}
+	.note-menu {
+		height: 43px;
+	}
+
+
+	@media only screen and (max-width: 740px) {
+		.slide-shadow {
+			background-color: rgba(0,0,0,0.5);
+		}
+		.slide-content {
+			height: calc(100% - 55px);
+		}
+		.slide-container {
+			left: 0;
+			right: 0;
+			top: 0;
+			bottom: 0;
+		}
+		.note-menu {
+			height: 55px;
+			padding: 0 30px;
+		}
+
+	}
+
+	.modal-fade-enter,
+	.modal-fade-leave-active {
+		opacity: 0;
+	}
+
+	.modal-fade-enter-active,
+	.modal-fade-leave-active {
+		transition: opacity .5s ease;
+	}
+
+</style>
+
+<template>
+	<transition name="modal-fade">
+		<div>
+
+			<div class="slide-container">
+
+				<!-- content of the editor  -->
+				<div class="slide-content">
+					<slot></slot>
+				</div>
+
+				<!-- close menu on bottom  -->
+				<div class="note-menu">
+					<nm-button more-class="right" icon="close" text="close" :show-text="true" v-on:click.native="close" />
+				</div>
+
+			</div>
+			
+			<div class="slide-shadow" v-on:click="close"></div>
+			
+		</div>
+	</transition>
+</template>
+
+<script>
+	export default {
+		name: 'SideSlideMenu',
+		props: [ 'name' ],
+		components: {
+			'nm-button':require('@/components/NoteMenuButtonComponent.vue').default
+		},
+		data () {
+			return {
+				items: []
+			}
+		},
+		beforeMount(){
+			
+			//Other panels will tell this one to close
+			this.$bus.$on('destroy_all_other_side_panels', (name) => {
+				if(this.name != name){
+					this.close()
+				}
+			})
+		},
+		beforeDestroy(){
+		},
+		mounted(){
+			
+			//Close all other panels that are not this one
+			this.$nextTick( () => {
+				this.$bus.$emit('destroy_all_other_side_panels', this.name)
+			})
+		},
+		methods: {
+			onClickTag(index){
+				console.log('yup')
+			},
+			close() {
+				this.$emit('close');
+			},
+		}
+	}
+</script>