39 lines
1.1 KiB
JavaScript
39 lines
1.1 KiB
JavaScript
import React from 'react';
|
|
import { motion } from 'framer-motion';
|
|
import { cloudConfig } from './config';
|
|
import { useInViewAnimation } from './hooks/useInViewAnimation';
|
|
import { containerVariants } from './utils/variants';
|
|
import CTAContent from './components/CTAContent';
|
|
import CTAButton from './components/CTAButton';
|
|
import styles from './styles/CloudCTA.module.css';
|
|
|
|
const CloudCTA = () => {
|
|
const { ref, controls } = useInViewAnimation();
|
|
|
|
return (
|
|
<section
|
|
className={styles.container}
|
|
aria-labelledby="cta-heading"
|
|
>
|
|
<div className={styles.wrapper}>
|
|
<motion.div
|
|
ref={ref}
|
|
variants={containerVariants}
|
|
initial="hidden"
|
|
animate={controls}
|
|
className={styles.content}
|
|
>
|
|
<CTAContent
|
|
heading={cloudConfig.heading}
|
|
description={cloudConfig.description}
|
|
image={cloudConfig.images.arrow}
|
|
/>
|
|
|
|
<CTAButton text={cloudConfig.button.text} />
|
|
</motion.div>
|
|
</div>
|
|
</section>
|
|
);
|
|
};
|
|
|
|
export default CloudCTA; |