Merge pull request #563 from semaphore-protocol/chore/carousel-card-b…

…orders Add borders to carousel item cards
semaphore-protocol · Jan 16, 2024 · 0602554 · 0602554
2 parents 0f0df55 + 7ce4a63
commit 0602554
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 2 deletions.
diff --git a/apps/website/src/components/ArticleCard.tsx b/apps/website/src/components/ArticleCard.tsx
@@ -15,9 +15,11 @@ export default function ArticleCard({ title, minRead, url }: ArticleCardProps) {
                 color="white"
                 padding="24px 20px"
                 width={{ base: "full", sm: "297.5px" }}
-                _hover={{ bgColor: "darkBlueBg" }}
                 h="full"
                 variant="unstyled"
+                borderWidth="1px"
+                borderColor="text.900"
+                _hover={{ bgColor: "darkBlueBg", borderColor: "transparent" }}
             >
                 <CardBody padding="0">
                     <Heading fontSize="20px" lineHeight="28px">

diff --git a/apps/website/src/components/VideoCard.tsx b/apps/website/src/components/VideoCard.tsx
@@ -14,8 +14,10 @@ export default function VideoCard({ thumbnail, url, title }: VideoCardProps) {
                 borderRadius="10px"
                 color="white"
                 h="full"
-                _hover={{ bgColor: "darkBlueBg" }}
                 variant="unstyled"
+                borderWidth="1px"
+                borderColor="text.900"
+                _hover={{ bgColor: "darkBlueBg", borderColor: "transparent" }}
             >
                 <HStack>
                     <AspectRatio borderRadius="10px 10px 0px 0px" width="297px" height="215px" overflow="hidden">