Doormile/doormile-site
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

index pages are updated

Browse Source
This commit is contained in:
Kishore Kumar C
2026-04-03 17:26:50 +05:30
parent 65ffa5ec3b
commit fb8d0e5fb8
33 changed files with 102 additions and 251 deletions
Download Patch File Download Diff File Expand all files Collapse all files

184
includes/ev-design.php Normal file
View File

@@ -0,0 +1,184 @@
<style>
/* ─── EV SECTION BASE ─── */
.ev-section {
max-width: 1400px;
margin: auto;
display: flex;
align-items: center;
justify-content: space-between;
gap: 60px;
padding: 80px 20px;
}
/* ─── LARGE DESKTOP (1440px+) ─── */
@media (min-width: 1440px) {
.ev-section { max-width: 1360px; padding: 50px 52px; gap: 72px; background-color: #1f1f1f;border-radius: 20px; }
.ev-section .ev-badge { font-size: 15px; padding: 9px 18px; margin-bottom: 22px; }
.ev-section .ev-heading { font-size: 64px; margin-bottom: 22px; }
.ev-section .ev-subtext { font-size: 19px; max-width: 560px; margin-bottom: 44px; }
.ev-section .ev-grid { gap: 22px; max-width: 980px; }
.ev-section .ev-card { padding: 24px; border-radius: 16px; }
.ev-section .ev-card h3 { font-size: 19px; }
.ev-section .ev-card p { font-size: 14.5px; }
.ev-section .right-card { padding: 34px; border-radius: 22px; }
.ev-section .ev-stat-val { font-size: 1.4rem; }
.ev-section .ev-stat-label { font-size: 14px; }
}
/* ─── EXTRA-LARGE DESKTOP (1920px+) ─── */
@media (min-width: 1920px) {
.ev-section { max-width: 1780px; padding: 112px 64px; gap: 88px; }
.ev-section .ev-badge { font-size: 16px; padding: 10px 20px; margin-bottom: 26px; }
.ev-section .ev-heading { font-size: 76px; margin-bottom: 26px; }
.ev-section .ev-subtext { font-size: 20px; max-width: 620px; margin-bottom: 50px; line-height: 1.65; }
.ev-section .ev-grid { gap: 26px; max-width: 1060px; }
.ev-section .ev-card { padding: 28px; border-radius: 18px; }
.ev-section .ev-card h3 { font-size: 21px; }
.ev-section .ev-card p { font-size: 15.5px; }
.ev-section .right-card { padding: 40px; border-radius: 26px; }
.ev-section .ev-stat-val { font-size: 1.55rem; }
.ev-section .ev-stat-label { font-size: 15px; }
}
/* ─── ULTRA-WIDE (2560px+) ─── */
@media (min-width: 2560px) {
.ev-section { max-width: 2100px; padding: 50px 80px; gap: 108px; }
.ev-section .ev-badge { font-size: 18px; padding: 12px 24px; margin-bottom: 30px; }
.ev-section .ev-heading { font-size: 92px; margin-bottom: 30px; line-height: 1.05; }
.ev-section .ev-subtext { font-size: 22px; max-width: 700px; margin-bottom: 58px; line-height: 1.68; }
.ev-section .ev-grid { gap: 30px; max-width: 1200px; }
.ev-section .ev-card { padding: 32px; border-radius: 20px; }
.ev-section .ev-card h3 { font-size: 24px; }
.ev-section .ev-card p { font-size: 17px; }
.ev-section .right-card { padding: 48px; border-radius: 30px; }
.ev-section .ev-stat-val { font-size: 1.75rem; }
.ev-section .ev-stat-label { font-size: 16px; }
}
/* ─── RIGHT CARD OVERLAY ─── */
.right-card {
position: relative;
color: #111;
overflow: hidden;
}
.right-card::before {
content: "";
position: absolute;
inset: 0;
background: linear-gradient(
to right,
rgba(255,255,255,0.9) 30%,
rgba(255,255,255,0.6) 55%,
rgba(255,255,255,0.2) 100%
);
z-index: 0;
}
.right-card > * {
position: relative;
z-index: 1;
}
</style>
<section class="ev-section">
<!-- LEFT CONTENT -->
<div>
<span class="ev-badge" style="background:rgb(255,235,238);color:#c01227;padding:8px 16px;border-radius:20px;font-size:14px;display:inline-block;margin-bottom:20px;">
EV-Native Design
</span>
<h1 class="ev-heading" style="font-size:56px;font-weight:700;color:white;line-height:1.1;margin-bottom:20px;">
Built for Electric.<br>
<span style="color:#c01227;">Not Adapted.</span>
</h1>
<p class="ev-subtext" style="font-size:18px;color:white;max-width:520px;margin-bottom:40px;line-height:1.6;">
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="ev-grid" style="display:grid;grid-template-columns:1fr 1fr;gap:20px;max-width:920px;">
<div class="ev-card" style="background:#fff;padding:20px;border-radius:14px;box-shadow:0 5px 20px rgba(0,0,0,0.05);">
<h3 style="margin:0 0 8px 0;font-size:18px;">Battery-Aware Routing</h3>
<p style="font-size:14px;color:#6b7280;margin:0;">Battery level, health, and degradation are inputs to route optimization.</p>
</div>
<div class="ev-card" style="background:#fff;padding:20px;border-radius:14px;box-shadow:0 5px 20px rgba(0,0,0,0.05);">
<h3 style="margin:0 0 8px 0;font-size:18px;">Charging Integration</h3>
<p style="font-size:14px;color:#6b7280;margin:0;">Integrate charging stops without compromising delivery windows.</p>
</div>
<div class="ev-card" style="background:#fff;padding:20px;border-radius:14px;box-shadow:0 5px 20px rgba(0,0,0,0.05);">
<h3 style="margin:0 0 8px 0;font-size:18px;">Energy-Optimized Paths</h3>
<p style="font-size:14px;color:#6b7280;margin:0;">Consider elevation, speed limits, and weather for efficiency.</p>
</div>
<div class="ev-card" style="background:#fff;padding:20px;border-radius:14px;box-shadow:0 5px 20px rgba(0,0,0,0.05);">
<h3 style="margin:0 0 8px 0;font-size:18px;">Predictable Operations</h3>
<p style="font-size:14px;color:#6b7280;margin:0;">EVs become predictable assets, not operational risks.</p>
</div>
</div>
</div>
<!-- RIGHT CARD -->
<div class="right-card" style="background:#fff;padding:30px;border-radius:20px;width:920px;box-shadow:0 20px 40px rgba(0,0,0,0.08);background-image:url('/logistic/assets/images/ev-design1.jpeg');background-size:cover;background-position:center;">
<div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:25px;">
<h4 style="margin:0;">Fleet Status</h4>
<span style="color:#19a463;font-size:14px;">● 12 vehicles active</span>
</div>
<div style="display:flex;justify-content:space-between;padding:14px 0;border-bottom:1px solid #eee;">
<div>
<strong>EV-001</strong>
<p style="margin:0;color:#6b7280;font-size:14px;">Route A</p>
</div>
<div style="color:#19a463;font-weight:bold;">85% <span style="margin-left:10px;color:#221f1f;">15 min</span></div>
</div>
<div style="display:flex;justify-content:space-between;padding:14px 0;border-bottom:1px solid #eee;">
<div>
<strong>EV-002</strong>
<p style="margin:0;color:#6b7280;font-size:14px;">Route B</p>
</div>
<div style="color:#19a463;font-weight:bold;">62% <span style="margin-left:10px;color:#221f1f;">42 min</span></div>
</div>
<div style="display:flex;justify-content:space-between;padding:14px 0;border-bottom:1px solid #eee;">
<div>
<strong>EV-003</strong>
<p style="margin:0;color:#6b7280;font-size:14px;">Charging</p>
</div>
<div style="color:#f59e0b;font-size:1.1rem;font-weight:bold;">28% <span style="margin-left:10px;color:#221f1f;">Charging</span></div>
</div>
<div style="display:flex;justify-content:space-between;margin-top:30px;text-align:center;">
<div>
<h4 class="ev-stat-val" style="margin:0;color:#19a463;text-align:center;font-size:1.25rem;line-height:1.75rem;font-weight:bold;">40%</h4>
<p class="ev-stat-label" style="font-size:13px;color:#6b7280;margin:0;">Lower Fuel Costs</p>
</div>
<div>
<h4 class="ev-stat-val" style="margin:0;color:#19a463;text-align:center;font-size:1.25rem;line-height:1.75rem;font-weight:bold;">Zero</h4>
<p class="ev-stat-label" style="font-size:13px;color:#6b7280;margin:0;">Tailpipe Emissions</p>
</div>
<div>
<h4 class="ev-stat-val" style="margin:0;color:#19a463;text-align:center;font-size:1.25rem;line-height:1.75rem;font-weight:bold;">98%</h4>
<p class="ev-stat-label" style="font-size:13px;color:#6b7280;margin:0;">Fleet Uptime</p>
</div>
<div>
<p class="ev-stat-val" style="margin:0;color:#19a463;text-align:center;font-size:1.25rem;line-height:1.75rem;font-weight:bold;">3x</p>
<p class="ev-stat-label" style="font-size:13px;color:#6b7280;margin:0;">Longer Asset Life</p>
</div>
</div>
</div>
</section>