blsmedia/bot
2
0
Fork 0
Code Activity

docs(lp): 💄 Add animation on scroll

Browse Source
This commit is contained in:
Baptiste Arnaud
2022-03-17 14:37:00 +01:00
parent 21e926a477
commit 37b7ca32e9
15 changed files with 178 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
apps/landing-page/components/Homepage/EasyEmbed.tsx
View File

@ -9,7 +9,14 @@ import { Flare } from 'assets/illustrations/Flare'
export const EasyEmbed = () => {
return (
<Flex as="section" justify="center" pos="relative">
<Flare color="orange" pos="absolute" right="-200px" top="100px" />
<Flare
color="orange"
pos="absolute"
right="-200px"
top="100px"
data-aos="fade"
data-aos-delay="500"
/>
<Stack
style={{ maxWidth: '1000px' }}
pt={32}
@ -21,13 +28,19 @@ export const EasyEmbed = () => {
alignItems="center"
>
<Stack spacing="6" maxW="300px">
<Heading as="h1">Embed it in a click</Heading>
<Text color="gray.400" fontSize={{ base: 'lg', xl: 'xl' }}>
<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 "native".
</Text>
<Flex>
<Flex data-aos="fade">
<Button
as={NextChakraLink}
rightIcon={<ArrowRight />}
@ -39,7 +52,7 @@ export const EasyEmbed = () => {
</Button>
</Flex>
</Stack>
<Box rounded="md">
<Box rounded="md" data-aos="fade">
<Image
src={nativeFeelingSrc}
alt="incomplete results illustration"