docs(home): add dynamic banner (#658)

adds dynamic themed banner to home task: none
omni-network · Mar 26, 2024 · 45c4c04 · 45c4c04
1 parent 511ccf4
commit 45c4c04
Show file tree

Hide file tree

Showing 4 changed files with 21 additions and 2 deletions.
diff --git a/docs/site/docs/home.md b/docs/site/docs/home.md
@@ -6,10 +6,17 @@ slug: /
 ---
 
 import TestnetCTA from '@site/src/components/TestnetCTA/TestnetCTA';
+import ThemedBanner from '@site/src/components/ThemedBanner/ThemedBanner';
 
-# Home
+#
 
-![omni banner](../static/img/omni-banner.png)
+<ThemedBanner
+  lightSrc="/img/light-banner.png"
+  darkSrc="/img/dark-banner.png"
+  alt="Omni banner"
+/>
+
+#
 
 ### _Welcome to the documentation portal for all things Omni!_
 

diff --git a/docs/site/src/components/ThemedBanner/ThemedBanner.tsx b/docs/site/src/components/ThemedBanner/ThemedBanner.tsx
@@ -0,0 +1,12 @@
+import React from 'react';
+import { useColorMode } from '@docusaurus/theme-common';
+
+
+function ThemedImage({ lightSrc, darkSrc, alt }) {
+    const { colorMode } = useColorMode();
+    const src = colorMode === 'dark' ? darkSrc : lightSrc;
+
+    return <img src={src} alt={alt} />;
+}
+
+export default ThemedImage;
diff --git a/docs/site/static/img/dark-banner.png b/docs/site/static/img/dark-banner.png
diff --git a/docs/site/static/img/light-banner.png b/docs/site/static/img/light-banner.png