From 8e049189f7b11697be50997656603f2978c02604 Mon Sep 17 00:00:00 2001 From: "hezheng.lsw" Date: Wed, 1 Jul 2026 19:09:42 +0800 Subject: [PATCH] feat: update brand assets (#257) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * feat(pages): redesign landing page UI with i18n support - Redesign all sections based on design file: Navbar, Hero, Highlights, UseCases, Features, Benchmark, QuickStart, Footer - Add scroll fade-in animation with IntersectionObserver - Implement full i18n (English/Chinese) with language toggle button - Add SVG icons and image assets - Style refinements: table borders, step containers, button styles, spacing * feat(pages): redesign Docs page with i18n, responsive sidebar, and aligned copy interaction - Redesign DocsPage UI based on reference HTML design - Add i18n support for all Docs content (en/zh/ja) - Fix right sidebar CONTENTS nav with fixed positioning - Add container backgrounds (4% opacity, 16% border) - Hide CONTENTS sidebar on mobile instead of alternative UI - Align copy icon and toast interaction with QuickStart section - Add new SVG icon assets for docs page - Add Japanese language support - Add ColorBends animated background component - Add responsive hooks and FadeInSection animation - Add Benchmark, Features, QuickStart standalone pages - Update Navbar, Footer, and LandingPage components * refactor: cleanup design drafts, rename Chinese assets, UI improvements - Remove unused design draft folders (html-files, html-files (1), inpt, doc) - Rename Chinese-named image files (容器-4_*.svg → provider-*.svg) - Add language switcher icon to Navbar with dynamic character display - Align Footer padding with Navbar (32px desktop, 16px mobile) - Fix CONTENTS sidebar position on wide screens - Add i18n support for Docs CONTENTS title - Fix clipboard copy fallback for HTTP/LAN environments - Adjust Toast padding, benchmark medal sizes - Swap highlight stats positions (Adoption Rate ↔ Active Users) - Update stat4 value to 25.10% and stat5 caption to Battle-tested - Unify Hero buttons size with Navbar Get Started button * refactor: rename icon assets with semantic English names and cleanup unused files - Rename all svg_*.svg icons to semantic names based on usage context: - icon-feature-*.svg for feature section icons - icon-usecase-*.svg for use case section icons - icon-chevron-*.svg, icon-copy.svg, icon-play.svg for UI controls - icon-github.svg, icon-language.svg, icon-sort.svg, icon-terminal-prompt.svg - Remove unused assets: 5 unreferenced svg icons, image_9e7821.png, provider-8.svg - Remove debug screenshots: debug-screenshot.png, debug-wide.png - Remove .vsix build artifact and add *.vsix to .gitignore - Update all import paths in components accordingly * fix: address PR review feedback - bugs and improvements - Fix copy-paste bug: step3Label1 had wrong text in all 3 languages - en: 'Interactive Setup (Recommended)' → 'Review Commands' - zh: '交互式设置（推荐）' → '运行审查命令' - ja: '対話式セットアップ（推奨）' → 'レビュー実行' - Fix inconsistent indentation (4 spaces → 2 spaces) in i18n files - Add .catch() handler for navigator.clipboard.writeText() in QuickStartSection - Check document.execCommand('copy') return value before showing toast - Extract fallbackCopy helper to deduplicate clipboard logic - Remove unused useCallback import from HighlightsSection - Move @types/three from dependencies to devDependencies - Add i18n key 'hero.terminal' for hardcoded Terminal label * fix: revert vscode .gitignore change and remove duplicate root SVGs - Revert extensions/vscode/.gitignore to upstream state (remove *.vsix rule) - Remove root-level brandicon.svg, claude code icon.svg, codex icon.svg (identical copies already exist in pages/src/assets/images/ with proper names) * fix: reorder highlights stats to match design reference - Reorder stats: 20K+ Active Users → > 30% Adoption Rate → 1M+ Tasks → 1/9 Token Cost → 25.10% AACR-BENCH - Update stat1 value from 30K+ to 20K+ - Sync all three languages (en/zh/ja) * chore: remove unused debug screenshots * chore: remove unused image_9e7821.png * feat(pages): consolidate icons, add scroll-to-top, responsive titles - Merge provider-1~7.svg into single icon-ocr-source.svg - Add ScrollToTop component for tab navigation reset - Add tablet breakpoint (36px) to section titles for responsive scaling * refactor(pages): extract shared responsive title hook, fix indentation - Create useSectionTitleStyle hook to eliminate nested ternaries - Replace duplicated responsive logic in 4 section components - Fix fragment children indentation in App.tsx Addresses code review feedback from PR #241 * feat(pages): add install badge with shimmer effect and copy functionality - Add install badge above hero title with download/copy icons - Implement text shimmer animation (left-to-right, 5s cycle) - Add clipboard copy with secure context check and fallback - Set download icon color to #2bde5e - Set badge background to rgba(0,0,0,0.8) - Fix mobile responsive width for badge * fix(pages): address PR #254 code review feedback - Add prefers-reduced-motion media query for shimmer animation - Extract install command to INSTALL_CMD constant (DRY) - Use t() i18n function for toast messages (hero.copied/hero.copyFailed) - Show error feedback when copy operation fails - Refactor handleCopy to use async/await instead of .then/.catch * fix(pages): align hero install badge toast style with QuickStart section - Use consistent toast visual: rgba(255,255,255,0.1) bg, 0.2 border, 0.85 text - Match padding (5px 14px), borderRadius (6px), fontSize (12px) - Position at top: 88px (below navbar) * fix(pages): separate green download icon for hero badge, restore docs icon - Restore doc-download.svg to original white (#FFFFFF, opacity 0.8) for Docs page - Create doc-download-green.svg (#2bde5e) for Hero install badge - Update HeroSection import to use green variant * fix(pages): restore doc-download.svg to white for Docs page - Restore doc-download.svg fill to #FFFFFF with opacity 0.8 - Hero badge uses separate doc-download-green.svg (#2bde5e) * feat: update brand assets - replace navbar logo, favicon and logo-core.svg * feat(docs): replace icons with semantic @agentscope-ai/icons components - Branch Diff → SparkContrastView2Line (comparison) - Single Commit → SparkHistoryLine (history) - Requirement Context → SparkDocumentLine (document) - JSON Output → SparkCode02Line (code format) - Agent Mode → SparkAgentLine (agent) - Preview → SparkVisibleLine (visibility) - Scan → SparkScanLine (scan) - Scan Path → SparkTargetLine (target) - Scan File → SparkFileCodeLine (code file) * refactor: replace logo.svg content directly instead of adding favicon.svg Remove redundant favicon.svg, update logo.svg with new brand icon content. No reference changes needed in index.html. * fix: simplify logo-core.svg for GitHub README rendering Remove mask, clipPath and mix-blend-mode that are not supported by GitHub's SVG sanitizer, causing the icon to be invisible. --- imgs/logo-core.svg | 2 +- pages/logo.svg | 2 +- pages/package.json | 1 + pages/src/assets/images/brandicon.svg | 2 +- pages/src/pages/DocsPage.tsx | 42 +++++++++++++++++++-------- 5 files changed, 34 insertions(+), 15 deletions(-) diff --git a/imgs/logo-core.svg b/imgs/logo-core.svg index 85db915..52b0b6b 100644 --- a/imgs/logo-core.svg +++ b/imgs/logo-core.svg @@ -1 +1 @@ - \ No newline at end of file + diff --git a/pages/logo.svg b/pages/logo.svg index 689d9fb..fc5087b 100644 --- a/pages/logo.svg +++ b/pages/logo.svg @@ -1 +1 @@ - \ No newline at end of file + diff --git a/pages/package.json b/pages/package.json index f6a0775..c2ce253 100644 --- a/pages/package.json +++ b/pages/package.json @@ -8,6 +8,7 @@ "typecheck": "tsc --noEmit" }, "dependencies": { + "@agentscope-ai/icons": "^1.0.68", "react": "^18.2.0", "react-dom": "^18.2.0", "react-router-dom": "^6.8.0", diff --git a/pages/src/assets/images/brandicon.svg b/pages/src/assets/images/brandicon.svg index d4fe70e..fd20f4c 100644 --- a/pages/src/assets/images/brandicon.svg +++ b/pages/src/assets/images/brandicon.svg @@ -1 +1 @@ - \ No newline at end of file + diff --git a/pages/src/pages/DocsPage.tsx b/pages/src/pages/DocsPage.tsx index 3029323..c7cd1e9 100644 --- a/pages/src/pages/DocsPage.tsx +++ b/pages/src/pages/DocsPage.tsx @@ -8,6 +8,17 @@ import docDownloadIcon from '../assets/icons/doc-download.svg'; import docCheckCircleIcon from '../assets/icons/doc-check-circle.svg'; import docEditIcon from '../assets/icons/doc-edit.svg'; import docContentsIcon from '../assets/icons/doc-contents.svg'; +import { + SparkContrastView2Line, + SparkHistoryLine, + SparkDocumentLine, + SparkCode02Line, + SparkAgentLine, + SparkVisibleLine, + SparkScanLine, + SparkTargetLine, + SparkFileCodeLine, +} from '@agentscope-ai/icons'; /* Toast - same as QuickStartSection */ const Toast: React.FC<{ message: string; visible: boolean }> = ({ message, visible }) => @@ -87,6 +98,13 @@ const IconBox: React.FC<{ icon: string }> = ({ icon }) => ( ); +/* ─── Spark Icon box (same style, wraps React icon component) ─── */ +const SparkIconBox: React.FC<{ children: React.ReactNode }> = ({ children }) => ( +
+ {children} +
+); + const DocsPage: React.FC = () => { const [activeSection, setActiveSection] = useState('overview'); const [toastVisible, setToastVisible] = useState(false); @@ -306,7 +324,7 @@ const DocsPage: React.FC = () => { {/* Branch Diff Mode */}
- +
{t('docs.reviewBranch')}

{t('docs.reviewBranchDesc')}

@@ -317,7 +335,7 @@ const DocsPage: React.FC = () => { {/* Single Commit Mode */}
- +
{t('docs.reviewCommit')}

{t('docs.reviewCommitDesc')}

@@ -330,7 +348,7 @@ const DocsPage: React.FC = () => { {/* Review with Requirement Context */}
- +
{t('docs.reviewBackground')}

{t('docs.reviewBackgroundDesc')}

@@ -341,7 +359,7 @@ const DocsPage: React.FC = () => { {/* JSON Output */}
- +
{t('docs.reviewJson')}

{t('docs.reviewJsonDesc')}

@@ -352,7 +370,7 @@ const DocsPage: React.FC = () => { {/* Agent Mode */}
- +
{t('docs.reviewAgent')}

{t('docs.reviewAgentDesc')}

@@ -363,7 +381,7 @@ const DocsPage: React.FC = () => { {/* Dry-Run Preview */}
- +
{t('docs.reviewPreviewLabel')}

{t('docs.reviewPreviewDesc')}

@@ -420,7 +438,7 @@ const DocsPage: React.FC = () => {

{t('docs.scanVsTitle')}

- +
{t('docs.scanVsReviewLabel')}

{t('docs.scanVsReview').replace(/<\/?code>/g, '')}

@@ -429,7 +447,7 @@ const DocsPage: React.FC = () => {
- +
{t('docs.scanVsScanLabel')}

{t('docs.scanVsScan').replace(/<\/?code>/g, '')}

@@ -440,7 +458,7 @@ const DocsPage: React.FC = () => {

{t('docs.scanUsage')}

- +
{t('docs.scanUsageWhole')}

{t('docs.scanUsageWholeDesc')}

@@ -450,7 +468,7 @@ const DocsPage: React.FC = () => {
- +
{t('docs.scanUsagePath')}

{t('docs.scanUsagePathDesc')}

@@ -460,7 +478,7 @@ const DocsPage: React.FC = () => {
- +
{t('docs.scanUsageFile')}

{t('docs.scanUsageFileDesc')}

@@ -470,7 +488,7 @@ const DocsPage: React.FC = () => {
- +
{t('docs.scanUsagePreviewLabel')}

{t('docs.scanUsagePreviewDesc')}