diff --git a/app/docs.css b/app/docs.css index 79c55f4..7e95afc 100644 --- a/app/docs.css +++ b/app/docs.css @@ -2,6 +2,80 @@ margin-top: 1.5rem; } +.home-entry-grid { + --home-entry-accent: #08f0a5; + --home-entry-border: #e1e5e3; + --home-entry-ink: #171b1a; + --home-entry-muted: #59635f; + display: grid; + grid-template-columns: repeat(2, minmax(0, 1fr)); + gap: 1rem; + margin: 1.25rem 0 2.5rem; +} + +.home-entry-card { + display: flex; + min-width: 0; + min-height: 12rem; + flex-direction: column; + padding: 1.25rem; + border: 1px solid var(--home-entry-border); + border-radius: 0.85rem; + background: #ffffff; + color: var(--home-entry-ink); + text-decoration: none; + transition: + border-color 140ms ease, + box-shadow 140ms ease, + transform 140ms ease; +} + +.home-entry-card:hover { + border-color: var(--home-entry-accent); + box-shadow: 0 0.75rem 2rem rgba(23, 27, 26, 0.08); + color: var(--home-entry-ink); + text-decoration: none; + transform: translateY(-2px); +} + +.home-entry-card:focus-visible { + outline: 2px solid var(--home-entry-accent); + outline-offset: 3px; +} + +.home-entry-index { + color: #68716e; + font-size: 0.75rem; + font-variant-numeric: tabular-nums; + font-weight: 700; + letter-spacing: 0.08em; +} + +.home-entry-title { + margin-top: 1.25rem; + color: var(--home-entry-ink); + font-size: 1.05rem; + line-height: 1.35; +} + +.home-entry-description { + margin-top: 0.625rem; + color: var(--home-entry-muted); + font-size: 0.95rem; + line-height: 1.55; +} + +.home-entry-action { + width: fit-content; + margin-top: auto; + padding-top: 1.25rem; + border-bottom: 1px solid currentColor; + color: var(--home-entry-ink); + font-size: 0.875rem; + font-weight: 700; + line-height: 1.35; +} + .token-allocation-table:focus-visible { border-radius: 0.25rem; outline: 2px solid currentColor; @@ -213,6 +287,14 @@ } @media (max-width: 40rem) { + .home-entry-grid { + grid-template-columns: minmax(0, 1fr); + } + + .home-entry-card { + min-height: 0; + } + .brand-kit-actions, .brand-kit-button { width: 100%; @@ -235,3 +317,13 @@ gap: 0.4rem; } } + +@media (prefers-reduced-motion: reduce) { + .home-entry-card { + transition: none; + } + + .home-entry-card:hover { + transform: none; + } +} diff --git a/content/en/changelog.mdx b/content/en/changelog.mdx index d736a8a..a5530e5 100644 --- a/content/en/changelog.mdx +++ b/content/en/changelog.mdx @@ -2,6 +2,11 @@ All notable changes to the X-Agent Litepaper and documentation are documented here. +## Homepage Navigation Refresh — September 8, 2026 + +- Redesigned the homepage entry cards with clearer title-first hierarchy, improved spacing, and more explicit navigation actions. +- Added responsive two-column and single-column layouts, visible keyboard focus, and synchronized English, Japanese, and Korean presentation. + ## Token Allocation Announcement — September 7, 2026 - Added a dedicated **Announcements** section for public information that may continue to evolve without repeatedly revising the Litepaper. diff --git a/content/en/index.mdx b/content/en/index.mdx index eb1fea9..68f4c8d 100644 --- a/content/en/index.mdx +++ b/content/en/index.mdx @@ -2,8 +2,6 @@ title: X-Agent Overview --- -import { Cards } from 'nextra/components' - # X-Agent > X-Agent: Empowering People to Build Custom AI Agents for ∞ possibilities. @@ -14,24 +12,32 @@ X-Agent is a next-generation platform connecting Web3 social networks with auton ## Start here - - - Follow the path from a natural-language request to a deployed, shareable AI - Agent. - - - Understand the vision, product model, token mechanics, roadmap, and business - model. - - - Find the current supply, token role, allocation status, and official - contract information. - - - Access official contract information and the independent security audit - report. - - +
+ + 01 + How X-Agent Works + Follow the path from a natural-language request to a deployed, shareable AI Agent. + Explore + + + 02 + Read the Litepaper + Understand the vision, product model, token mechanics, roadmap, and business model. + Explore + + + 03 + Review XAGT + Find the current supply, token role, allocation status, and official contract information. + Explore + + + 04 + Verify Security + Access official contract information and the independent security audit report. + Explore + +
## Latest official update diff --git a/content/ja/changelog.mdx b/content/ja/changelog.mdx index 66bddf4..2264116 100644 --- a/content/ja/changelog.mdx +++ b/content/ja/changelog.mdx @@ -2,6 +2,11 @@ X-AgentのLitepaperおよびドキュメントの主な変更を記録しています。 +## ホームページナビゲーションの更新 — 2026年9月8日 + +- ホームページの入口カードを、タイトルを優先した明確な情報構造、適切な余白、分かりやすいナビゲーション操作に刷新しました。 +- デスクトップの2列表示とモバイルの1列表示、視認性の高いキーボードフォーカスを追加し、英語・日本語・韓国語で表示を統一しました。 + ## トークン配分に関するお知らせ — 2026年9月7日 - Litepaperを繰り返し改訂することなく、継続的に更新される公開情報を掲載できる独立した「お知らせ」セクションを追加しました。 diff --git a/content/ja/index.mdx b/content/ja/index.mdx index 0fcf36f..a722923 100644 --- a/content/ja/index.mdx +++ b/content/ja/index.mdx @@ -2,8 +2,6 @@ title: X-Agent概要 --- -import { Cards } from 'nextra/components' - # X-Agent > X-Agent: Empowering People to Build Custom AI Agents for ∞ possibilities. @@ -14,20 +12,32 @@ X-Agentは、Web3ソーシャルネットワークと自律型AIをつなぐ次 ## はじめに - - - 自然言語による依頼から、共有可能なAIエージェントを展開するまでの流れを確認します。 - - - ビジョン、プロダクトモデル、トークンメカニズム、ロードマップ、ビジネスモデルを理解します。 - - - 現在の供給量、トークンの役割、配分状況、公式コントラクト情報を確認します。 - - - 公式コントラクト情報と第三者によるセキュリティ監査報告書を確認します。 - - +
+ + 01 + X-Agentの仕組み + 自然言語による依頼から、共有可能なAIエージェントを展開するまでの流れを確認します。 + 詳しく見る + + + 02 + Litepaperを読む + ビジョン、プロダクトモデル、トークンメカニズム、ロードマップ、ビジネスモデルを理解します。 + 詳しく見る + + + 03 + XAGTを確認 + 現在の供給量、トークンの役割、配分状況、公式コントラクト情報を確認します。 + 詳しく見る + + + 04 + セキュリティを確認 + 公式コントラクト情報と第三者によるセキュリティ監査報告書を確認します。 + 詳しく見る + +
## 最新の公式情報 diff --git a/content/ko/changelog.mdx b/content/ko/changelog.mdx index 631439e..c4e3096 100644 --- a/content/ko/changelog.mdx +++ b/content/ko/changelog.mdx @@ -2,6 +2,11 @@ X-Agent Litepaper 및 문서의 주요 변경 사항을 기록합니다. +## 홈페이지 탐색 개선 — 2026년 9월 8일 + +- 홈페이지 진입 카드를 제목 중심의 명확한 정보 구조, 개선된 여백, 분명한 탐색 동작으로 새롭게 구성했습니다. +- 데스크톱 2열 및 모바일 1열 반응형 레이아웃과 명확한 키보드 포커스를 추가하고 영어·일본어·한국어 표시를 통일했습니다. + ## 토큰 배분 공지 — 2026년 9월 7일 - Litepaper를 반복해서 개정하지 않고도 계속 업데이트되는 공개 정보를 게시할 수 있도록 독립된 「공지사항」 섹션을 추가했습니다. diff --git a/content/ko/index.mdx b/content/ko/index.mdx index b1bc530..df09218 100644 --- a/content/ko/index.mdx +++ b/content/ko/index.mdx @@ -2,8 +2,6 @@ title: X-Agent 개요 --- -import { Cards } from 'nextra/components' - # X-Agent > X-Agent: Empowering People to Build Custom AI Agents for ∞ possibilities. @@ -14,20 +12,32 @@ X-Agent는 Web3 소셜 네트워크와 자율형 AI를 연결하는 차세대 ## 시작하기 - - - 자연어 요청이 배포 및 공유 가능한 AI 에이전트로 이어지는 과정을 확인합니다. - - - 비전, 제품 모델, 토큰 메커니즘, 로드맵 및 비즈니스 모델을 이해합니다. - - - 현재 공급량, 토큰 역할, 배분 상태 및 공식 컨트랙트 정보를 확인합니다. - - - 공식 컨트랙트 정보와 독립적인 보안 감사 보고서를 확인합니다. - - +
+ + 01 + X-Agent 작동 방식 + 자연어 요청이 배포 및 공유 가능한 AI 에이전트로 이어지는 과정을 확인합니다. + 자세히 보기 + + + 02 + Litepaper 읽기 + 비전, 제품 모델, 토큰 메커니즘, 로드맵 및 비즈니스 모델을 이해합니다. + 자세히 보기 + + + 03 + XAGT 살펴보기 + 현재 공급량, 토큰 역할, 배분 상태 및 공식 컨트랙트 정보를 확인합니다. + 자세히 보기 + + + 04 + 보안 확인 + 공식 컨트랙트 정보와 독립적인 보안 감사 보고서를 확인합니다. + 자세히 보기 + +
## 최신 공식 업데이트 diff --git a/scripts/site-smoke.test.mjs b/scripts/site-smoke.test.mjs index 7286ea8..cbaf973 100644 --- a/scripts/site-smoke.test.mjs +++ b/scripts/site-smoke.test.mjs @@ -30,6 +30,18 @@ for (const [locale, paths] of Object.entries(routes)) { } for (const locale of ['en', 'ja', 'ko']) { + test(`the ${locale} homepage exposes four structured entry cards`, async () => { + const response = await request(`/${locale}`) + assert.equal(response.status, 200) + const html = await response.text() + assert.equal((html.match(/class="home-entry-card"/g) || []).length, 4) + assert.match( + html, + /class="home-entry-title"[\s\S]+class="home-entry-description"/ + ) + assert.doesNotMatch(html, /class="home-entry-description">

{ const response = await request(`/${locale}/announcement`) assert.equal(response.status, 200)