Doormile/doormile_react
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

update blog page issue

Browse Source
This commit is contained in:
Aravind R
2026-06-12 14:55:29 +05:30
parent f412b9f71e
commit ba34c80761
16 changed files with 405 additions and 239 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/sections/BlogGrid.tsx
View File

@@ -82,7 +82,7 @@ export default function BlogGrid() {
font-family: var(--font-manrope), sans-serif !important;
}
/* Bottom block pinned to the card base — keeps Read More + image at the
/* Bottom block pinned to the card base. Keeps Read More + image at the
same vertical position across cards with different text lengths. */
.custom-blog-bottom {
display: flex !important;

43
src/components/sections/ConnectedLogistics.tsx
View File

@@ -33,6 +33,25 @@ export default function ConnectedLogistics() {
max-width: min(526px, 100%) !important;
}
/* Sizing and identical padding on all 4 sides for Connected Logistics Image container */
.elementor-element-99768ba .elementor-widget-container {
display: flex !important;
justify-content: center !important;
align-items: center !important;
padding: 40px !important; /* Identical gap on left, right, top, and bottom */
box-sizing: border-box !important;
}
.elementor-element-99768ba img.wp-image-4481 {
width: 100% !important;
max-width: 100% !important; /* Allow natural responsive scaling on desktop */
height: auto !important;
object-fit: cover !important;
border-radius: 25px !important; /* Preserve 25px border radius */
margin: 0 auto !important;
display: block !important;
}
/* Desktop/Laptop (min-width: 1025px) column width and flex rules */
@media (min-width: 1025px) {
.elementor-element-9ffed33 {
@@ -78,6 +97,30 @@ export default function ConnectedLogistics() {
width: 100% !important;
max-width: 100% !important;
}
/* Tablet overrides: ~15% smaller than site.css's 450px with centered layout */
.elementor-element-99768ba .elementor-widget-container {
padding: 30px !important;
}
.elementor-element.elementor-element-99768ba .elementor-widget-container img.wp-image-4481 {
width: 100% !important;
max-width: 382px !important;
border-radius: 25px !important; /* Explicitly keep 25px */
}
}
@media (max-width: 767px) {
/* Mobile overrides: ~15% smaller than site.css's 90% with 10% identical padding on all 4 sides */
.elementor-element-99768ba .elementor-widget-container {
padding: 10% !important;
}
.elementor-element.elementor-element-99768ba .elementor-widget-container img.wp-image-4481 {
width: 100% !important;
max-width: 100% !important;
border-radius: 25px !important; /* Explicitly keep 25px */
}
}
`}} />
<div className="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="{&quot;background_background&quot;:&quot;classic&quot;}">

20
src/components/sections/IntelligenceGrid.tsx
View File

@@ -15,7 +15,7 @@ const ROADMAP_DATA = [
trackLeft: "12.5%",
phase: "Pilot Phase",
phaseClass: "yellow",
title: "Hyderabad Pilot",
title: "Pilot",
desc: "Launch operations in Hyderabad with dedicated EV hubs and MileTruth AI v1.0.",
icon: (
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5" strokeLinecap="round" strokeLinejoin="round">
@@ -25,7 +25,7 @@ const ROADMAP_DATA = [
</svg>
),
stats: [
{ text: "50-80 orders/day", icon: <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect><line x1="16" y1="2" x2="16" y2="6"></line><line x1="8" y1="2" x2="8" y2="6"></line><line x1="3" y1="10" x2="21" y2="10"></line></svg> },
{ text: "100+ orders/day", icon: <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect><line x1="16" y1="2" x2="16" y2="6"></line><line x1="8" y1="2" x2="8" y2="6"></line><line x1="3" y1="10" x2="21" y2="10"></line></svg> },
{ text: "1 city", icon: <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5"><path d="M3 21h18M19 21v-2a4 4 0 0 0-3-3.87M5 21v-2a4 4 0 0 1 3-3.87M9 21v-5a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2v5"></path></svg> },
{ text: "10+ women partners", icon: <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5"><path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path><circle cx="9" cy="7" r="4"></circle></svg> }
]
@@ -36,7 +36,7 @@ const ROADMAP_DATA = [
trackLeft: "37.5%",
phase: "Multi-City",
phaseClass: "green",
title: "Multi-City Scale",
title: "Scale",
desc: "Expand to Bengaluru and Chennai, securing key B2B enterprise traction.",
icon: (
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5">
@@ -46,7 +46,7 @@ const ROADMAP_DATA = [
</svg>
),
stats: [
{ text: "300-500 orders/day", icon: <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect><line x1="16" y1="2" x2="16" y2="6"></line><line x1="8" y1="2" x2="8" y2="6"></line><line x1="3" y1="10" x2="21" y2="10"></line></svg> },
{ text: "500+ orders/day", icon: <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect><line x1="16" y1="2" x2="16" y2="6"></line><line x1="8" y1="2" x2="8" y2="6"></line><line x1="3" y1="10" x2="21" y2="10"></line></svg> },
{ text: "3 cities", icon: <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5"><path d="M3 21h18M19 21v-2a4 4 0 0 0-3-3.87M5 21v-2a4 4 0 0 1 3-3.87M9 21v-5a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2v5"></path></svg> },
{ text: "50+ EVs", icon: <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5"><polygon points="13 2 3 14 12 14 11 22 21 10 12 10 13 2"></polygon></svg> }
]
@@ -57,8 +57,8 @@ const ROADMAP_DATA = [
trackLeft: "62.5%",
phase: "Platform",
phaseClass: "blue",
title: "Platform Expansion",
desc: "Scale to 5+ cities. Launch developer API marketplace and Series A readiness.",
title: "Expansion",
desc: "Scale to 5+ cities. Strengthen regional operations.",
icon: (
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5">
<circle cx="12" cy="12" r="3"></circle>
@@ -66,9 +66,9 @@ const ROADMAP_DATA = [
</svg>
),
stats: [
{ text: "1,200+ orders/day", icon: <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect><line x1="16" y1="2" x2="16" y2="6"></line><line x1="8" y1="2" x2="8" y2="6"></line><line x1="3" y1="10" x2="21" y2="10"></line></svg> },
{ text: "5000+ orders/day", icon: <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect><line x1="16" y1="2" x2="16" y2="6"></line><line x1="8" y1="2" x2="8" y2="6"></line><line x1="3" y1="10" x2="21" y2="10"></line></svg> },
{ text: "5+ cities", icon: <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5"><path d="M3 21h18M19 21v-2a4 4 0 0 0-3-3.87M5 21v-2a4 4 0 0 1 3-3.87M9 21v-5a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2v5"></path></svg> },
{ text: "API marketplace", icon: <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5"><polyline points="16 18 22 12 16 6"></polyline><polyline points="8 6 2 12 8 18"></polyline></svg> }
{ text: "100+ women partners", icon: <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5"><polyline points="16 18 22 12 16 6"></polyline><polyline points="8 6 2 12 8 18"></polyline></svg> }
]
},
{
@@ -86,8 +86,8 @@ const ROADMAP_DATA = [
</svg>
),
stats: [
{ text: "5,000+ orders/day", icon: <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect><line x1="16" y1="2" x2="16" y2="6"></line><line x1="8" y1="2" x2="8" y2="6"></line><line x1="3" y1="10" x2="21" y2="10"></line></svg> },
{ text: "Rs 65 Cr+ revenue", icon: <span className="currency-symbol" style={{ marginRight: "4px", fontSize: "11px", fontWeight: 800 }}>Rs</span> },
{ text: "50,000+ orders/day", icon: <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect><line x1="16" y1="2" x2="16" y2="6"></line><line x1="8" y1="2" x2="8" y2="6"></line><line x1="3" y1="10" x2="21" y2="10"></line></svg> },
{ text: "50+ cities", icon: <span className="currency-symbol" style={{ marginRight: "4px", fontSize: "11px", fontWeight: 800 }}>Rs</span> },
{ text: "2,000+ women partners", icon: <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5"><path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path><circle cx="9" cy="7" r="4"></circle><path d="M23 21v-2a4 4 0 0 0-3-3.87"></path><path d="M16 3.13a4 4 0 0 1 0 7.75"></path></svg> }
]
}

10
src/components/sections/SingleBlog.tsx
View File

@@ -38,7 +38,7 @@ function ContentRenderer({ block }: { block: ContentBlock }) {
return (
<blockquote className="dm-article-quote">
<p>{block.text}</p>
{block.cite && <cite>— {block.cite}</cite>}
{block.cite && <cite>{block.cite}</cite>}
</blockquote>
);
case "image":
@@ -168,7 +168,7 @@ const STYLES = `
font-family: var(--font-manrope), sans-serif;
}
/* Heading normalization — beat the global theme's .elementor-kit-5 h1–h6
/* Heading normalization. Beat the global theme's .elementor-kit-5 h1-h6
(120/80/60px UPPERCASE) rules with !important on our own classes. */
.dm-single-blog :where(h1, h2, h3, h4, h5, h6) {
font-family: var(--font-manrope), sans-serif !important;
@@ -180,7 +180,7 @@ const STYLES = `
specificity 0-1-1) so blog links keep our colors and never get underlined. */
.dm-single-blog a { text-decoration: none !important; }
/* ── Page banner — tall (homepage-scale); only badge + title inside ── */
/* Page banner: tall homepage-scale frame with only badge + title inside */
/* Compound selector (specificity 20) + !important beats the global 800px
single-class height rules so the blog banner can use viewport heights. */
.custom-standard-hero-card.dm-banner-card {
@@ -216,7 +216,7 @@ const STYLES = `
@media (max-width: 1024px) { .dm-banner-title { font-size: clamp(32px, 6vw, 48px) !important; max-width: 90%; } }
@media (max-width: 600px) { .dm-banner-title { font-size: clamp(28px, 8vw, 38px) !important; max-width: 90%; } }
/* ── Content wrap — begins immediately below the banner ── */
/* Content wrap begins immediately below the banner */
/* Shared content container: the SAME max-width + horizontal padding is used
by BlogPostFooter (.dm-blog-footer-inner) so the article body, headings,
images, Prev/Next, Related Articles and the CTA banner all align to one
@@ -287,7 +287,7 @@ const STYLES = `
}
/* Each article block is wrapped in its OWN ScrollReveal <div>, so a bare
:first-child rule matched every heading (each is the only child of its
wrapper) and zeroed its top margin — collapsing the gap above every
wrapper) and zeroed its top margin, collapsing the gap above every
section heading. Scope the reset to only the article body's first block. */
.dm-article-body > :first-child :where(.dm-article-h2, .dm-article-h3),
.dm-article-body > .dm-article-h2:first-child,