Floating files header

Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>

apps/files/css/files.scss

@@ -55,12 +55,28 @@
 	position: relative;
 	width: 100%;
 	min-width: 250px;
+	display: flex;
+	flex-direction: column;
 	// hide table if emptycontent is not hidden
 	#emptycontent:not(.hidden) ~ & {
 		display: none;
 	}
 }
 
+@media only screen and (min-width: $breakpoint-mobile + 1) {
+	#filestable {
+		// floating header
+		thead {
+			position: sticky;
+			// header + breadcrumbs
+			top: $header-height + 44px;
+			z-index: 1000;
+			display: block;
+			background-color: var(--color-main-background-translucent);
+		}
+	}
+}
+
 /* fit app list view heights */
 .app-files #app-content>.viewcontainer {
 	min-height: 0%;

apps/files/js/filelist.js

@@ -652,8 +652,6 @@
 			});
 
 			this.breadcrumb._resize();
-
-			this.$table.find('>thead').width($('#app-content').width() - OC.Util.getScrollBarWidth());
 		},
 
 		/**