"use client";
import React, { Component }   from "react";
import Banner from "./banner";

export default function Track({
      params,
      searchParams,
    }: {
      params: { lang: string };
      searchParams?: { [tn: string]: any | string[] } | undefined;
    }){
  return (
    <div>
        <Banner searchParams={searchParams}/>
        <div className="warpper mx-auto flex items-center justify-center mt-[10%] mb-[10%]">
            <div className="grid grid-flow-row ">
                <div>
                   <h1 className="w-full text-center mb-[2%] whitespace-nowrap lg:text-4xl md:text-4xl text-xl">We provide solutions</h1>
                </div>
                <div>
                    <div className="grid lg:grid-cols-6 md:grid-cols-6 grid-cols-3">
                      <div className="lg:border-2 md:border-2 border-x-2 border-t-2 border-black p-5">
                            <img alt="" src="/assets/accounting.png" className="items-center "/>
                            <p>Finance</p>
                      </div>
                      <div className="lg:border-y-2 lg:border-r-2 md:border-y-2 md:border-r-2 border-r-2 border-t-2 border-black p-5">
                            <img alt="" src="/assets/take-away.png" className="items-center "/>
                            <p>Dealership</p>
                      </div>
                      <div className="lg:border-y-2  md:border-y-2 border-t-2 border-r-2 border-black p-5">
                            <img alt="" src="/assets/cargo-truck.png" className="items-center "/>
                            <p>Transport</p>
                      </div>
                      <div className="lg:border-y-2 md:border-y-2 border-2 border-black p-5">
                            <img alt="" src="/assets/car-service.png" className="items-center "/>
                            <p>Services</p>
                      </div>
                      <div className="border-y-2 border-black p-5">
                            <img alt="" src="/assets/price.png" className="items-center "/>
                            <p>Auctions</p>
                      </div>
                      <div className="border-2 border-black p-5">
                            <img alt="" src="/assets/cargo-ship.png" className="items-center "/>
                            <p>Shipping</p>
                      </div>
                    </div>
                </div>
            </div>
        </div>   
    </div>
  ); 
}