Ви не можете вибрати більше 25 тем Теми мають розпочинатися з літери або цифри, можуть містити дефіси (-) і не повинні перевищувати 35 символів.

50 рядки
2.4 KiB

  1. import React from 'react';
  2. import dynamic from 'next/dynamic';
  3. const OwlCarousel = dynamic(import('react-owl-carousel3'));
  4. const options = {
  5. loop: false,
  6. nav: false,
  7. smartSpeed: 1000,
  8. autoplayTimeout: 5000,
  9. dots: true,
  10. autoplayHoverPause: true,
  11. autoplay: true,
  12. items: 1,
  13. };
  14. const FeedbackStyleFive = () => {
  15. const [display, setDisplay] = React.useState(false);
  16. React.useEffect(() => {
  17. setDisplay(true);
  18. }, [])
  19. return (
  20. <div className="agency-portfolio-feedback-area ptb-80">
  21. <div className="container">
  22. {display ? <OwlCarousel
  23. className="agency-portfolio-feedback-slides owl-carousel owl-theme"
  24. {...options}
  25. >
  26. <div className="agency-portfolio-feedback-item">
  27. <img src="/images/client-image/client1.jpg" alt="image" />
  28. <p>Pellentesque sed purus eu urna vulputate interdum quis sit amet sapien. Pellentesque porta mauris at orci sagittis commodo. Curabitur aliquam nibh odio, vel ornare nisl volutpat quis. Maecenas congue dapibus lacus id fringilla. Vestibulum id augue massa. Proin sed neque dapibus, vulputate ligula eget, aliquam eros.</p>
  29. </div>
  30. <div className="agency-portfolio-feedback-item">
  31. <img src="/images/client-image/client2.jpg" alt="image" />
  32. <p>Pellentesque sed purus eu urna vulputate interdum quis sit amet sapien. Pellentesque porta mauris at orci sagittis commodo. Curabitur aliquam nibh odio, vel ornare nisl volutpat quis. Maecenas congue dapibus lacus id fringilla. Vestibulum id augue massa. Proin sed neque dapibus, vulputate ligula eget, aliquam eros.</p>
  33. </div>
  34. <div className="agency-portfolio-feedback-item">
  35. <img src="/images/client-image/client3.jpg" alt="image" />
  36. <p>Pellentesque sed purus eu urna vulputate interdum quis sit amet sapien. Pellentesque porta mauris at orci sagittis commodo. Curabitur aliquam nibh odio, vel ornare nisl volutpat quis. Maecenas congue dapibus lacus id fringilla. Vestibulum id augue massa. Proin sed neque dapibus, vulputate ligula eget, aliquam eros.</p>
  37. </div>
  38. </OwlCarousel> : ''}
  39. </div>
  40. </div>
  41. )
  42. }
  43. export default FeedbackStyleFive;