-
Notifications
You must be signed in to change notification settings - Fork 10
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Revert "Finish landing animations (#535)"
This reverts commit e2e94be.
- Loading branch information
Showing
26 changed files
with
151 additions
and
326 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,75 +1,41 @@ | ||
| import React, { forwardRef } from 'react'; | ||
| import { motion } from 'framer-motion'; | ||
| import Marquee from 'react-fast-marquee'; | ||
| import { Link } from '@app/components/Link'; | ||
| import { useHomePage } from '@app/hooks/useHomePage'; | ||
| import { | ||
| createBemBlockBuilder, | ||
| defaultSpringTransition, | ||
| DOCUMENTATION_URL, | ||
| easeInOutTransition, | ||
| opacityScaleAnimationProps, | ||
| PropsWithAnimation, | ||
| } from '@app/utils'; | ||
| import { AnimatedHeader } from '@app/components/AnimatedHeader'; | ||
| import { useInView } from '@app/hooks/useInView'; | ||
| import { useMotionEnterAnimation } from '@app/hooks/useMotionEnterAnimation'; | ||
| import { createBemBlockBuilder, DOCUMENTATION_URL } from '@app/utils'; | ||
|
|
||
| import './ProcessIntegration.scss'; | ||
|
|
||
| const getBlocksWith = createBemBlockBuilder(['process-integration']); | ||
|
|
||
| export const ProcessIntegration = forwardRef<HTMLDivElement, PropsWithAnimation>( | ||
| ({ isAnimationEnabled = false }, ref) => { | ||
| const { integrations } = useHomePage(); | ||
| const [containerRef, isInView] = useInView(); | ||
| export const ProcessIntegration = forwardRef((props, ref) => { | ||
| const { integrations } = useHomePage(); | ||
|
|
||
| const getButtonAnimation = useMotionEnterAnimation( | ||
| { | ||
| ...opacityScaleAnimationProps, | ||
| ...easeInOutTransition, | ||
| }, | ||
| isAnimationEnabled, | ||
| ); | ||
|
|
||
| return ( | ||
| <section className={getBlocksWith()} ref={ref}> | ||
| <div className="container" ref={containerRef}> | ||
| <AnimatedHeader | ||
| isAnimationEnabled={isAnimationEnabled} | ||
| transition={defaultSpringTransition} | ||
| > | ||
| Integrate with your existing test automation process | ||
| </AnimatedHeader> | ||
| <AnimatedHeader isAnimationEnabled={isAnimationEnabled} headerLevel={3} delay={0.1}> | ||
| Integrate ReportPortal with frameworks, bug tracking systems, infrastructure providers | ||
| you already use and others so as to streamline the development and testing processes | ||
| </AnimatedHeader> | ||
| <motion.div | ||
| className={getBlocksWith('__link-container')} | ||
| {...getButtonAnimation({ isInView, delay: 0.1 })} | ||
| > | ||
| <Link className="btn btn--outline btn--large" to={`${DOCUMENTATION_URL}/plugins/`}> | ||
| See all integrations | ||
| </Link> | ||
| </motion.div> | ||
| </div> | ||
| <div className={getBlocksWith('__carousel')}> | ||
| <Marquee | ||
| className={getBlocksWith('__carousel-marquee')} | ||
| speed={25} | ||
| gradientWidth="19.27%" | ||
| > | ||
| {[integrations, integrations].flat().map((slide, index) => ( | ||
| <div className={getBlocksWith('__carousel-logo')} key={index}> | ||
| <img src={slide.icon.url} alt={slide.alt} /> | ||
| </div> | ||
| ))} | ||
| </Marquee> | ||
| return ( | ||
| <section className={getBlocksWith()} ref={ref}> | ||
| <div className="container"> | ||
| <h2>Integrate with your existing test automation process</h2> | ||
| <h3> | ||
| Integrate ReportPortal with frameworks, bug tracking systems, infrastructure providers you | ||
| already use and others so as to streamline the development and testing processes | ||
| </h3> | ||
| <div className={getBlocksWith('__link-container')}> | ||
| <Link className="btn btn--outline btn--large" to={`${DOCUMENTATION_URL}/plugins/`}> | ||
| See all integrations | ||
| </Link> | ||
| </div> | ||
| </section> | ||
| ); | ||
| }, | ||
| ); | ||
| </div> | ||
| <div className={getBlocksWith('__carousel')}> | ||
| <Marquee className={getBlocksWith('__carousel-marquee')} speed={25} gradientWidth="19.27%"> | ||
| {[integrations, integrations].flat().map((slide, index) => ( | ||
| <div className={getBlocksWith('__carousel-logo')} key={index}> | ||
| <img src={slide.icon.url} alt={slide.alt} /> | ||
| </div> | ||
| ))} | ||
| </Marquee> | ||
| </div> | ||
| </section> | ||
| ); | ||
| }); | ||
|
|
||
| ProcessIntegration.displayName = 'ProcessIntegration'; |
Oops, something went wrong.