From 9d5a90538a2ef0499215d46ea887e5930d76c70d Mon Sep 17 00:00:00 2001
From: Jackson Harper <jacksonh@gmail.com>
Date: Thu, 29 Feb 2024 10:38:42 +0800
Subject: [PATCH] Switch to the circle buttons

---
 packages/web/components/elements/Button.tsx   |  5 +--
 .../templates/homeFeed/TLDRLayout.tsx         | 36 +------------------
 2 files changed, 4 insertions(+), 37 deletions(-)

diff --git a/packages/web/components/elements/Button.tsx b/packages/web/components/elements/Button.tsx
index 768d7dca0..884544415 100644
--- a/packages/web/components/elements/Button.tsx
+++ b/packages/web/components/elements/Button.tsx
@@ -37,9 +37,10 @@ export const Button = styled('button', {
         gap: '10px',
         display: 'flex',
         alignItems: 'center',
-        borderRadius: '5px',
+        borderRadius: '100px',
         px: '10px',
-        py: '5px',
+        py: '10px',
+
         fontFamily: '$inter',
         fontSize: '12px',
         fontWeight: '500',
diff --git a/packages/web/components/templates/homeFeed/TLDRLayout.tsx b/packages/web/components/templates/homeFeed/TLDRLayout.tsx
index d95c45bc6..c8fbb1dd2 100644
--- a/packages/web/components/templates/homeFeed/TLDRLayout.tsx
+++ b/packages/web/components/templates/homeFeed/TLDRLayout.tsx
@@ -62,38 +62,7 @@ export function TLDRLayout(props: TLDRLayoutProps): JSX.Element {
                 <input type="checkbox" />
               </SpanBox>
 
-              <VStack
-                alignment="start"
-                css={
-                  {
-                    // px: '60px',
-                    // pl: '10px',
-                    // py: '15px',
-                    // gap: '15px',
-                    // height: '100%',
-                    // color: '#EDEDED',
-                    // borderStyle: 'none',
-                    // borderBottom: 'none',
-                    // borderRadius: '6px',
-                    // '@media (min-width: 768px)': {
-                    //   width: `calc(100vw - ${LIBRARY_LEFT_MENU_WIDTH})`,
-                    // },
-                    // '@media (min-width: 930px)': {
-                    //   width: '580px',
-                    // },
-                    // '@media (min-width: 1280px)': {
-                    //   width: '890px',
-                    // },
-                    // '@media (min-width: 1600px)': {
-                    //   width: '1200px',
-                    // },
-                    // '@media (max-width: 930px)': {
-                    //   borderRadius: '0px',
-                    // },
-                  }
-                }
-                distribution="start"
-              >
+              <VStack alignment="start" distribution="start">
                 <SpanBox
                   css={{
                     fontFamily: '$inter',
@@ -118,15 +87,12 @@ export function TLDRLayout(props: TLDRLayoutProps): JSX.Element {
                 <HStack css={{ gap: '15px', pt: '5px' }}>
                   <Button style="tldr">
                     <ArchiveIcon size={20} color="#EDEDED" />
-                    Archive
                   </Button>
                   <Button style="tldr">
                     <TrashIcon size={20} color="#EDEDED" />
-                    Remove
                   </Button>
                   <Button style="tldr">
                     <BrowserIcon size={20} color="#EDEDED" />
-                    Open original
                   </Button>
                 </HStack>
               </VStack>