From 83cae163193bf6da3c896334968804ebfd4f8607 Mon Sep 17 00:00:00 2001 From: Arunavo Ray Date: Fri, 5 Dec 2025 22:11:48 +0530 Subject: [PATCH] added promo banner for Lumical --- www/src/components/Header.tsx | 9 ++++-- www/src/components/PromoBanner.tsx | 51 ++++++++++++++++++++++++++++++ www/src/pages/index.astro | 2 ++ www/src/styles/global.css | 1 + 4 files changed, 60 insertions(+), 3 deletions(-) create mode 100644 www/src/components/PromoBanner.tsx diff --git a/www/src/components/Header.tsx b/www/src/components/Header.tsx index fa680d7..2eabc4b 100644 --- a/www/src/components/Header.tsx +++ b/www/src/components/Header.tsx @@ -22,9 +22,12 @@ export function Header() { ]; return ( -
+
{/* Logo */} diff --git a/www/src/components/PromoBanner.tsx b/www/src/components/PromoBanner.tsx new file mode 100644 index 0000000..d332ae5 --- /dev/null +++ b/www/src/components/PromoBanner.tsx @@ -0,0 +1,51 @@ +import React, { useEffect, useRef } from 'react'; +import { Calendar, Sparkles } from 'lucide-react'; + +export function PromoBanner() { + const bannerRef = useRef(null); + + useEffect(() => { + // Update CSS custom property for header offset + const updateOffset = () => { + if (bannerRef.current) { + const height = bannerRef.current.offsetHeight; + document.documentElement.style.setProperty('--promo-banner-height', `${height}px`); + } + }; + + updateOffset(); + window.addEventListener('resize', updateOffset); + return () => window.removeEventListener('resize', updateOffset); + }, []); + + return ( + + ); +} diff --git a/www/src/pages/index.astro b/www/src/pages/index.astro index 78d551f..3b4656d 100644 --- a/www/src/pages/index.astro +++ b/www/src/pages/index.astro @@ -10,6 +10,7 @@ import { Installation } from '../components/Installation'; import { CTA } from '../components/CTA'; import FAQ from '../components/FAQ.astro'; import Footer from '../components/Footer.astro'; +import { PromoBanner } from '../components/PromoBanner'; const siteUrl = 'https://gitea-mirror.com'; const title = 'GitHub Backup Tool | Self-Hosted Repository Backup to Gitea'; @@ -119,6 +120,7 @@ const structuredData = { +
diff --git a/www/src/styles/global.css b/www/src/styles/global.css index 4e6cf6d..7cf9c41 100644 --- a/www/src/styles/global.css +++ b/www/src/styles/global.css @@ -49,6 +49,7 @@ :root { --radius: 0.5rem; + --promo-banner-height: 0px; --background: oklch(0.99 0 0); --foreground: oklch(0.15 0 0); --card: oklch(0.985 0 0);