fix(PageList): Make header, landing page and trash sticky again

Fixes: #1523 Signed-off-by: Jonas <jonas@freesources.org>
nextcloud · Oct 22, 2024 · d0c1136 · d0c1136
1 parent 8031d84
commit d0c1136
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 2 deletions.
diff --git a/src/components/PageList.vue b/src/components/PageList.vue
@@ -432,11 +432,14 @@ export default {
 
 .app-content-list {
 	// nextcloud-vue component sets `max-height: unset` on mobile.
-	// Overwrite this to fix stickyness of header and rootpage.
+	// Overwrite this to fix stickiness of header and rootpage.
 	max-height: 100%;
 }
 
 .page-list-headerbar {
+	position: sticky;
+	top: 0;
+	z-index: 2;
 	display: flex;
 	flex-direction: row;
 	gap: 2px;
@@ -479,7 +482,7 @@ li.toggle-button.selected {
 
 .page-list-root-page {
 	position: sticky;
-	top: 0;
+	top: var(--page-list-header-height);
 	z-index: 1;
 	background-color: var(--color-main-background);
 	margin-block-end: 8px;

diff --git a/src/components/PageList/PageTrash.vue b/src/components/PageList/PageTrash.vue
@@ -209,6 +209,8 @@ export default {
 @import '../../css/animation.scss';
 
 .page-trash {
+	position: sticky;
+	bottom: 0;
 	width: 100%;
 	margin-top: auto;
 	background-color: var(--color-main-background);