From e235522c0db555590f1389fb4f6997f1514e38a3 Mon Sep 17 00:00:00 2001 From: mesalogo Date: Mon, 17 Aug 2026 01:05:46 +0800 Subject: [PATCH] feat: refresh product website experience MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The website previously buried platform downloads and presented the desktop assistant, Agent Runtime, and broader work capabilities with competing priorities. It now leads with the desktop assistant and AI programming workbench positioning, surfaces cross-platform and domestic Linux compatibility, and uses a responsive interactive product preview with synchronized tilt and soft lighting. Release note: GoodBuddy 官网现在更清晰地展示桌面助手、Agent Runtime、跨平台与国产化支持，并提供更直观的动态产品预览。 --- sites/README.md | 11 +- sites/app.js | 48 +++ sites/index.html | 459 +++++++++--------------- sites/scripts/validate.mjs | 31 +- sites/styles.css | 698 ++++++++++--------------------------- 5 files changed, 429 insertions(+), 818 deletions(-) diff --git a/sites/README.md b/sites/README.md index 8ba2664..252a325 100644 --- a/sites/README.md +++ b/sites/README.md @@ -4,6 +4,15 @@ 正式站点地址： +首页将 GoodBuddy 定位为“桌面助手｜AI 编程工具台”，优先展示三大桌面 +系统与双架构下载入口、统一 Agent Runtime，以及知识库、魔法笔记、 +智能心跳、桌面上下文和远程消息通道等桌面助手能力。下载区位于主要 +功能说明之前，并明确列出统信 UOS、银河麒麟、海光、兆芯、鲲鹏和飞腾 +对应的 Linux x64 / arm64 包。页面不重复设置底部下载推广区。 +首屏产品界面默认正面展示，在精确指针设备上使用克制的 3D 倾斜、 +柔和跟随光效和同步浮动标签；触屏设备保持静态布局，系统启用“减少动态 +效果”时不运行该交互。 + ## 部署 `.github/workflows/pages.yml` 会在 `main` 分支中的官网文件发生变化后， @@ -34,7 +43,7 @@ node --check sites/app.js ## 下载入口 -官网正文不展示具体版本号，所有下载入口直接指向 GitHub 最新正式 +官网正文不展示具体版本号，三个系统下载按钮直接指向 GitHub 最新正式 Release： ```text diff --git a/sites/app.js b/sites/app.js index 672b239..9a08416 100644 --- a/sites/app.js +++ b/sites/app.js @@ -7,7 +7,11 @@ const navigation = document.querySelector("[data-navigation]"); const themeToggle = document.querySelector("[data-theme-toggle]"); const themeColor = document.querySelector('meta[name="theme-color"]'); + const tiltStage = document.querySelector("[data-tilt-stage]"); + const tiltCard = tiltStage?.querySelector("[data-tilt-card]"); const systemTheme = window.matchMedia("(prefers-color-scheme: dark)"); + const finePointer = window.matchMedia("(hover: hover) and (pointer: fine)"); + const reducedMotion = window.matchMedia("(prefers-reduced-motion: reduce)"); const getSavedTheme = () => { try { @@ -90,6 +94,50 @@ window.addEventListener("scroll", setHeaderState, { passive: true }); + if (tiltStage instanceof HTMLElement && tiltCard instanceof HTMLElement) { + let tiltFrame = 0; + + const resetTilt = () => { + window.cancelAnimationFrame(tiltFrame); + tiltStage.classList.remove("is-tilting"); + tiltStage.style.setProperty("--spotlight-x", "50%"); + tiltStage.style.setProperty("--spotlight-y", "50%"); + tiltCard.style.setProperty("--spotlight-x", "50%"); + tiltCard.style.setProperty("--spotlight-y", "50%"); + tiltStage.style.setProperty("--scene-tilt-x", "0deg"); + tiltStage.style.setProperty("--scene-tilt-y", "0deg"); + }; + + const updateTilt = (event) => { + if (!finePointer.matches || reducedMotion.matches) { + resetTilt(); + return; + } + + const bounds = tiltStage.getBoundingClientRect(); + const x = Math.min(Math.max((event.clientX - bounds.left) / bounds.width, 0), 1); + const y = Math.min(Math.max((event.clientY - bounds.top) / bounds.height, 0), 1); + + window.cancelAnimationFrame(tiltFrame); + tiltFrame = window.requestAnimationFrame(() => { + const spotlightX = `${(x * 100).toFixed(1)}%`; + const spotlightY = `${(y * 100).toFixed(1)}%`; + tiltStage.classList.add("is-tilting"); + tiltStage.style.setProperty("--spotlight-x", spotlightX); + tiltStage.style.setProperty("--spotlight-y", spotlightY); + tiltCard.style.setProperty("--spotlight-x", spotlightX); + tiltCard.style.setProperty("--spotlight-y", spotlightY); + tiltStage.style.setProperty("--scene-tilt-x", `${((0.5 - y) * 8).toFixed(2)}deg`); + tiltStage.style.setProperty("--scene-tilt-y", `${((x - 0.5) * 11).toFixed(2)}deg`); + }); + }; + + tiltStage.addEventListener("pointermove", updateTilt, { passive: true }); + tiltStage.addEventListener("pointerleave", resetTilt); + finePointer.addEventListener("change", resetTilt); + reducedMotion.addEventListener("change", resetTilt); + } + const sections = [...document.querySelectorAll("main section[id]")]; const navLinks = [...document.querySelectorAll('.site-navigation a[href^="#"]')]; diff --git a/sites/index.html b/sites/index.html index 413cd15..a742c41 100644 --- a/sites/index.html +++ b/sites/index.html @@ -5,11 +5,11 @@ - GoodBuddy｜桌面 AI 助手 + GoodBuddy｜桌面助手与 AI 编程工具台