From 87e88ef2a7ca3ff63d0b073e087022829da82fb6 Mon Sep 17 00:00:00 2001
From: Daniel Lando <daniel.sorridi@gmail.com>
Date: Mon, 23 Oct 2023 11:52:00 +0200
Subject: [PATCH] fix(ui): make topbar and actions sticky on popups

Fixes #3372
---
 src/components/Confirm.vue | 27 +++++++++++++++++++++++++--
 1 file changed, 25 insertions(+), 2 deletions(-)

diff --git a/src/components/Confirm.vue b/src/components/Confirm.vue
index 93694985036..22e41a6b082 100644
--- a/src/components/Confirm.vue
+++ b/src/components/Confirm.vue
@@ -7,7 +7,13 @@
 		:persistent="options.persistent"
 	>
 		<v-card>
-			<v-toolbar :color="options.color" dark dense flat>
+			<v-toolbar
+				class="sticky-title"
+				:color="options.color"
+				dark
+				dense
+				flat
+			>
 				<v-toolbar-title class="white--text">{{
 					title
 				}}</v-toolbar-title>
@@ -197,7 +203,7 @@
 					:rules="[validQR]"
 				></qr-reader>
 			</v-card-text>
-			<v-card-actions class="pt-0">
+			<v-card-actions class="sticky-actions pt-0">
 				<v-spacer></v-spacer>
 				<v-btn
 					v-if="!options.qrScan"
@@ -384,3 +390,20 @@ export default {
 	},
 }
 </script>
+
+<style scoped>
+.v-card::v-deep .sticky-title {
+	position: sticky;
+	top: 0;
+	z-index: 3;
+	background-color: inherit;
+	border-bottom: 1px solid var(--v-secondary-base);
+}
+
+.v-card::v-deep .sticky-actions {
+	position: sticky;
+	z-index: 3;
+	bottom: 0;
+	background-color: inherit;
+}
+</style>