From 1bda035890108f51ae4c553f32b62ad5db4307c2 Mon Sep 17 00:00:00 2001
From: Jackson Harper <jacksonh@gmail.com>
Date: Thu, 5 May 2022 14:44:45 -0700
Subject: [PATCH] Make the highlight cards work a little better in list mode

---
 .../patterns/LibraryCards/HighlightItemCard.tsx       | 11 +++++------
 1 file changed, 5 insertions(+), 6 deletions(-)

diff --git a/packages/web/components/patterns/LibraryCards/HighlightItemCard.tsx b/packages/web/components/patterns/LibraryCards/HighlightItemCard.tsx
index f3f685ab7..d493d8fd6 100644
--- a/packages/web/components/patterns/LibraryCards/HighlightItemCard.tsx
+++ b/packages/web/components/patterns/LibraryCards/HighlightItemCard.tsx
@@ -19,12 +19,13 @@ export function HighlightItemCard(props: HighlightItemCardProps): JSX.Element {
       css={{
         p: '$2',
         height: '100%',
-        maxWidth: '498px',
-        borderRadius: '6px',
+        width: '100%',
+        borderRadius: '0px',
         cursor: 'pointer',
         wordBreak: 'break-word',
         overflow: 'clip',
         border: '1px solid $grayBorder',
+        borderBottom: 'none',
         boxShadow: '0px 3px 11px rgba(32, 31, 29, 0.04)',
         bg: '$grayBg',
         '&:focus': {
@@ -49,6 +50,7 @@ export function HighlightItemCard(props: HighlightItemCardProps): JSX.Element {
           css={{
             background: '$highlightBackground',
             color: '$highlightText',
+            fontSize: '14px',
           }}
         >
           {props.item.quote}
@@ -75,13 +77,10 @@ export function HighlightItemCard(props: HighlightItemCardProps): JSX.Element {
         )}
         <StyledText
           css={{
-            marginLeft: '$2',
             fontWeight: '700',
           }}
         >
-          {props.item.title
-            .substring(0, 50)
-            .concat(props.item.title.length > 50 ? '...' : '')}
+          {props.item.title}
         </StyledText>
       </HStack>
     </VStack>