From f725eea1e5549f2073a8eedaad7d7e13d8ebc926 Mon Sep 17 00:00:00 2001
From: Jackson Harper <jacksonh@gmail.com>
Date: Fri, 3 Mar 2023 14:23:15 +0800
Subject: [PATCH] Borders on list view

---
 .../patterns/LibraryCards/LibraryListCard.tsx | 23 +++++--------------
 .../templates/homeFeed/HomeFeedContainer.tsx  |  4 ++++
 .../web/components/tokens/stitches.config.ts  |  1 +
 3 files changed, 11 insertions(+), 17 deletions(-)

diff --git a/packages/web/components/patterns/LibraryCards/LibraryListCard.tsx b/packages/web/components/patterns/LibraryCards/LibraryListCard.tsx
index e1e68909c..af9363975 100644
--- a/packages/web/components/patterns/LibraryCards/LibraryListCard.tsx
+++ b/packages/web/components/patterns/LibraryCards/LibraryListCard.tsx
@@ -57,29 +57,18 @@ export function LibraryListCard(props: LinkedItemCardProps): JSX.Element {
     <VStack
       css={{
         p: '20px',
-        // padding: '15px',
         width: '100%',
         height: '100%',
-        // minHeight: '270px',
-        // background: 'white',
-        // borderWidth: '1px',
-        // borderStyle: 'solid',
-        // borderColor: '#E1E1E1',
         cursor: 'pointer',
         gap: '10px',
-
-        // p: '20px',
-        // height: '100%',
-        // width: '100%',
-        // maxWidth: '100%',
-        // borderRadius: 0,
-        // wordBreak: 'break-word',
         border: '1px solid $grayBorder',
         borderBottom: 'none',
-        // alignItems: 'center',
-        // display: 'grid',
-        // gridTemplateColumns: '1fr 24px',
-        // gridTemplateRows: '1fr',
+
+        '@xlgDown': {
+          borderRadius: 'unset',
+          borderLeft: 'unset',
+          borderRight: 'unset',
+        },
       }}
       alignment="start"
       distribution="start"
diff --git a/packages/web/components/templates/homeFeed/HomeFeedContainer.tsx b/packages/web/components/templates/homeFeed/HomeFeedContainer.tsx
index 85f1b2d55..6ef8d9de7 100644
--- a/packages/web/components/templates/homeFeed/HomeFeedContainer.tsx
+++ b/packages/web/components/templates/homeFeed/HomeFeedContainer.tsx
@@ -865,6 +865,10 @@ function HomeFeedGrid(props: HomeFeedContentProps): JSX.Element {
                       paddingTop: layout == 'LIST_LAYOUT' ? '0' : '21px',
                       paddingBottom: layout == 'LIST_LAYOUT' ? '0px' : '21px',
                       overflow: 'hidden',
+                      '@xlgDown': {
+                        border: 'unset',
+                        borderRadius: layout == 'LIST_LAYOUT' ? 0 : undefined,
+                      },
                       '@smDown': {
                         border: 'unset',
                         width: layout == 'LIST_LAYOUT' ? '100vw' : undefined,
diff --git a/packages/web/components/tokens/stitches.config.ts b/packages/web/components/tokens/stitches.config.ts
index 88ffc9ccf..01e4018f8 100644
--- a/packages/web/components/tokens/stitches.config.ts
+++ b/packages/web/components/tokens/stitches.config.ts
@@ -195,6 +195,7 @@ export const { styled, css, theme, getCssText, globalCss, keyframes, config } =
       smDown: '(max-width: 575px)',
       mdDown: '(max-width: 768px)',
       lgDown: '(max-width: 992px)',
+      xlgDown: '(max-width: 1200px)',
       sm: '(min-width: 576px)',
       md: '(min-width: 768px)',
       lg: '(min-width: 992px)',