first commit
This commit is contained in:
206
src/components/sections/EVLogisticSection.tsx
Normal file
206
src/components/sections/EVLogisticSection.tsx
Normal file
@@ -0,0 +1,206 @@
|
||||
"use client";
|
||||
|
||||
import React, { useState } from "react";
|
||||
import Image from "next/image";
|
||||
|
||||
export default function EVLogisticSection() {
|
||||
const [openIndex, setOpenIndex] = useState<number | null>(1);
|
||||
|
||||
const toggleAccordion = (index: number) => {
|
||||
setOpenIndex((prev) => (prev === index ? null : index));
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="elementor-63 miletruth-hero about-us-hero" style={{ position: "relative", zIndex: 1 }}>
|
||||
<div
|
||||
style={{ marginBottom: "180px" }}
|
||||
className="elementor-element ev-log elementor-element-ead59d3 e-con-full e-flex cut-corner-no sticky-container-off e-con e-parent"
|
||||
data-id="ead59d3"
|
||||
data-element_type="container"
|
||||
data-e-type="container"
|
||||
>
|
||||
<div
|
||||
className="elementor-element elementor-element-f35119c elementor-widget__width-initial elementor-absolute elementor-widget elementor-widget-image"
|
||||
data-id="f35119c"
|
||||
data-element_type="widget"
|
||||
data-e-type="widget"
|
||||
style={{ position: "absolute" }}
|
||||
>
|
||||
<div className="elementor-widget-container">
|
||||
<Image
|
||||
src="/images/ev.jpeg"
|
||||
alt="EV Logistics"
|
||||
width={1050}
|
||||
height={854}
|
||||
style={{ width: "100%", height: "auto" }}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
className="elementor-element elementor-element-56ecbb3 e-flex e-con-boxed cut-corner-no sticky-container-off e-con e-child"
|
||||
data-id="56ecbb3"
|
||||
data-element_type="container"
|
||||
data-e-type="container"
|
||||
>
|
||||
<div className="e-con-inner">
|
||||
<div
|
||||
className="elementor-element elementor-element-47f8cbe e-con-full e-flex cut-corner-no sticky-container-off e-con e-child"
|
||||
data-id="47f8cbe"
|
||||
data-element_type="container"
|
||||
data-e-type="container"
|
||||
>
|
||||
<div
|
||||
className="elementor-element elementor-element-cd6daaf elementor-widget elementor-widget-logico_heading"
|
||||
data-id="cd6daaf"
|
||||
data-element_type="widget"
|
||||
data-e-type="widget"
|
||||
>
|
||||
<div className="elementor-widget-container">
|
||||
<div className="logico-title">/ features /</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
className="elementor-element elementor-element-1b3f232 elementor-widget__width-initial elementor-widget elementor-widget-logico_heading"
|
||||
data-id="1b3f232"
|
||||
data-element_type="widget"
|
||||
data-e-type="widget"
|
||||
>
|
||||
<div className="elementor-widget-container">
|
||||
<h3 className="logico-title">Logistics Built for Electric Vehicles</h3>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
className="elementor-element elementor-element-9b7e9c9 elementor-widget__width-initial elementor-widget elementor-widget-accordion"
|
||||
data-id="9b7e9c9"
|
||||
data-element_type="widget"
|
||||
data-e-type="widget"
|
||||
>
|
||||
<div className="elementor-widget-container">
|
||||
<div className="elementor-accordion">
|
||||
|
||||
{/* Accordion 1 */}
|
||||
<div className="elementor-accordion-item">
|
||||
<div
|
||||
className={`elementor-tab-title ${openIndex === 1 ? "elementor-active" : ""}`}
|
||||
role="button"
|
||||
aria-expanded={openIndex === 1}
|
||||
onClick={() => toggleAccordion(1)}
|
||||
style={{ cursor: "pointer" }}
|
||||
>
|
||||
<span className="elementor-accordion-icon elementor-accordion-icon-right" aria-hidden="true">
|
||||
<span className="elementor-accordion-icon-closed" style={{ display: openIndex === 1 ? "none" : "inline" }}>
|
||||
<i className="fontello icon-arrow-x-r-down"></i>
|
||||
</span>
|
||||
<span className="elementor-accordion-icon-opened" style={{ display: openIndex === 1 ? "inline" : "none" }}>
|
||||
<i className="fontello icon-arrow-x-r-top"></i>
|
||||
</span>
|
||||
</span>
|
||||
<span className="elementor-accordion-title">01. Battery-First Planning</span>
|
||||
</div>
|
||||
<div
|
||||
className="elementor-tab-content elementor-clearfix"
|
||||
role="region"
|
||||
style={{ display: openIndex === 1 ? "block" : "none" }}
|
||||
>
|
||||
<p>Routes are optimized around battery levels and charging windows, not retrofitted as an afterthought.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Accordion 2 */}
|
||||
<div className="elementor-accordion-item">
|
||||
<div
|
||||
className={`elementor-tab-title ${openIndex === 2 ? "elementor-active" : ""}`}
|
||||
role="button"
|
||||
aria-expanded={openIndex === 2}
|
||||
onClick={() => toggleAccordion(2)}
|
||||
style={{ cursor: "pointer" }}
|
||||
>
|
||||
<span className="elementor-accordion-icon elementor-accordion-icon-right" aria-hidden="true">
|
||||
<span className="elementor-accordion-icon-closed" style={{ display: openIndex === 2 ? "none" : "inline" }}>
|
||||
<i className="fontello icon-arrow-x-r-down"></i>
|
||||
</span>
|
||||
<span className="elementor-accordion-icon-opened" style={{ display: openIndex === 2 ? "inline" : "none" }}>
|
||||
<i className="fontello icon-arrow-x-r-top"></i>
|
||||
</span>
|
||||
</span>
|
||||
<span className="elementor-accordion-title">02. Energy-Aware Routing</span>
|
||||
</div>
|
||||
<div
|
||||
className="elementor-tab-content elementor-clearfix"
|
||||
role="region"
|
||||
style={{ display: openIndex === 2 ? "block" : "none" }}
|
||||
>
|
||||
<p>Our algorithms factor in terrain, traffic, and payload weight to maximize range efficiency.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Accordion 3 */}
|
||||
<div className="elementor-accordion-item">
|
||||
<div
|
||||
className={`elementor-tab-title ${openIndex === 3 ? "elementor-active" : ""}`}
|
||||
role="button"
|
||||
aria-expanded={openIndex === 3}
|
||||
onClick={() => toggleAccordion(3)}
|
||||
style={{ cursor: "pointer" }}
|
||||
>
|
||||
<span className="elementor-accordion-icon elementor-accordion-icon-right" aria-hidden="true">
|
||||
<span className="elementor-accordion-icon-closed" style={{ display: openIndex === 3 ? "none" : "inline" }}>
|
||||
<i className="fontello icon-arrow-x-r-down"></i>
|
||||
</span>
|
||||
<span className="elementor-accordion-icon-opened" style={{ display: openIndex === 3 ? "inline" : "none" }}>
|
||||
<i className="fontello icon-arrow-x-r-top"></i>
|
||||
</span>
|
||||
</span>
|
||||
<span className="elementor-accordion-title">03. Smart Charging Integration</span>
|
||||
</div>
|
||||
<div
|
||||
className="elementor-tab-content elementor-clearfix"
|
||||
role="region"
|
||||
style={{ display: openIndex === 3 ? "block" : "none" }}
|
||||
>
|
||||
<p>Seamless coordination with charging infrastructure to eliminate range anxiety for drivers.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Accordion 4 */}
|
||||
<div className="elementor-accordion-item">
|
||||
<div
|
||||
className={`elementor-tab-title ${openIndex === 4 ? "elementor-active" : ""}`}
|
||||
role="button"
|
||||
aria-expanded={openIndex === 4}
|
||||
onClick={() => toggleAccordion(4)}
|
||||
style={{ cursor: "pointer" }}
|
||||
>
|
||||
<span className="elementor-accordion-icon elementor-accordion-icon-right" aria-hidden="true">
|
||||
<span className="elementor-accordion-icon-closed" style={{ display: openIndex === 4 ? "none" : "inline" }}>
|
||||
<i className="fontello icon-arrow-x-r-down"></i>
|
||||
</span>
|
||||
<span className="elementor-accordion-icon-opened" style={{ display: openIndex === 4 ? "inline" : "none" }}>
|
||||
<i className="fontello icon-arrow-x-r-top"></i>
|
||||
</span>
|
||||
</span>
|
||||
<span className="elementor-accordion-title">04. Carbon Footprint Tracking</span>
|
||||
</div>
|
||||
<div
|
||||
className="elementor-tab-content elementor-clearfix"
|
||||
role="region"
|
||||
style={{ display: openIndex === 4 ? "block" : "none" }}
|
||||
>
|
||||
<p>Real-time emissions monitoring and sustainability reports for every delivery.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user