diff --git a/frontend/app/page.tsx b/frontend/app/page.tsx
index 0971a85..4364969 100644
--- a/frontend/app/page.tsx
+++ b/frontend/app/page.tsx
@@ -1,5 +1,6 @@
import { BlockStateTracker } from '@/components/block-state-tracker'
import { BlockTimeExecutionTracker } from '@/components/block-time-tracker'
+import { BlogBanner } from '@/components/common/blog-banner'
import { PageHeader } from '@/components/common/page-header'
import { SectionSeparator } from '@/components/common/section-separator'
import { HotAccountsBubbleMap } from '@/components/hot-accounts-bubble-map'
@@ -11,6 +12,7 @@ import { CornerDecorationsContainer } from '@/components/ui/corner-decorations-c
export default function Home() {
return (
+
{/* Sections container with continuous left/right borders */}
diff --git a/frontend/components/common/blog-banner.tsx b/frontend/components/common/blog-banner.tsx
new file mode 100644
index 0000000..cdb815e
--- /dev/null
+++ b/frontend/components/common/blog-banner.tsx
@@ -0,0 +1,40 @@
+'use client'
+
+import { X } from 'lucide-react'
+import { useState } from 'react'
+import { Button } from '@/components/ui/button'
+import { ExternalLink } from '@/components/ui/external-link'
+
+const BLOG_POST_URL = 'https://blog.monad.xyz/blog/execution-events-sdk'
+
+export function BlogBanner() {
+ const [isVisible, setIsVisible] = useState(true)
+
+ if (!isVisible) return null
+
+ return (
+
+
+
+ Built with the Monad Execution Events SDK. Read the blog post{' '}
+
+ here
+
+ .
+
+
+
+
+ )
+}
diff --git a/frontend/components/ui/button.tsx b/frontend/components/ui/button.tsx
index 80bbbb7..d7b56d3 100644
--- a/frontend/components/ui/button.tsx
+++ b/frontend/components/ui/button.tsx
@@ -9,6 +9,7 @@ const buttonVariants = cva(
variant: {
primary: 'rounded-md text-white btn-primary',
secondary: 'rounded-md text-white btn-secondary',
+ ghost: 'bg-transparent hover:opacity-70 rounded',
},
size: {
default: 'h-9 px-4 py-2',