📄 Add Commercial License for ee folder (#1532)

ee/apps/landing-page/components/Homepage/Features/FeatureCard.tsx

@@ -0,0 +1,46 @@
+import { IconProps, Text, Flex, VStack } from '@chakra-ui/react'
+import React, { useState } from 'react'
+
+type FeatureCardProps = {
+  Icon: (props: IconProps) => JSX.Element
+  title: string
+  content: string
+}
+
+export const FeatureCard = ({ Icon, title, content }: FeatureCardProps) => {
+  const [isHovered, setIsHovered] = useState(false)
+
+  return (
+    <VStack
+      p="6"
+      bgColor="gray.800"
+      pos="relative"
+      rounded="lg"
+      spacing="4"
+      onMouseEnter={() => setIsHovered(true)}
+      onMouseLeave={() => setIsHovered(false)}
+    >
+      <Flex
+        boxSize="50px"
+        bgColor="blue.500"
+        rounded="lg"
+        color="white"
+        justify="center"
+        align="center"
+        pos="absolute"
+        top="-25px"
+        shadow="lg"
+        transform={isHovered ? 'translateY(-5px)' : 'translateY(0px)'}
+        transition="transform 300ms ease-out"
+      >
+        <Icon boxSize="25px" />
+      </Flex>
+      <Text textAlign="center" fontWeight="semibold" fontSize="lg">
+        {title}
+      </Text>
+      <Text textAlign="center" color="gray.500">
+        {content}
+      </Text>
+    </VStack>
+  )
+}