65 lines
2.8 KiB
JavaScript
65 lines
2.8 KiB
JavaScript
import React from 'react'
|
|
import CountUp, { useCountUp } from 'react-countup';
|
|
import VideoModal from '../ModalVideo/VideoModal';
|
|
import fImg from '/public/images/funfact2.jpg'
|
|
import Image from 'next/image';
|
|
|
|
const FunFact = (props) => {
|
|
|
|
useCountUp({
|
|
ref: 'counter',
|
|
end: 1234567,
|
|
enableScrollSpy: true,
|
|
scrollSpyDelay: 1000,
|
|
});
|
|
|
|
return (
|
|
<div className={props.fnTpClass}>
|
|
<section className={`wpo-fun-fact-section-s2 content ${props.fnClass}`}>
|
|
<div className="container">
|
|
<div className="row">
|
|
<div className="col col-lg-12">
|
|
<div className="wpo-fun-fact-wrap">
|
|
<div className="wpo-fun-fact-grids clearfix">
|
|
<div className="grid">
|
|
<div className="info">
|
|
<h3><span><CountUp end={98} enableScrollSpy /></span>%</h3>
|
|
<p>Case Success Rate</p>
|
|
</div>
|
|
</div>
|
|
<div className="grid">
|
|
<div className="info">
|
|
<h3><span><CountUp end={2500} enableScrollSpy /></span>+</h3>
|
|
<p> Families Reunited</p>
|
|
</div>
|
|
</div>
|
|
<div className="grid">
|
|
<div className="info">
|
|
<h3><span><CountUp end={25} enableScrollSpy /></span>yrs</h3>
|
|
<p>Years Fighting for You</p>
|
|
</div>
|
|
</div>
|
|
<div className="grid">
|
|
<div className="info">
|
|
<h3><span><CountUp end={90} enableScrollSpy /></span>%</h3>
|
|
<p>Cases Approved on First Try</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<div className="funfact-video">
|
|
<div className="container">
|
|
<Image src={fImg} alt="" />
|
|
<VideoModal />
|
|
</div>
|
|
</div>
|
|
<span id="counter" className='d-none' />
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default FunFact; |