From cfe8235cbb81ab352cfdf37c8f21769947a52acb Mon Sep 17 00:00:00 2001
From: Adam Antal <adoantal@gmail.com>
Date: Thu, 7 Dec 2023 11:47:27 +0100
Subject: [PATCH] Add a keyboard listener to stackable fees card to improve
 accessibility

---
 src/apps/fee-list/stackable-fees/stackable-fees.tsx | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/apps/fee-list/stackable-fees/stackable-fees.tsx b/src/apps/fee-list/stackable-fees/stackable-fees.tsx
index 137923c47a..558545c9ec 100644
--- a/src/apps/fee-list/stackable-fees/stackable-fees.tsx
+++ b/src/apps/fee-list/stackable-fees/stackable-fees.tsx
@@ -31,12 +31,17 @@ const StackableFees: FC<StackableFeeProps & MaterialProps> = ({
   const { amount = 0, creationDate = "", reasonMessage = "" } = feeData;
   const stackSize = amountOfMaterialsWithDueDate - 1;
   const listReservationClass = clsx(["list-reservation", "my-32"], {
-    "list-reservation--stacked": stackSize > 1
+    "list-reservation--stacked": stackSize > 0
   });
   return (
     <button
       type="button"
       onClick={() => openDetailsModalClickEvent(faust)}
+      onKeyUp={(e) => {
+        if (e.key === "Enter" || e.key === "Space") {
+          openDetailsModalClickEvent(faust);
+        }
+      }}
       className={listReservationClass}
     >
       {feeData && (