fix(blog): resolve blog tags positioning issue conflicting with header

sayak-sarkar · sayak-sarkar · commit 947486de39e2 · 2025-06-30T19:30:41.000+05:30
- Replace margin-top with padding-top in hero section (pt-20 md:pt-24)
- Prevents blog category tags from appearing behind or conflicting with the ThinkRED logo
- Ensures proper spacing between fixed header and blog post hero content
- Fixes z-index and positioning conflicts in BlogPostPage
diff --git a/frontend/src/pages/BlogPostPage.tsx b/frontend/src/pages/BlogPostPage.tsx
@@ -140,7 +140,7 @@ const BlogPostPage = () => {
       {/* Hero Section */}
       <div
         ref={setHeroRef}
-        className="w-full md:mt-20 mt-14 h-96 bg-cover bg-center relative hero-background"
+        className="w-full pt-20 md:pt-24 h-96 bg-cover bg-center relative hero-background"
       >
         <div className="absolute inset-0 bg-black bg-opacity-50 flex items-end">
           <div className="container mx-auto px-4 py-16">

Original file line number	Diff line number	Diff line change
`@@ -140,7 +140,7 @@ const BlogPostPage = () => {`
`140`	`140`	`{/* Hero Section */}`
`141`	`141`	`<div`
`142`	`142`	`ref={setHeroRef}`
`143`		`- className="w-full md:mt-20 mt-14 h-96 bg-cover bg-center relative hero-background"`
	`143`	`+ className="w-full pt-20 md:pt-24 h-96 bg-cover bg-center relative hero-background"`
`144`	`144`	`>`
`145`	`145`	`<div className="absolute inset-0 bg-black bg-opacity-50 flex items-end">`
`146`	`146`	`<div className="container mx-auto px-4 py-16">`