Fix inbox notification truncation (#1513)

Resolves #1444
aeharding · Jun 6, 2024 · 5339b83 · 5339b83
1 parent 7691a70
commit 5339b83
Showing 1 changed file with 12 additions and 2 deletions.
diff --git a/src/features/inbox/InboxItem.tsx b/src/features/inbox/InboxItem.tsx
@@ -30,10 +30,14 @@ import { filterEvents } from "../../helpers/longPress";
 import { stopIonicTapClick } from "../../helpers/ionic";
 
 const labelStyles = css`
+  display: inline-flex;
+  max-width: 100%;
+
   font-weight: 500;
 
   a {
-    display: inline-flex; // kinda brittle way to ensure it stays inline
+    overflow: hidden;
+    text-overflow: ellipsis;
   }
 `;
 
@@ -101,6 +105,7 @@ const TypeIcon = styled(IonIcon)`
 
 const Content = styled.div`
   flex: 1;
+  min-width: 0;
 `;
 
 const Header = styled.div``;
@@ -112,10 +117,15 @@ const Body = styled.div`
 const Footer = styled.div`
   display: flex;
   align-items: center;
+  justify-content: space-between;
 
   color: var(--ion-color-medium);
 
-  aside {
+  > div {
+    min-width: 0;
+  }
+
+  > aside {
     margin-left: auto;
 
     display: flex;