diff --git a/docs/index.mdx b/docs/index.mdx index 9dcffc27..85d793dc 100644 --- a/docs/index.mdx +++ b/docs/index.mdx @@ -9,8 +9,13 @@ keywords: - AI pair programmer - code generation - documentation + - OpenClaw --- +import { OpenClawPromo } from '@site/src/components/OpenClawPromo'; + + + # Roo Code Docs Roo Code is an AI-coding suite of products designed to take full advantage of the most advanced large-language models and change how you create software at a fundamental level. It's unapologetically powerful and customizable, and it costs more to run than the alternatives because it uses frontier models with actual file system access, terminal control, and multi-step workflows. diff --git a/src/components/OpenClawPromo/index.tsx b/src/components/OpenClawPromo/index.tsx new file mode 100644 index 00000000..aaa5d029 --- /dev/null +++ b/src/components/OpenClawPromo/index.tsx @@ -0,0 +1,110 @@ +import React, { useState, useEffect } from 'react'; +import styles from './styles.module.css'; + +// Change this key when updating the promo to show it again to users who dismissed it +const OPENCLAW_PROMO_DISMISSED_KEY = 'openclaw-promo-dismissed-v1'; + +export function OpenClawPromo(): React.ReactElement | null { + const [isVisible, setIsVisible] = useState(false); + + useEffect(() => { + // Check localStorage to see if promo was dismissed + const isDismissed = localStorage.getItem(OPENCLAW_PROMO_DISMISSED_KEY); + if (!isDismissed) { + setIsVisible(true); + } + }, []); + + const handleDismiss = () => { + setIsVisible(false); + localStorage.setItem(OPENCLAW_PROMO_DISMISSED_KEY, 'true'); + }; + + if (!isVisible) { + return null; + } + + return ( +
+ {/* Animated background elements */} +