Updated Doormile website
This commit is contained in:
R-Bharathraj
1156
includes/sections/logistics/connected-log.php
Normal file
1156
includes/sections/logistics/connected-log.php
Normal file
File diff suppressed because it is too large
Load Diff
139
includes/sections/logistics/connected-logistics-section.php
Normal file
139
includes/sections/logistics/connected-logistics-section.php
Normal file
@@ -0,0 +1,139 @@
|
||||
<style>
|
||||
/* Custom adjustments for the logistics hero section */
|
||||
.elementor-element-89a0ca1 {
|
||||
min-height: auto !important;
|
||||
padding-top: 100px !important;
|
||||
padding-bottom: 100px !important;
|
||||
overflow-x: hidden !important; /* Prevent horizontal scroll from decorative elements */
|
||||
position: relative !important;
|
||||
}
|
||||
.elementor-element-96343ba {
|
||||
padding-left: 3% !important; /* Move image to the right */
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.elementor-element-99768ba img {
|
||||
max-height: 750px !important; /* Reduce image height */
|
||||
width: auto !important;
|
||||
object-fit: contain;
|
||||
}
|
||||
@media (max-width: 1024px) {
|
||||
.elementor-element-96343ba {
|
||||
padding-left: 0 !important;
|
||||
padding-top: 0 !important;
|
||||
}
|
||||
.elementor-element-99768ba img {
|
||||
max-height: 400px !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<div class="elementor-element elementor-element-89a0ca1 e-con-full e-flex cut-corner-no sticky-container-off e-con e-parent" data-id="89a0ca1" data-element_type="container" data-e-type="container">
|
||||
<div class="elementor-element elementor-element-9ffed33 e-con-full e-flex cut-corner-no sticky-container-off e-con e-child" data-id="9ffed33" data-element_type="container" data-e-type="container" data-settings="{"background_background":"classic"}">
|
||||
<div class="elementor-element elementor-element-96343ba e-con-full e-flex cut-corner-no sticky-container-off e-con e-child" data-id="96343ba" data-element_type="container" data-e-type="container">
|
||||
<div class="elementor-element elementor-element-99768ba elementor-widget elementor-widget-image"
|
||||
data-id="99768ba" data-element_type="widget" data-widget_type="image.default">
|
||||
<div class="elementor-widget-container">
|
||||
<img fetchpriority="high" decoding="async" width="578" height="790"
|
||||
src="assets/images/home2-pic-3.png"
|
||||
class="attachment-full size-full wp-image-4481" alt="assets/images/home2-pic-3.png" />
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="elementor-element elementor-element-0031d81 elementor-absolute elementor-widget elementor-widget-logico_video_button" data-id="0031d81" data-element_type="widget" data-e-type="widget" data-settings="{"youtube_url":"https:\/\/www.youtube.com\/watch?v=XHOmBV4js_E","_position":"absolute","video_type":"youtube","controls":"yes","lightbox":"yes"}" data-widget_type="logico_video_button.default">
|
||||
<div class="elementor-widget-container">
|
||||
<div class="elementor-wrapper elementor-open-lightbox logico-video-button video-button-animation-lift">
|
||||
<div class="elementor-custom-embed-image-overlay video-button-wrapper" data-elementor-open-lightbox="yes" data-elementor-lightbox="{"type":"video","videoType":"youtube","url":"https:\/\/www.youtube.com\/embed\/XHOmBV4js_E?feature=oembed&start&end&wmode=opaque&loop=0&controls=1&mute=0&rel=0&cc_load_policy=0","autoplay":"","modalOptions":{"id":"elementor-lightbox-0031d81","entranceAnimation":"","entranceAnimation_tablet":"","entranceAnimation_mobile":"","videoAspectRatio":"169"}}" data-e-action-hash="#elementor-action%3Aaction%3Dlightbox%26settings%3DeyJ0eXBlIjoidmlkZW8iLCJ2aWRlb1R5cGUiOiJ5b3V0dWJlIiwidXJsIjoiaHR0cHM6XC9cL3d3dy55b3V0dWJlLmNvbVwvZW1iZWRcL1hIT21CVjRqc19FP2ZlYXR1cmU9b2VtYmVkJnN0YXJ0JmVuZCZ3bW9kZT1vcGFxdWUmbG9vcD0wJmNvbnRyb2xzPTEmbXV0ZT0wJnJlbD0wJmNjX2xvYWRfcG9saWN5PTAiLCJhdXRvcGxheSI6IiIsIm1vZGFsT3B0aW9ucyI6eyJpZCI6ImVsZW1lbnRvci1saWdodGJveC0wMDMxZDgxIiwiZW50cmFuY2VBbmltYXRpb24iOiIiLCJlbnRyYW5jZUFuaW1hdGlvbl90YWJsZXQiOiIiLCJlbnRyYW5jZUFuaW1hdGlvbl9tb2JpbGUiOiIiLCJ2aWRlb0FzcGVjdFJhdGlvIjoiMTY5In19">
|
||||
<div class="elementor-custom-embed-play" role="button">
|
||||
<div class="video-button-icon"></div>
|
||||
<div class="video-button-label">Watch video</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
<div class="elementor-element elementor-element-71c3e1d e-con-full e-flex cut-corner-no sticky-container-off e-con e-child" data-id="71c3e1d" data-element_type="container" data-e-type="container">
|
||||
<div class="elementor-element elementor-element-fdb2e58 e-con-full e-flex cut-corner-no sticky-container-off e-con e-child" data-id="fdb2e58" data-element_type="container" data-e-type="container">
|
||||
<div class="elementor-element elementor-element-0136e6e elementor-widget elementor-widget-logico_heading" data-id="0136e6e" data-element_type="widget" data-e-type="widget" data-widget_type="logico_heading.default">
|
||||
<div class="elementor-widget-container">
|
||||
<div class="logico-title">/ Connected Logistics /
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="elementor-element elementor-element-7500280 elementor-invisible elementor-widget elementor-widget-logico_heading" data-id="7500280" data-element_type="widget" data-e-type="widget" data-settings="{"_animation":"logico_heading_animation"}" data-widget_type="logico_heading.default">
|
||||
<div class="elementor-widget-container">
|
||||
<h3 class="logico-title">Smart logistics solutions we deliver for modern supply chains
|
||||
</h3>
|
||||
</div>
|
||||
</div>
|
||||
<div class="elementor-element elementor-element-4cc07a7 elementor-widget elementor-widget-logico_heading" data-id="4cc07a7" data-element_type="widget" data-e-type="widget" data-widget_type="logico_heading.default">
|
||||
<div class="elementor-widget-container">
|
||||
<div class="logico-title">Real-Time Visibility
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="elementor-element elementor-element-165dfa5 elementor-widget__width-initial elementor-widget elementor-widget-text-editor" data-id="165dfa5" data-element_type="widget" data-e-type="widget" data-widget_type="text-editor.default">
|
||||
<div class="elementor-widget-container">
|
||||
<p>See every shipment, every vehicle, every handoff—live. No blind spots.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="elementor-element elementor-element-da9d310 elementor-widget elementor-widget-logico_heading" data-id="da9d310" data-element_type="widget" data-e-type="widget" data-widget_type="logico_heading.default">
|
||||
<div class="elementor-widget-container">
|
||||
<div class="logico-title">Dynamic Route Adjustment
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="elementor-element elementor-element-3888a1e elementor-widget__width-initial elementor-widget elementor-widget-text-editor" data-id="3888a1e" data-element_type="widget" data-e-type="widget" data-widget_type="text-editor.default">
|
||||
<div class="elementor-widget-container">
|
||||
<p>AI continuously optimizes routes based on traffic, weather, and real-world conditions.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="elementor-element elementor-element-da9d310 elementor-widget elementor-widget-logico_heading" data-id="da9d310" data-element_type="widget" data-e-type="widget" data-widget_type="logico_heading.default">
|
||||
<div class="elementor-widget-container">
|
||||
<div class="logico-title">Proactive Delay Prevention
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="elementor-element elementor-element-3888a1e elementor-widget__width-initial elementor-widget elementor-widget-text-editor" data-id="3888a1e" data-element_type="widget" data-e-type="widget" data-widget_type="text-editor.default">
|
||||
<div class="elementor-widget-container">
|
||||
<p>Detect SLA risks hours before they become problems. Act, don't react.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="elementor-element elementor-element-da9d310 elementor-widget elementor-widget-logico_heading" data-id="da9d310" data-element_type="widget" data-e-type="widget" data-widget_type="logico_heading.default">
|
||||
<div class="elementor-widget-container">
|
||||
<div class="logico-title">Execution Intelligence
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="elementor-element elementor-element-3888a1e elementor-widget__width-initial elementor-widget elementor-widget-text-editor" data-id="3888a1e" data-element_type="widget" data-e-type="widget" data-widget_type="text-editor.default">
|
||||
<div class="elementor-widget-container">
|
||||
<p>Learn from every delivery. Get smarter with every mile traveled.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="elementor-element elementor-element-c0a45e4 elementor-widget elementor-widget-logico_button" data-id="c0a45e4" data-element_type="widget" data-e-type="widget" data-widget_type="logico_button.default">
|
||||
<div class="elementor-widget-container">
|
||||
<div class="button-widget">
|
||||
<div class="button-container">
|
||||
|
||||
|
||||
<a href="#" target="_blank" class="logico-alter-button">Explore more </a>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="elementor-element elementor-element-0efc59e elementor-widget__width-auto elementor-absolute elementor-widget elementor-widget-logico_decorative_block" data-id="0efc59e" data-element_type="widget" data-e-type="widget" data-settings="{"_position":"absolute"}" data-widget_type="logico_decorative_block.default">
|
||||
<div class="elementor-widget-container">
|
||||
<div class="block-decoration animation-enable block-decoration-style-1">
|
||||
<div class="block-decoration-item"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
173
includes/sections/logistics/ev-logistics.php
Normal file
173
includes/sections/logistics/ev-logistics.php
Normal file
@@ -0,0 +1,173 @@
|
||||
<link rel="stylesheet" href="assets/css/widgets/widget-accordion.min.css" type="text/css" media="all" />
|
||||
|
||||
<style>
|
||||
/* EV Section Column Layout */
|
||||
.elementor-element-b8da0f5>.e-con-inner {
|
||||
display: flex;
|
||||
flex-direction: row !important;
|
||||
align-items: center !important;
|
||||
gap: 40px !important;
|
||||
justify-content: space-between !important;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.elementor-element-aef73c1 {
|
||||
flex: 1 1 45% !important;
|
||||
margin: 0 auto !important;
|
||||
display: flex !important;
|
||||
}
|
||||
|
||||
.elementor-element-89d7623 {
|
||||
flex: 1 1 55% !important;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
.elementor-element-b8da0f5>.e-con-inner {
|
||||
flex-direction: column-reverse !important;
|
||||
}
|
||||
|
||||
.elementor-element-aef73c1,
|
||||
.elementor-element-89d7623 {
|
||||
width: 100% !important;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
/* Accordion icon styling */
|
||||
.elementor-element-155d377 .elementor-accordion-icon-closed i {
|
||||
color: #000000 !important;
|
||||
}
|
||||
|
||||
.elementor-element-155d377 .elementor-tab-title.elementor-active .elementor-accordion-icon-opened i {
|
||||
color: #c01227 !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="elementor-element elementor-element-b8da0f5 e-flex e-con-boxed cut-corner-no sticky-container-off e-con e-parent accordion" style="margin: 60px;"
|
||||
data-id="b8da0f5" data-element_type="container">
|
||||
<div class="e-con-inner">
|
||||
<div class="elementor-element elementor-element-aef73c1 e-con-full e-flex cut-corner-no sticky-container-off e-con e-child"
|
||||
data-id="aef73c1" data-element_type="container">
|
||||
<div class="elementor-element elementor-element-e2a1b94 elementor-widget elementor-widget-image"
|
||||
data-id="e2a1b94" data-element_type="widget" data-widget_type="image.default">
|
||||
<div class="elementor-widget-container">
|
||||
<img width="995" height="475" src="assets/images/ev.jpeg"
|
||||
class="attachment-full size-full wp-image-ev" alt="Electric Truck Charging"
|
||||
style="border-radius: 25px; box-shadow: 0 10px 30px rgba(0,0,0,0.1); width: 100%; height: auto;" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="elementor-element elementor-element-89d7623 e-con-full e-flex cut-corner-no sticky-container-off e-con e-child"
|
||||
data-id="89d7623" data-element_type="container">
|
||||
<div class="elementor-element elementor-element-54d05ac elementor-invisible elementor-widget elementor-widget-logico_heading"
|
||||
data-id="54d05ac" data-element_type="widget"
|
||||
data-settings="{"_animation":"logico_heading_animation"}"
|
||||
data-widget_type="logico_heading.default">
|
||||
<div class="elementor-widget-container">
|
||||
<h3 class="logico-title">Logistics Built for Electric Vehicles
|
||||
</h3>
|
||||
</div>
|
||||
</div>
|
||||
<div class="elementor-element elementor-element-155d377 elementor-widget elementor-widget-accordion"
|
||||
data-id="155d377" data-element_type="widget" data-widget_type="accordion.default">
|
||||
<div class="elementor-widget-container">
|
||||
<div class="elementor-accordion">
|
||||
<div class="elementor-accordion-item">
|
||||
<div id="elementor-tab-title-2241" class="elementor-tab-title" data-tab="1" role="button"
|
||||
aria-controls="elementor-tab-content-2241" aria-expanded="false">
|
||||
<span class="elementor-accordion-icon elementor-accordion-icon-right"
|
||||
aria-hidden="true">
|
||||
<span class="elementor-accordion-icon-closed">
|
||||
<i class="fontello icon-arrow-x-r-down"></i>
|
||||
</span>
|
||||
<span class="elementor-accordion-icon-opened">
|
||||
<i class="fontello icon-arrow-x-r-top"></i>
|
||||
</span>
|
||||
</span>
|
||||
<a class="elementor-accordion-title" tabindex="0">01. Battery-First Planning</a>
|
||||
</div>
|
||||
<div id="elementor-tab-content-2241" class="elementor-tab-content elementor-clearfix"
|
||||
data-tab="1" role="region" aria-labelledby="elementor-tab-title-2241">
|
||||
<p>
|
||||
Routes are optimized around battery levels and charging windows, not retrofitted as
|
||||
an afterthought.
|
||||
|
||||
</p>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="elementor-accordion-item">
|
||||
<div id="elementor-tab-title-2242" class="elementor-tab-title" data-tab="2" role="button"
|
||||
aria-controls="elementor-tab-content-2242" aria-expanded="false">
|
||||
<span class="elementor-accordion-icon elementor-accordion-icon-right"
|
||||
aria-hidden="true">
|
||||
<span class="elementor-accordion-icon-closed">
|
||||
<i class="fontello icon-arrow-x-r-down"></i>
|
||||
</span>
|
||||
<span class="elementor-accordion-icon-opened">
|
||||
<i class="fontello icon-arrow-x-r-top"></i>
|
||||
</span>
|
||||
</span>
|
||||
<a class="elementor-accordion-title" tabindex="0">02. Energy-Aware Routing</a>
|
||||
</div>
|
||||
<div id="elementor-tab-content-2242" class="elementor-tab-content elementor-clearfix"
|
||||
data-tab="2" role="region" aria-labelledby="elementor-tab-title-2242">
|
||||
<p>
|
||||
Our algorithms factor in terrain, traffic, and payload weight to maximize range
|
||||
efficiency
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="elementor-accordion-item">
|
||||
<div id="elementor-tab-title-2243" class="elementor-tab-title" data-tab="3" role="button"
|
||||
aria-controls="elementor-tab-content-2243" aria-expanded="false">
|
||||
<span class="elementor-accordion-icon elementor-accordion-icon-right"
|
||||
aria-hidden="true">
|
||||
<span class="elementor-accordion-icon-closed">
|
||||
<i class="fontello icon-arrow-x-r-down"></i>
|
||||
</span>
|
||||
<span class="elementor-accordion-icon-opened">
|
||||
<i class="fontello icon-arrow-x-r-top"></i>
|
||||
</span>
|
||||
</span>
|
||||
<a class="elementor-accordion-title" tabindex="0">03. Smart Charging
|
||||
Integration</a>
|
||||
</div>
|
||||
<div id="elementor-tab-content-2243" class="elementor-tab-content elementor-clearfix"
|
||||
data-tab="3" role="region" aria-labelledby="elementor-tab-title-2243">
|
||||
<p>
|
||||
Seamless coordination with charging infrastructure to eliminate range anxiety for
|
||||
drivers.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="elementor-accordion-item">
|
||||
<div id="elementor-tab-title-2244" class="elementor-tab-title" data-tab="4" role="button"
|
||||
aria-controls="elementor-tab-content-2244" aria-expanded="false">
|
||||
<span class="elementor-accordion-icon elementor-accordion-icon-right"
|
||||
aria-hidden="true">
|
||||
<span class="elementor-accordion-icon-closed">
|
||||
<i class="fontello icon-arrow-x-r-down"></i>
|
||||
</span>
|
||||
<span class="elementor-accordion-icon-opened">
|
||||
<i class="fontello icon-arrow-x-r-top"></i>
|
||||
</span>
|
||||
</span>
|
||||
<a class="elementor-accordion-title" tabindex="0">04. Carbon Footprint Tracking</a>
|
||||
</div>
|
||||
<div id="elementor-tab-content-2244" class="elementor-tab-content elementor-clearfix"
|
||||
data-tab="4" role="region" aria-labelledby="elementor-tab-title-2244">
|
||||
<p>
|
||||
Real-time emissions monitoring and sustainability reports for every delivery.<br />
|
||||
</p>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
173
includes/sections/logistics/ev-premium.php
Normal file
173
includes/sections/logistics/ev-premium.php
Normal file
@@ -0,0 +1,173 @@
|
||||
|
||||
<link rel="stylesheet" href="assets/css/sections/section-ev-premium.css">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap" rel="stylesheet">
|
||||
|
||||
<section class="evp-section">
|
||||
<!-- Background Decor -->
|
||||
<div class="evp-bg-aura aura-red"></div>
|
||||
<div class="evp-bg-aura aura-blue"></div>
|
||||
<div class="evp-grid-overlay"></div>
|
||||
|
||||
<div class="evp-container">
|
||||
<div class="evp-layout">
|
||||
|
||||
<!-- LEFT: Strategic Content -->
|
||||
<div class="evp-content">
|
||||
<div class="evp-tag">
|
||||
<span class="status-dot"></span>
|
||||
EV-Native Intelligence
|
||||
</div>
|
||||
|
||||
<h2 class="evp-title" style="color:#FFFFFF !important">
|
||||
BUILT FOR ELECTRIC.
|
||||
<span>NOT ADAPTED.</span>
|
||||
</h2>
|
||||
|
||||
<p class="evp-desc">
|
||||
Most logistics software treats EVs as diesel trucks with a battery. Doormile was built EV-first—understanding that electric fleets require fundamentally different intelligence.
|
||||
</p>
|
||||
|
||||
<div class="evp-features">
|
||||
<!-- Feature 1 -->
|
||||
<div class="evp-feature-card">
|
||||
<div class="evp-icon-box">
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 2v20M2 12h20M4.93 4.93l14.14 14.14M4.93 19.07L19.07 4.93"/></svg>
|
||||
</div>
|
||||
<h4>Adaptive Routing</h4>
|
||||
<p>Battery level, health, and degradation are primary inputs to our route optimization engine.</p>
|
||||
</div>
|
||||
|
||||
<!-- Feature 2 -->
|
||||
<div class="evp-feature-card">
|
||||
<div class="evp-icon-box">
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18.36 6.64A9 9 0 1 1 5.64 19.36m12.72-12.72L12 12M18.36 6.64L19.77 5.23"/></svg>
|
||||
</div>
|
||||
<h4>Charging Sync</h4>
|
||||
<p>Seamlessly integrate charging stops into routes without compromising strict delivery windows.</p>
|
||||
</div>
|
||||
|
||||
<!-- Feature 3 -->
|
||||
<div class="evp-feature-card">
|
||||
<div class="evp-icon-box">
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="22 12 18 12 15 21 9 3 6 12 2 12"/></svg>
|
||||
</div>
|
||||
<h4>Energy Paths</h4>
|
||||
<p>Advanced terrain and weather models predict energy consumption with 98% accuracy.</p>
|
||||
</div>
|
||||
|
||||
<!-- Feature 4 -->
|
||||
<div class="evp-feature-card">
|
||||
<div class="evp-icon-box">
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="2" ry="2"/><line x1="12" y1="8" x2="12" y2="16"/><line x1="8" y1="12" x2="16" y2="12"/></svg>
|
||||
</div>
|
||||
<h4>Total Control</h4>
|
||||
<p>Real-time telemetry gives you a god-view of every asset's health and performance.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- RIGHT: Interactive Dashboard Visual -->
|
||||
<div class="evp-visual">
|
||||
<div class="evp-dashboard">
|
||||
<div class="evp-db-header">
|
||||
<div>
|
||||
<span class="evp-db-title">Fleet Status</span>
|
||||
<h4 class="evp-db-id">DML-001</h4>
|
||||
</div>
|
||||
<div class="evp-live-tag">
|
||||
Live Telemetry
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="evp-van-stage">
|
||||
<!-- Floating HUD: Battery -->
|
||||
<div class="evp-hud-card hud-battery" data-speed="1.2">
|
||||
<div class="evp-progress-wrap">
|
||||
<svg class="evp-progress-svg" viewBox="0 0 40 40">
|
||||
<circle class="evp-progress-circle-bg" cx="20" cy="20" r="18"/>
|
||||
<circle class="evp-progress-circle" cx="20" cy="20" r="18" style="stroke-dasharray: 113; stroke-dashoffset: 113;"/>
|
||||
</svg>
|
||||
</div>
|
||||
<div>
|
||||
<div class="hud-label-small">Battery Charge</div>
|
||||
<div class="hud-val-large">82%</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Floating HUD: Location -->
|
||||
<div class="evp-hud-card hud-location" data-speed="0.8">
|
||||
<div class="hud-label-small">Current Location</div>
|
||||
<div class="hud-val-large" style="font-size: 16px;">Downtown HQ</div>
|
||||
<div style="font-size: 10px; color: #10B981; margin-top: 5px;">• On Schedule</div>
|
||||
</div>
|
||||
|
||||
<!-- Floating HUD: Route -->
|
||||
<div class="evp-hud-card hud-route" data-speed="1.5">
|
||||
<div class="hud-label-small">Active Route</div>
|
||||
<div class="hud-val-large" style="font-size: 16px;">Zone B delivery</div>
|
||||
<div class="hud-route-path">
|
||||
<div class="hud-route-line"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<img src="assets/images/premium-ev-van.png" alt="Doormile Premium Electric Van" class="evp-van-image">
|
||||
</div>
|
||||
|
||||
<!-- Metrics Row -->
|
||||
<div class="evp-metrics">
|
||||
<div class="m-item">
|
||||
<div class="m-label">Fuel Saved</div>
|
||||
<div class="m-value">40%</div>
|
||||
</div>
|
||||
<div class="m-item">
|
||||
<div class="m-label">Emissions</div>
|
||||
<div class="m-value">ZERO</div>
|
||||
</div>
|
||||
<div class="m-item">
|
||||
<div class="m-label">Uptime</div>
|
||||
<div class="m-value">98%</div>
|
||||
</div>
|
||||
<div class="m-item">
|
||||
<div class="m-label">Efficiency</div>
|
||||
<div class="m-value">3x</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
// Animate Battery Progress
|
||||
setTimeout(() => {
|
||||
const circle = document.querySelector('.evp-progress-circle');
|
||||
if (circle) {
|
||||
circle.style.strokeDashoffset = '20.34'; // 82% of 113
|
||||
}
|
||||
}, 500);
|
||||
|
||||
// Subtle Mouse Parallax for HUD cards
|
||||
const container = document.querySelector('.evp-visual');
|
||||
const cards = document.querySelectorAll('.evp-hud-card');
|
||||
|
||||
container.addEventListener('mousemove', (e) => {
|
||||
const rect = container.getBoundingClientRect();
|
||||
const x = e.clientX - rect.left - rect.width / 2;
|
||||
const y = e.clientY - rect.top - rect.height / 2;
|
||||
|
||||
cards.forEach(card => {
|
||||
const speed = card.getAttribute('data-speed') || 1;
|
||||
card.style.transform = `translate(${x * 0.02 * speed}px, ${y * 0.02 * speed}px)`;
|
||||
});
|
||||
});
|
||||
|
||||
container.addEventListener('mouseleave', () => {
|
||||
cards.forEach(card => {
|
||||
card.style.transform = `translate(0, 0)`;
|
||||
});
|
||||
});
|
||||
});
|
||||
</script>
|
||||
289
includes/sections/logistics/ev.php
Normal file
289
includes/sections/logistics/ev.php
Normal file
@@ -0,0 +1,289 @@
|
||||
<div class="elementor-element elementor-element-bbc6760 e-con-full e-flex cut-corner-no sticky-container-off e-con e-parent" data-id="bbc6760" data-element_type="container" data-e-type="container">
|
||||
<div class="elementor-element elementor-element-13a7637 elementor-widget__width-auto elementor-absolute elementor-widget elementor-widget-logico_decorative_block" data-id="13a7637" data-element_type="widget" data-e-type="widget" data-settings="{"_position":"absolute"}" data-widget_type="logico_decorative_block.default">
|
||||
<div class="elementor-widget-container">
|
||||
<!-- <div class="block-decoration animation-enable block-decoration-style-1 animated">
|
||||
<div class="block-decoration-item">
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
</div>
|
||||
<div data-parallax="scroll" class="elementor-element elementor-element-7da6646 e-con-full e-flex cut-corner-no sticky-container-off e-con e-child" data-id="7da6646" data-element_type="container" data-e-type="container" data-settings="{"background_background":"classic"}" style="background-position: center 195.9px;">
|
||||
</div>
|
||||
<div class="elementor-element elementor-element-8b5d6e6 e-con-full e-flex cut-corner-no sticky-container-off e-con e-child" data-id="8b5d6e6" data-element_type="container" data-e-type="container">
|
||||
<div class="elementor-element elementor-element-1f766ea e-con-full e-flex cut-corner-no sticky-container-off e-con e-child" data-id="1f766ea" data-element_type="container" data-e-type="container">
|
||||
<div class="elementor-element elementor-element-3b61435 e-con-full e-flex cut-corner-no sticky-container-off e-con e-child" data-id="3b61435" data-element_type="container" data-e-type="container" data-settings="{"background_background":"classic"}">
|
||||
<div class="elementor-element elementor-element-c364d1c elementor-widget elementor-widget-text-editor" data-id="c364d1c" data-element_type="widget" data-e-type="widget" data-widget_type="text-editor.default">
|
||||
<div class="elementor-widget-container">
|
||||
<p>01</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="elementor-element elementor-element-239afbb elementor-widget elementor-widget-logico_heading" data-id="239afbb" data-element_type="widget" data-e-type="widget" data-widget_type="logico_heading.default">
|
||||
<div class="elementor-widget-container">
|
||||
<h5 class="logico-title">EV Logistics
|
||||
</h5>
|
||||
</div>
|
||||
</div>
|
||||
<div class="elementor-element elementor-element-0d307dd elementor-widget elementor-widget-text-editor" data-id="0d307dd" data-element_type="widget" data-e-type="widget" data-widget_type="text-editor.default">
|
||||
<div class="elementor-widget-container">
|
||||
<p>Cleaner miles, lower costs</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="elementor-element elementor-element-5aea22e e-con-full e-flex cut-corner-no sticky-container-off e-con e-child" data-id="5aea22e" data-element_type="container" data-e-type="container" data-settings="{"background_background":"classic"}">
|
||||
<!-- <div class="elementor-element elementor-element-46b9ffa elementor-widget elementor-widget-logico_button" data-id="46b9ffa" data-element_type="widget" data-e-type="widget" data-widget_type="logico_button.default">
|
||||
<div class="elementor-widget-container">
|
||||
|
||||
<div class="button-widget">
|
||||
<div class="button-container">
|
||||
<a href="#" target="_blank" class="logico-small-button">
|
||||
Explore more<svg viewBox="0 0 13 20">
|
||||
<polyline points="0.5 19.5 3 19.5 12.5 10 3 0.5"></polyline>
|
||||
</svg> </a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="elementor-element elementor-element-b6e14bd e-flex e-con-boxed cut-corner-no sticky-container-off e-con e-child" data-id="b6e14bd" data-element_type="container" data-e-type="container" data-settings="{"background_background":"classic"}">
|
||||
<div class="e-con-inner">
|
||||
<div class="elementor-element elementor-element-90cc867 e-con-full e-flex cut-corner-no sticky-container-off e-con e-child" data-id="90cc867" data-element_type="container" data-e-type="container">
|
||||
<div class="elementor-element elementor-element-24c0280 elementor-widget__width-inherit elementor-widget elementor-widget-logico_heading" data-id="24c0280" data-element_type="widget" data-e-type="widget" data-widget_type="logico_heading.default">
|
||||
<div class="elementor-widget-container">
|
||||
<div class="logico-title">/ EV-Native Design /
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="elementor-element elementor-element-2ed47f3 e-con-full e-grid cut-corner-no sticky-container-off e-con e-child" data-id="2ed47f3" data-element_type="container" data-e-type="container">
|
||||
<div class="elementor-element elementor-element-36efec7 e-con-full e-flex cut-corner-no sticky-container-off e-con e-child" data-id="36efec7" data-element_type="container" data-e-type="container">
|
||||
<div class="elementor-element elementor-element-778840d elementor-widget elementor-widget-logico_heading animated logico_heading_animation" data-id="778840d" data-element_type="widget" data-e-type="widget" data-settings="{"_animation":"logico_heading_animation"}" data-widget_type="logico_heading.default">
|
||||
<div class="elementor-widget-container">
|
||||
<h3 class="logico-title" data-animate>
|
||||
<span>Built for Electric.</span><br>
|
||||
Not Adapted.
|
||||
</h3>
|
||||
</div>
|
||||
</div>
|
||||
<div class="elementor-element elementor-element-bbfb67f elementor-widget elementor-widget-image" data-id="bbfb67f" data-element_type="widget" data-e-type="widget" data-widget_type="image.default">
|
||||
<div class="elementor-widget-container">
|
||||
<img fetchpriority="high" decoding="async" width="626" height="692" src="assets/images/home4-pic-1.png" class="attachment-full size-full wp-image-6789" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="elementor-element elementor-element-b2c956f e-con-full e-flex cut-corner-no sticky-container-off e-con e-child" data-id="b2c956f" data-element_type="container" data-e-type="container">
|
||||
<div class="elementor-element elementor-element-1a450c2 elementor-absolute elementor-widget elementor-widget-image" data-id="1a450c2" data-element_type="widget" data-e-type="widget" data-settings="{"_position":"absolute"}" data-widget_type="image.default">
|
||||
<div class="elementor-widget-container">
|
||||
<img loading="lazy" decoding="async" width="965" height="474" src="assets/images/bg-map.png" class="attachment-full size-full wp-image-1148" alt="">
|
||||
</div>
|
||||
</div>
|
||||
<div class="elementor-element elementor-element-6b51278 elementor-view-stacked elementor-position-inline-start elementor-shape-circle elementor-mobile-position-block-start elementor-widget elementor-widget-icon-box" data-id="6b51278" data-element_type="widget" data-e-type="widget" data-widget_type="icon-box.default">
|
||||
<div class="elementor-widget-container">
|
||||
<div class="elementor-icon-box-wrapper">
|
||||
|
||||
<div class="elementor-icon-box-icon">
|
||||
<span class="elementor-icon">
|
||||
<i aria-hidden="true" class="fontello icon-arrow-x-r-top"></i> </span>
|
||||
</div>
|
||||
|
||||
<div class="elementor-icon-box-content">
|
||||
|
||||
<div class="elementor-icon-box-title">
|
||||
<span>
|
||||
Battery-Aware Routing </span>
|
||||
</div>
|
||||
|
||||
<p class="elementor-icon-box-description">
|
||||
Battery level, health, and degradation are first-class inputs to route optimization. </p>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="elementor-element elementor-element-e34beb2 elementor-widget-divider--view-line elementor-widget elementor-widget-divider" data-id="e34beb2" data-element_type="widget" data-e-type="widget" data-widget_type="divider.default">
|
||||
<div class="elementor-widget-container">
|
||||
<div class="elementor-divider">
|
||||
<span class="elementor-divider-separator">
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="elementor-element elementor-element-27ba815 elementor-view-stacked elementor-position-inline-start elementor-shape-circle elementor-mobile-position-block-start elementor-widget elementor-widget-icon-box" data-id="27ba815" data-element_type="widget" data-e-type="widget" data-widget_type="icon-box.default">
|
||||
<div class="elementor-widget-container">
|
||||
<div class="elementor-icon-box-wrapper">
|
||||
|
||||
<div class="elementor-icon-box-icon">
|
||||
<span class="elementor-icon">
|
||||
<i aria-hidden="true" class="fontello icon-arrow-x-r-top"></i> </span>
|
||||
</div>
|
||||
|
||||
<div class="elementor-icon-box-content">
|
||||
|
||||
<div class="elementor-icon-box-title">
|
||||
<span>
|
||||
Charging Integration </span>
|
||||
</div>
|
||||
|
||||
<p class="elementor-icon-box-description">
|
||||
Seamlessly integrate charging stops without compromising delivery windows.</p>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="elementor-element elementor-element-6895eb5 elementor-widget-divider--view-line elementor-widget elementor-widget-divider" data-id="6895eb5" data-element_type="widget" data-e-type="widget" data-widget_type="divider.default">
|
||||
<div class="elementor-widget-container">
|
||||
<div class="elementor-divider">
|
||||
<span class="elementor-divider-separator">
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="elementor-element elementor-element-332c78f elementor-view-stacked elementor-position-inline-start elementor-shape-circle elementor-mobile-position-block-start elementor-widget elementor-widget-icon-box" data-id="332c78f" data-element_type="widget" data-e-type="widget" data-widget_type="icon-box.default">
|
||||
<div class="elementor-widget-container">
|
||||
<div class="elementor-icon-box-wrapper">
|
||||
|
||||
<div class="elementor-icon-box-icon">
|
||||
<span class="elementor-icon">
|
||||
<i aria-hidden="true" class="fontello icon-arrow-x-r-top"></i> </span>
|
||||
</div>
|
||||
|
||||
<div class="elementor-icon-box-content">
|
||||
|
||||
<div class="elementor-icon-box-title">
|
||||
<span>
|
||||
Energy-Optimized Paths </span>
|
||||
</div>
|
||||
|
||||
<p class="elementor-icon-box-description">
|
||||
Factor in elevation, speed limits, and weather for maximum efficiency.</p>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="elementor-element elementor-element-6895eb5 elementor-widget-divider--view-line elementor-widget elementor-widget-divider" data-id="6895eb5" data-element_type="widget" data-e-type="widget" data-widget_type="divider.default">
|
||||
<div class="elementor-widget-container">
|
||||
<div class="elementor-divider">
|
||||
<span class="elementor-divider-separator">
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="elementor-element elementor-element-332c78f elementor-view-stacked elementor-position-inline-start elementor-shape-circle elementor-mobile-position-block-start elementor-widget elementor-widget-icon-box" data-id="332c78f" data-element_type="widget" data-e-type="widget" data-widget_type="icon-box.default">
|
||||
<div class="elementor-widget-container">
|
||||
<div class="elementor-icon-box-wrapper">
|
||||
|
||||
<div class="elementor-icon-box-icon">
|
||||
<span class="elementor-icon">
|
||||
<i aria-hidden="true" class="fontello icon-arrow-x-r-top"></i> </span>
|
||||
</div>
|
||||
|
||||
<div class="elementor-icon-box-content">
|
||||
|
||||
<div class="elementor-icon-box-title">
|
||||
<span>
|
||||
Predictable Operations </span>
|
||||
</div>
|
||||
|
||||
<p class="elementor-icon-box-description">
|
||||
EVs become predictable assets, not operational risks.</p>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="elementor-element elementor-element-e70d3b7 elementor-widget elementor-widget-logico_button" data-id="e70d3b7" data-element_type="widget" data-e-type="widget" data-widget_type="logico_button.default">
|
||||
<div class="elementor-widget-container">
|
||||
|
||||
<div class="button-widget">
|
||||
<div class="button-container">
|
||||
<a href="#" target="_blank" class="logico-alter-button">
|
||||
Explore more </a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
/* Core Styling */
|
||||
|
||||
|
||||
.logico-title .word {
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
margin-right: 0.1em;
|
||||
}
|
||||
|
||||
.logico-title .letter {
|
||||
display: inline-block;
|
||||
opacity: 0;
|
||||
transform: translateY(0.5em);
|
||||
animation: fadeInUp 0.8s cubic-bezier(0.23, 1, 0.32, 1) forwards;
|
||||
}
|
||||
|
||||
/* Animation Keyframes */
|
||||
@keyframes fadeInUp {
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
/**
|
||||
* Automatically splits text into words and letters
|
||||
* and applies incrementing animation delays.
|
||||
*/
|
||||
document.querySelectorAll('[data-animate]').forEach(element => {
|
||||
// Preserve the internal HTML structure (like <br>) for line breaks
|
||||
const lines = element.innerHTML.split(/<br\s*\/?>/i);
|
||||
element.textContent = '';
|
||||
|
||||
lines.forEach((line, lineIdx) => {
|
||||
const lineContainer = document.createElement('div');
|
||||
lineContainer.style.display = 'block';
|
||||
|
||||
// Extract text from potential nested spans
|
||||
const tempDiv = document.createElement('div');
|
||||
tempDiv.innerHTML = line;
|
||||
const text = tempDiv.textContent.trim();
|
||||
|
||||
text.split(/\s+/).forEach((word, wordIdx) => {
|
||||
const wordSpan = document.createElement('span');
|
||||
wordSpan.className = 'word';
|
||||
|
||||
word.split('').forEach((letter, letterIdx) => {
|
||||
const letterSpan = document.createElement('span');
|
||||
letterSpan.className = 'letter';
|
||||
letterSpan.textContent = letter;
|
||||
|
||||
// Stagger delay based on line, word, and letter
|
||||
const delay = (lineIdx * 0.2) + (wordIdx * 0.1) + (letterIdx * 0.03);
|
||||
letterSpan.style.animationDelay = `${delay}s`;
|
||||
|
||||
wordSpan.appendChild(letterSpan);
|
||||
});
|
||||
|
||||
lineContainer.appendChild(wordSpan);
|
||||
// Add a non-breaking space after each word span for spacing
|
||||
lineContainer.appendChild(document.createTextNode('\u00A0'));
|
||||
});
|
||||
|
||||
element.appendChild(lineContainer);
|
||||
});
|
||||
});
|
||||
</script>
|
||||
Reference in New Issue
Block a user