change row to grid

content-samples/react/emails/notifications/novu-similar-products-recommedation.tsx

@@ -58,7 +58,7 @@ export const NovuAddToCartAlert = ({
               We've hand-picked some items we think you'll love:
             </Text>
 
-            <Section>
+            <Section style={productTable}>
               <Row style={productRow}>
                 {productList.slice(0, 2).map((product, index) => (
                   <Column key={index} style={productColumn}>
@@ -144,18 +144,25 @@ const subheading = {
   lineHeight: "26px",
   margin: "0 0 20px",
 };
+const productTable = {
+    tableLayout: 'fixed'
 
+}
 const productRow = {
-  display: 'flex',
+  display: 'grid',
   justifyContent: 'center',
   alignItems: 'flex-start',
   margin: '0 0 20px',
+  width: '100%',
+  gridTemplateColumns: 'minmax(0, 1fr) minmax(0, 1fr)'
 };
 
 const productColumn = {
   width: '50%',
   padding: '0 10px',
-  boxSizing: 'border-box' as const,
+  boxSizing: 'content-box' as const,
+  overflow: 'hidden',
+  textOverflow: 'ellipsis'
 };
 
 const imageStyle = {
@@ -232,9 +239,9 @@ NovuAddToCartAlert.PreviewProps = {
   linkToUnsubscribe: "https://google.com",
   productImage: "",
   productList: [
-    { name: "Classic White Sneakers", description: "Timeless style for everyday wear", image: "https://images.unsplash.com/photo-1549298916-b41d501d3772?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=300&q=80" },
+    { name: "Classic White Sneakers", description: "Timeless style for everyday wear just trying to add words for you ", image: "https://images.unsplash.com/photo-1549298916-b41d501d3772?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=300&q=80" },
     { name: "Leather Messenger Bag", description: "Perfect for work or casual outings", image: "https://images.unsplash.com/photo-1553062407-98eeb64c6a62?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=300&q=80" },
-    { name: "Stainless Steel Watch", description: "Elegant timepiece for any occasion", image: "https://images.unsplash.com/photo-1524592094714-0f0654e20314?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=300&q=80" },
+    { name: "Stainless Steel Watch", description: "Elegant timepiece for any", image: "https://images.unsplash.com/photo-1524592094714-0f0654e20314?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=300&q=80" },
     { name: "Polarized Sunglasses", description: "Protect your eyes in style", image: "https://images.unsplash.com/photo-1511499767150-a48a237f0083?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=300&q=80" },
   ]
 } as NovuAddToCartAlertProps;