Updated Doormile website
This commit is contained in:
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