import React from 'react';
//import thumb from '../../assets/images/PerformingTaskNew.png';
import thumb from '../../assets/images/PerformingTask2.jpg';
import getConfig from './../../Config/config'

function TrafficHomeOne() {
  var site = getConfig()[0];
  return (
    <section className="wrench-on-area pt-140 pb-180">
      <div className="container">
        <div className="row">
          <div className="col-lg-7">
            <div className="appie-traffic-title">
              <h3 className="title">{featuresContent.title}</h3>
              <p>{featuresContent.detail}</p>
            </div>
            <div className="row">
              {featuresContent.list?.map(({ icon, header, paragraph }, idx) => (
                <div className="col-lg-6 col-md-6" key={idx}>
                  <div className={`appie-traffic-service features item-${idx + 1} mb-30`} style={{ paddingRight: "45px" }}>
                    <div className="icon">
                      <i className={icon} />
                    </div>
                    <h5 className="title">{header}</h5>
                    <p>{paragraph}</p>
                  </div>
                </div>
              ))}
              {/* <div className="col-lg-12">
                                <div className="traffic-btn mt-50">
                                    <a className="main-btn" href={process.env.REACT_APP_DASH_URL_LOGIN}>
                                        Login <i className="fal fa-arrow-right" />
                                    </a>
                                </div>
                            </div> */}
            </div>
          </div>
        </div>
      </div>
      <div className="traffic-thumb ">
        <img
          className="withFadeEdge wow animated fadeInRight"
          data-wow-duration="2000ms"
          data-wow-delay="200ms"
          src={thumb}
          alt=""
        />
      </div>
    </section>
  );
}

export default TrafficHomeOne;

const featuresContent = {
  title: "on WrenchBoard.",
  detail: "Performing task on WrenchBoard is easy. All you need is a free account.",
  list: [
    { icon: "fal fa-check", header: "Free account", paragraph: "Get family access from parents, or create your free account." },
    { icon: "fal fa-check", header: "Suggest or Find Task", paragraph: "Suggest tasks to parents or pick from the market." },
    { icon: "fal fa-check", header: "Complete Task", paragraph: "Complete the task as specified." },
    { icon: "fal fa-check", header: "Reward", paragraph: "Get your reward as specified." },
  ]
}