feat: add sticky headers

ICIJ · Oct 23, 2024 · 03a1336 · 03a1336
1 parent 2cafc85
commit 03a1336
Show file tree

Hide file tree

Showing 2 changed files with 32 additions and 0 deletions.
diff --git a/src/components/Document/DocumentEntries/DocumentEntriesGrid.vue b/src/components/Document/DocumentEntries/DocumentEntriesGrid.vue
@@ -28,3 +28,19 @@ defineProps({
     </div>
   </div>
 </template>
+
+<style lang="scss" scoped>
+.document-entries-grid {
+  position: relative;
+
+  &__header {
+    background: var(--bs-body-bg);
+    position: sticky;
+    top: 0;
+    z-index: 10;
+    min-width: 0;
+    max-width: 100%;
+    width: 100%;
+  }
+}
+</style>
diff --git a/src/components/Document/DocumentEntries/DocumentEntriesTable.vue b/src/components/Document/DocumentEntries/DocumentEntriesTable.vue
@@ -62,3 +62,19 @@ const sortedProperties = computed(() => {
     </page-table>
   </div>
 </template>
+
+<style lang="scss" scoped>
+.document-entries-table {
+  position: relative;
+
+  &__header {
+    background: var(--bs-body-bg);
+    position: sticky;
+    top: 0;
+    z-index: 10;
+    min-width: 0;
+    max-width: 100%;
+    width: 100%;
+  }
+}
+</style>