WhySlide.tsx
 1  import React from 'react';
 2  
 3  import translate from 'translations';
 4  import onboardIconFive from 'assets/images/onboarding/slide-05.svg';
 5  import OnboardSlide from './OnboardSlide';
 6  
 7  const WhySlide = () => {
 8    const header = translate('ONBOARD_WHY_TITLE');
 9  
10    const content = (
11      <div>
12        <h5>{translate('ONBOARD_WHY_CONTENT__1')}</h5>
13        <ul>
14          <li className="text-danger">{translate('ONBOARD_WHY_CONTENT__2')}</li>
15          <li className="text-danger">{translate('ONBOARD_WHY_CONTENT__3')}</li>
16          <li className="text-danger">{translate('ONBOARD_WHY_CONTENT__4')}</li>
17          <li className="text-danger">{translate('ONBOARD_WHY_CONTENT__5')}</li>
18          <li className="text-danger">{translate('ONBOARD_WHY_CONTENT__6')}</li>
19        </ul>
20        <h5>{translate('ONBOARD_WHY_CONTENT__7')}</h5>
21        <ul>
22          <li>{translate('ONBOARD_WHY_CONTENT__8')}</li>
23          <li>{translate('ONBOARD_WHY_CONTENT__9')}</li>
24          <li>{translate('ONBOARD_WHY_CONTENT__10')}</li>
25        </ul>
26      </div>
27    );
28    return (
29      <OnboardSlide header={header} content={content} image={onboardIconFive} imageSide="left" />
30    );
31  };
32  
33  export default WhySlide;