[Smart Accounts Kit] Add announcement bar

docusaurus.config.js

@@ -483,6 +483,13 @@ const config = {
   themeConfig:
     /** @type {import('@docusaurus/preset-classic').ThemeConfig} */
     ({
+      announcementBar: {
+        id: 'delegation-toolkit-rename-announcement-bar',
+        content: 'Delegation Toolkit is now renamed to Smart Accounts Kit.',
+        backgroundColor: '#eac2ff',
+        textColor: '#0a0a0a',
+        isCloseable: false,
+      },
       metadata: [
         {
           name: 'keywords',

src/theme/AnnouncementBar/index.tsx

@@ -0,0 +1,24 @@
+import React from 'react'
+import { useLocation } from '@docusaurus/router'
+
+export default function AnnouncementBar(): JSX.Element | null {
+  const location = useLocation()
+
+  // Show on smart-accounts-kit paths or main/homepage
+  const isSmartAccountsKitPath = location.pathname.includes('/smart-accounts-kit')
+  const isMainPath = location.pathname === '/'
+
+  const isValidPath = isSmartAccountsKitPath || isMainPath
+
+  if (!isValidPath) {
+    return null
+  }
+
+  return (
+    <div className="theme-announcement-bar" role="banner" data-announcement-bar="true">
+      <div style={{ textAlign: 'center' }}>
+        <strong>Delegation Toolkit is now renamed to Smart Accounts Kit.</strong>
+      </div>
+    </div>
+  )
+}