diff --git a/docusaurus.config.js b/docusaurus.config.js index 48c3e0f..46733f8 100644 --- a/docusaurus.config.js +++ b/docusaurus.config.js @@ -248,28 +248,11 @@ const config = { className: "margin-left--md", }, items: [ - { - type: "dropdown", - to: "/ai-testing-agents", - label: "Solutions", - position: "left", - items: [ - { to: "/ai-testing-agents", label: "AI Agents for Software Testing" }, - { to: "/ai-testing", label: "AI Testing" }, - { to: "/visual-testing", label: "Visual Regression Testing" }, - { to: "/mcp", label: "MCP Server" }, - { - to: "blog/playwright-bot-ai-powered-test-automation", - label: "Playwright AI Bot (preview)", - }, - ], - }, { to: "/pricing", label: "Pricing", position: "left" }, - { to: "/blog", label: "Blog", position: "left" }, { to: "https://cmd.wopee.io/login", target: "_blank", - label: "Sign In", + label: "Log in", position: "right", className: "margin-right--md", id: "login-button", diff --git a/src/css/custom.css b/src/css/custom.css index 7f1a476..a6c907d 100644 --- a/src/css/custom.css +++ b/src/css/custom.css @@ -264,6 +264,20 @@ a.navbar__item:hover { filter: invert(1); } +/* Homepage: navbar hidden at top, slides in on scroll (toggled in index.tsx). */ +body.is-home .navbar { + position: fixed; + top: 0; + left: 0; + right: 0; + transform: translateY(-100%); + transition: transform 0.3s ease; + will-change: transform; +} +body.is-home .navbar.navbar--revealed { + transform: translateY(0); +} + /* Hero primary CTA — slow pulsing glow when enabled, invites the click without ever animating loud enough to feel pushy. Disabled state stays still. Pulse colour matches the button fill in each theme. */ diff --git a/src/pages/index.tsx b/src/pages/index.tsx index b6f0df2..626c0e4 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -1,4 +1,4 @@ -import React from "react"; +import React, { useEffect } from "react"; import Layout from "@theme/Layout"; import Head from "@docusaurus/Head"; @@ -60,6 +60,20 @@ const JSONLD_APP = { }; export default function Home(): JSX.Element { + // Homepage navbar reveals on scroll; styles in custom.css. + useEffect(() => { + const navbar = document.querySelector(".navbar"); + if (!navbar) return; + const sync = () => + navbar.classList.toggle("navbar--revealed", window.scrollY > 8); + sync(); + window.addEventListener("scroll", sync, { passive: true }); + return () => { + window.removeEventListener("scroll", sync); + navbar.classList.remove("navbar--revealed"); + }; + }, []); + return (