Add body class when dashboard is scrolled

Signed-off-by: Julius Härtl <jus@bitgrid.net>

apps/dashboard/src/App.vue

@@ -235,6 +235,7 @@ export default {
 	},
 	mounted() {
 		this.updateGlobalStyles()
+		window.addEventListener('scroll', this.handleScroll)
 
 		setInterval(() => {
 			this.timer = new Date()
@@ -244,6 +245,9 @@ export default {
 			window.addEventListener('scroll', this.disableFirstrunHint)
 		}
 	},
+	destroyed() {
+		window.removeEventListener('scroll', this.handleScroll)
+	},
 	methods: {
 		/**
 		 * Method to register panels that will be called by the integrating apps
@@ -361,6 +365,13 @@ export default {
 			}
 			this.saveStatuses()
 		},
+		handleScroll() {
+			if (window.scrollY > 50) {
+				document.body.classList.add('dashboard--scrolled')
+			} else {
+				document.body.classList.remove('dashboard--scrolled')
+			}
+		},
 	},
 }
 </script>