📄 Add Commercial License for ee folder (#1532)

ee/apps/landing-page/components/Homepage/EasyEmbed.tsx

@@ -0,0 +1,65 @@
+import { Flex, Stack, Heading, Box, Text, Button } from '@chakra-ui/react'
+import React from 'react'
+import Image from 'next/image'
+import nativeFeelingSrc from 'public/images/native-feeling.png'
+import { ArrowRight } from 'assets/icons/ArrowRight'
+import { Flare } from 'assets/illustrations/Flare'
+import Link from 'next/link'
+
+export const EasyEmbed = () => {
+  return (
+    <Flex as="section" justify="center" pos="relative">
+      <Flare
+        color="orange"
+        pos="absolute"
+        right="-200px"
+        top="100px"
+        data-aos="fade"
+        data-aos-delay="500"
+      />
+      <Stack
+        style={{ maxWidth: '1000px' }}
+        pt={32}
+        w="full"
+        px="4"
+        spacing={12}
+        direction={['column', 'row']}
+        justifyContent="space-between"
+        alignItems="center"
+      >
+        <Stack spacing="6" maxW="300px" minW={[0, '300px']}>
+          <Heading as="h1" data-aos="fade">
+            Embed it in a click
+          </Heading>
+          <Text
+            color="gray.400"
+            fontSize={{ base: 'lg', xl: 'xl' }}
+            data-aos="fade"
+          >
+            Embedding your typebot in your applications is a walk in the park.
+            Typebot gives you several step-by-step platform-specific
+            instructions. Your typebot will always feel &quot;native&quot;.
+          </Text>
+          <Flex data-aos="fade">
+            <Button
+              as={Link}
+              rightIcon={<ArrowRight />}
+              href={`https://app.typebot.io/register`}
+              variant="ghost"
+              colorScheme="orange"
+            >
+              Try it now
+            </Button>
+          </Flex>
+        </Stack>
+        <Box rounded="md" data-aos="fade">
+          <Image
+            src={nativeFeelingSrc}
+            alt="incomplete results illustration"
+            placeholder="blur"
+          />
+        </Box>
+      </Stack>
+    </Flex>
+  )
+}