* Added theme colors to form fields

* Added some basic table styles for inserting some shitty tables
* Made popup notification styles look better and work better on mobile
* Quick note now opens a note and not some weird page
* Menu collapses when page is small, behaves like mobile menu
* Added terms and conditions to help and login forms
* Added password change functionality
* Better styles for shared page
* Added some tests for changing password

client/src/components/GlobalSiteMenu.vue

@@ -133,9 +133,23 @@
 
 			<div class="mobile-button"></div>
 
-			<router-link v-if="loggedIn" to="/quick" class="mobile-button" exact-active-class="active">
+			<!-- open straight to note -->
+			<router-link 
+				v-if="loggedIn && $store.getters.totals && $store.getters.totals['quickNote']" 
+				exact-active-class="active" 
+				class="mobile-button"
+				:to="`/notes/open/${$store.getters.totals['quickNote']}`">
 				<i class="green sticky note outline icon"></i>
 			</router-link>
+			
+			<!-- create new and redirect to new note id -->
+			<a 
+				v-if="loggedIn && $store.getters.totals && !$store.getters.totals['quickNote']" 
+				v-on:click="newQuickNote()"
+				exact-active-class="active" 
+				class="mobile-button">
+				<i class="green sticky note outline icon"></i>
+			</a>
 
 			<router-link v-if="loggedIn" class="mobile-button" exact-active-class="active" to="/notes" v-on:click.native="emitReloadEvent()">
 				<logo class="logo-display" color="var(--main-accent)" />
@@ -167,10 +181,8 @@
 		<div class="global-menu" v-if="!collapsed" v-on:click="menuClicked">
 
 			<div class="menu-section" v-on:click="collapseMenu">
-				<!-- <div class="menu-item menu-button" > -->
-					<i class="white angle left icon"></i>
-					<logo class="menu-logo-display" color="var(--main-accent)" />
-				<!-- </div> -->
+				<i class="white angle left icon"></i>
+				<logo class="menu-logo-display" color="var(--main-accent)" />
 			</div>
 
 			<div class="menu-section" v-if="loggedIn">
@@ -216,9 +228,26 @@
 			</div>
 
 			<div class="menu-section" v-if="loggedIn">
-				<router-link v-if="loggedIn" exact-active-class="active" class="menu-item menu-button" to="/quick">
+
+				
+				<!-- open straight to note -->
+				<router-link 
+					v-if="loggedIn && $store.getters.totals && $store.getters.totals['quickNote']" 
+					exact-active-class="active" 
+					class="menu-item menu-button" 
+					:to="`/notes/open/${$store.getters.totals['quickNote']}`">
 					<i class="sticky note outline icon"></i>Scratch Pad
 				</router-link>
+				
+				<!-- create new and redirect to new note id -->
+				<a 
+					v-if="loggedIn && $store.getters.totals && !$store.getters.totals['quickNote']" 
+					v-on:click="newQuickNote()"
+					exact-active-class="active" 
+					class="menu-item menu-button">
+					<i class="sticky note outline icon"></i>Scratch Pad
+				</a>
+
 			</div>
 
 			<div class="menu-section" v-if="!loggedIn">
@@ -244,7 +273,7 @@
 
 			<div class="menu-section">
 				<router-link class="menu-item menu-button" exact-active-class="active" to="/help">
-					<i class="question circle outline icon"></i>Help / Terms
+					<i class="question circle outline icon"></i>Help | Terms
 				</router-link>
 			</div>
 
@@ -304,6 +333,8 @@
 				this.$store.dispatch('fetchAndUpdateUserTotals')
 				this.version = localStorage.getItem('currentVersion')
 			}
+
+			this.resizeEventHandler() //Trigger resize event 
 			
 		},
 		computed: {
@@ -329,16 +360,29 @@
 			},
 		},
 		methods: {
+			newQuickNote(){
+
+				axios.post('/api/quick-note/get')
+				.then( ({data}) => {
+
+					console.log(data)
+					this.$router.push({'path':'/notes/open/'+data.noteId})
+				})
+
+			},
 			resizeEventHandler(e) {
 				clearTimeout(this.resizeDebounce)
 				this.resizeDebounce = setTimeout(() => {
 
+					this.mobile = false
 					this.menuOpen = false
 					this.collapsed = false
 
 					if(window.innerWidth < 700){
 
 						this.collapsed = true
+						this.mobile = true
+
 					} 
 				}, 100)
 			},