Truncate notes in search (#28)

EddieAbbondanzio · Dec 26, 2022 · 593a79e · 593a79e
1 parent b080811
commit 593a79e
Showing 1 changed file with 8 additions and 1 deletion.
diff --git a/src/renderer/components/SidebarSearch.tsx b/src/renderer/components/SidebarSearch.tsx
@@ -74,7 +74,7 @@ export function SidebarSearch(props: SidebarSearchProps): JSX.Element {
           })
         }
       >
-        {n.name}
+        <TruncatedText>{n.name}</TruncatedText>
       </SearchResult>
     );
   });
@@ -195,6 +195,7 @@ const SearchResult = styled.div<{ selected: boolean }>`
   align-items: center;
   font-size: 1.4rem;
   ${px3}
+  min-width: 0;
 
   background-color: ${p =>
     p.selected ? THEME.sidebar.search.selectedResult : ""} !important;
@@ -204,6 +205,12 @@ const SearchResult = styled.div<{ selected: boolean }>`
   }
 `;
 
+const TruncatedText = styled.div`
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+`;
+
 export function searchNotes(notes: Note[], searchString?: string): Note[] {
   // Don't bother searching if string is empty or just whitespace
   if (isBlank(searchString)) {