107 lines
3.7 KiB
TypeScript
107 lines
3.7 KiB
TypeScript
import EVSection, { type EVFeature, type EVStat } from "./EVSection";
|
|
|
|
// Placeholder banner — plain dark gradient, no photography (no ATR72/Q400
|
|
// or airport-hub imagery exists in the repo yet). Swap `bannerImage` for a
|
|
// sourced photo later; this keeps the section shippable in the meantime.
|
|
// EVSection embeds this value in an UNQUOTED CSS url(...).
|
|
|
|
const METRICS: EVStat[] = [
|
|
{ value: 8.2, decimals: 1, suffix: "t", label: "ATR72 Payload" },
|
|
{ value: 1600, suffix: "km", label: "ATR72 Range" },
|
|
{ value: 8.6, decimals: 1, suffix: "t", label: "Q400 Payload" },
|
|
{ value: 667, suffix: "km/h", label: "Q400 Speed" },
|
|
];
|
|
|
|
const FEATURES: EVFeature[] = [
|
|
{
|
|
icon: (
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
|
|
<path d="M22 12h-6l-4-9-2 1 3 8H5l-2-3-1.5.6L3 14l1.5 4.4L6 18l-2-3h8l3 8 2-1-3-8h6z" />
|
|
</svg>
|
|
),
|
|
title: "Dedicated Freighter Capacity",
|
|
desc: "Purpose-built cargo lift, not passenger-belly space competing with baggage.",
|
|
},
|
|
{
|
|
icon: (
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
|
|
<circle cx="6" cy="6" r="2.5" />
|
|
<circle cx="18" cy="6" r="2.5" />
|
|
<circle cx="12" cy="18" r="2.5" />
|
|
<path d="M8.2 7.2 10 16M15.8 7.2 14 16M8.5 6h7" />
|
|
</svg>
|
|
),
|
|
title: "Regional Route Design",
|
|
desc: "Turboprop range and speed matched to India's major regional-capital corridors.",
|
|
},
|
|
{
|
|
icon: (
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
|
|
<path d="M3 3v18h18" />
|
|
<path d="M7 14l4-4 3 3 6-7" />
|
|
</svg>
|
|
),
|
|
title: "Scaling to 25 Aircraft",
|
|
desc: "Phase 2 vision: pan-India connectivity hubs and international regional routes.",
|
|
},
|
|
];
|
|
|
|
export default function WingsFleetStrategy() {
|
|
return (
|
|
<div id="wings-fleet">
|
|
{/* EVSection is shared across other pages (Workflow1/Workflow2 etc.),
|
|
so its own .evnd-gap-bottom rule isn't touched — this override is
|
|
scoped to #wings-fleet only, and reduces just the blank margin
|
|
immediately before Infrastructure by ~42% (24px -> 14px) on
|
|
mobile, matching the site's tighter mobile rhythm elsewhere. */}
|
|
<style
|
|
dangerouslySetInnerHTML={{
|
|
__html: `
|
|
@media (max-width: 767px) {
|
|
#wings-fleet .evnd-gap-bottom { margin-bottom: 14px !important; }
|
|
}
|
|
`,
|
|
}}
|
|
/>
|
|
<EVSection
|
|
bannerImage="/images/pahse1.png"
|
|
cardNumber="Phase 1"
|
|
cardTitle="Initial Fleet"
|
|
cardSubtitle="2x ATR72 + 1x Q400 Freighters"
|
|
eyebrow="/ Fleet Strategy /"
|
|
titleLead="Purpose-Built for "
|
|
titleAccent="Regional Speed"
|
|
features={FEATURES}
|
|
metrics={METRICS}
|
|
cardsHeading="FLEET SPECIFICATIONS"
|
|
cardsTheme={{ accent: "#c8102e", accent2: "#ff6a3d", glow: "rgba(200,16,46,0.22)" }}
|
|
gapTop
|
|
gapBottom
|
|
badges={[
|
|
{ value: "3", label: "Phase 1 Aircraft" },
|
|
{ value: "25", label: "Phase 2 Vision" },
|
|
]}
|
|
mediaSlot={
|
|
<video
|
|
autoPlay
|
|
loop
|
|
muted
|
|
playsInline
|
|
style={{
|
|
width: "100%",
|
|
height: "100%",
|
|
minHeight: 420,
|
|
objectFit: "cover",
|
|
display: "block",
|
|
background: "#17171b"
|
|
}}
|
|
>
|
|
<source src="/videos/fleet.mp4" type="video/mp4" />
|
|
</video>
|
|
}
|
|
ariaLabel="Doormile Wings fleet strategy"
|
|
/>
|
|
</div>
|
|
);
|
|
}
|