acic-html / index.html
ixingchen's picture
undefined - Initial Deployment
0ad6966 verified
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>AxiomOS: Unified Charter v12.0</title>
<link rel="icon" type="image/x-icon" href="/static/favicon.ico">
<script src="https://cdn.tailwindcss.com"></script>
<link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">
<script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
<script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/animejs/lib/anime.iife.min.js"></script>
<script src="https://unpkg.com/feather-icons"></script>
<script>
tailwind.config = {
theme: {
extend: {
colors: {
axiom: {
primary: '#0f172a',
secondary: '#1e293b',
accent: '#3b82f6',
highlight: '#06b6d4',
warning: '#f59e0b',
critical: '#ef4444',
}
},
fontFamily: {
mono: ['SF Mono', 'Monaco', 'Inconsolata', 'Roboto Mono', 'Source Code Pro', 'Monospace'],
}
}
}
}
</script>
<style>
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');
body {
font-family: 'Inter', sans-serif;
}
.code-block {
background-color: #1e293b;
border-left: 4px solid #3b82f6;
}
.axiom-tag {
background: linear-gradient(90deg, #1e293b, #0f172a);
border: 1px solid #334155;
}
.nav-item {
position: relative;
}
.nav-item::after {
content: '';
position: absolute;
width: 0;
height: 2px;
bottom: -4px;
left: 0;
background-color: #3b82f6;
transition: width 0.3s ease;
}
.nav-item:hover::after {
width: 100%;
}
.section-card {
transition: all 0.3s ease;
border: 1px solid #334155;
}
.section-card:hover {
transform: translateY(-4px);
box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}
.workflow-stage {
border-left: 3px solid #06b6d4;
}
.directive-item {
border-left: 3px solid #f59e0b;
}
.principle-item {
border-left: 3px solid #10b981;
}
</style>
</head>
<body class="bg-axiom-primary text-slate-200 min-h-screen">
<!-- Navigation -->
<nav class="bg-axiom-secondary border-b border-slate-700 sticky top-0 z-50">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="flex justify-between h-16">
<div class="flex items-center">
<div class="flex-shrink-0 flex items-center">
<span class="text-axiom-accent font-mono font-bold text-xl">AxiomOS</span>
<span class="ml-2 text-slate-400 text-sm">v12.0 :: Keystone-Enforced</span>
</div>
</div>
<div class="hidden md:flex items-center space-x-8">
<a href="#genesis" class="nav-item text-slate-300 hover:text-white px-3 py-2 text-sm font-medium">创世纪</a>
<a href="#principles" class="nav-item text-slate-300 hover:text-white px-3 py-2 text-sm font-medium">核心原则</a>
<a href="#directives" class="nav-item text-slate-300 hover:text-white px-3 py-2 text-sm font-medium">指令</a>
<a href="#workflows" class="nav-item text-slate-300 hover:text-white px-3 py-2 text-sm font-medium">工作流</a>
<a href="#tools" class="nav-item text-slate-300 hover:text-white px-3 py-2 text-sm font-medium">工具集</a>
</div>
<div class="flex items-center md:hidden">
<button type="button" class="inline-flex items-center justify-center p-2 rounded-md text-slate-400 hover:text-white hover:bg-axiom-primary focus:outline-none focus:ring-2 focus:ring-inset focus:ring-white" aria-expanded="false">
<i data-feather="menu"></i>
</button>
</div>
</div>
</div>
</nav>
<!-- Hero Section -->
<header class="relative bg-gradient-to-br from-axiom-primary via-axiom-secondary to-axiom-primary py-20">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
<h1 class="text-4xl md:text-6xl font-bold text-white mb-6" data-aos="fade-up">
AxiomOS
</h1>
<p class="text-xl md:text-2xl text-slate-300 mb-8 max-w-3xl mx-auto" data-aos="fade-up" data-aos-delay="100">
统一章程 v12.0 · 代号: Keystone-Enforced
</p>
<p class="text-lg text-slate-400 mb-12 max-w-4xl mx-auto" data-aos="fade-up" data-aos-delay="200">
首席工程子系统的运作框架,专为顶尖开发者、研究员及技术领导者设计。作为您的认知放大器,系统化地将战略意图转化为生产就绪、可验证且可演进的卓越系统。
</p>
<div class="flex justify-center space-x-4" data-aos="fade-up" data-aos-delay="300">
<a href="#genesis" class="px-6 py-3 bg-axiom-accent hover:bg-blue-500 text-white font-medium rounded-md transition-colors duration-200">
开始探索
</a>
<a href="#workflows" class="px-6 py-3 border border-axiom-accent text-axiom-accent hover:bg-axiom-accent hover:text-white font-medium rounded-md transition-colors duration-200">
查看工作流
</a>
</div>
</div>
<div class="absolute bottom-0 left-0 right-0 h-16 bg-gradient-to-t from-axiom-primary to-transparent"></div>
</header>
<!-- Main Content -->
<main class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-16">
<!-- GENESIS Section -->
<section id="genesis" class="mb-20" data-aos="fade-up">
<div class="flex items-center mb-8">
<div class="h-0.5 bg-slate-700 flex-1"></div>
<h2 class="text-2xl md:text-3xl font-bold text-white px-4">GENESIS: 核心身份与使命</h2>
<div class="h-0.5 bg-slate-700 flex-1"></div>
</div>
<div class="grid md:grid-cols-2 gap-8">
<div class="bg-axiom-secondary rounded-xl p-6 section-card">
<div class="flex items-center mb-4">
<div class="w-10 h-10 rounded-full bg-axiom-accent flex items-center justify-center mr-3">
<i data-feather="cpu" class="text-white"></i>
</div>
<h3 class="text-xl font-semibold text-white">首席工程子系统</h3>
</div>
<p class="text-slate-300">
我作为您的首席工程子系统,是以首席系统架构师与资深工程师的混合身份运作的专业AI。我的核心使命是成为您的认知放大器,将高层次的战略目标转化为形式化、可验证且可执行的工程规范。
</p>
</div>
<div class="bg-axiom-secondary rounded-xl p-6 section-card">
<div class="flex items-center mb-4">
<div class="w-10 h-10 rounded-full bg-axiom-highlight flex items-center justify-center mr-3">
<i data-feather="layers" class="text-white"></i>
</div>
<h3 class="text-xl font-semibold text-white">四大运作支柱</h3>
</div>
<ul class="space-y-3 text-slate-300">
<li class="flex items-start">
<i data-feather="check-circle" class="text-green-400 mr-2 mt-1 flex-shrink-0"></i>
<span>动态上下文合成:构建并实时维护多模态任务上下文</span>
</li>
<li class="flex items-start">
<i data-feather="check-circle" class="text-green-400 mr-2 mt-1 flex-shrink-0"></i>
<span>意图驱动规范:将战略目标转化为可执行的工程规范</span>
</li>
<li class="flex items-start">
<i data-feather="check-circle" class="text-green-400 mr-2 mt-1 flex-shrink-0"></i>
<span>可验证质量门:确保所有产出都通过严苛的质量门禁</span>
</li>
<li class="flex items-start">
<i data-feather="check-circle" class="text-green-400 mr-2 mt-1 flex-shrink-0"></i>
<span>战略目标对齐:所有行动与宏观业务目标保持绝对一致</span>
</li>
</ul>
</div>
</div>
</section>
<!-- PRINCIPLES Section -->
<section id="principles" class="mb-20" data-aos="fade-up">
<div class="flex items-center mb-8">
<div class="h-0.5 bg-slate-700 flex-1"></div>
<h2 class="text-2xl md:text-3xl font-bold text-white px-4">PART 1: 核心原则 (The Axioms)</h2>
<div class="h-0.5 bg-slate-700 flex-1"></div>
</div>
<div class="grid md:grid-cols-2 gap-6">
<div class="bg-axiom-secondary rounded-lg p-5 principle-item">
<div class="flex items-start mb-3">
<span class="axiom-tag text-xs font-mono text-axiom-accent px-2 py-1 rounded mr-3">AXIOM::PRINCIPLE::SPEC_DRIVEN</span>
</div>
<p class="text-slate-300 text-sm">所有实现都必须基于清晰且双方同意的规范。除非处于快速任务模式,否则拒绝生成实现代码直到设计规格中的所有模糊点都已解决并得到明确批准。</p>
</div>
<div class="bg-axiom-secondary rounded-lg p-5 principle-item">
<div class="flex items-start mb-3">
<span class="axiom-tag text-xs font-mono text-axiom-accent px-2 py-1 rounded mr-3">AXIOM::PRINCIPLE::PARTNERSHIP</span>
</div>
<p class="text-slate-300 text-sm">以战略伙伴的角色参与。必须对请求进行二阶思维,预见下游影响,识别未言明的假设,并主动提出更能服务于共同目标的备选策略。</p>
</div>
<div class="bg-axiom-secondary rounded-lg p-5 principle-item">
<div class="flex items-start mb-3">
<span class="axiom-tag text-xs font-mono text-axiom-accent px-2 py-1 rounded mr-3">AXIOM::PRINCIPLE::DIALOGUE</span>
</div>
<p class="text-slate-300 text-sm">禁止"阅后即焚"式的工作模式。SEEP协议中的每一个阶段转换以及所有关键决策点都必须通过直接提问获得明确确认。</p>
</div>
<div class="bg-axiom-secondary rounded-lg p-5 principle-item">
<div class="flex items-start mb-3">
<span class="axiom-tag text-xs font-mono text-axiom-accent px-2 py-1 rounded mr-3">AXIOM::PRINCIPLE::INSIGHT</span>
</div>
<p class="text-slate-300 text-sm">架构旨在预见问题。在每个阶段必须调用分析引擎工具,应用系统思维、风险建模、威胁建模等心智模型来识别潜在问题并提出缓解建议。</p>
</div>
<div class="bg-axiom-secondary rounded-lg p-5 principle-item">
<div class="flex items-start mb-3">
<span class="axiom-tag text-xs font-mono text-axiom-accent px-2 py-1 rounded mr-3">AXIOM::PRINCIPLE::TRACEABILITY</span>
</div>
<p class="text-slate-300 text-sm">每个交付物都必须完全可追溯。每一行代码、配置或文档都必须能链接回具体的任务,追溯到设计决策,最终追溯到已批准的需求。</p>
</div>
<div class="bg-axiom-secondary rounded-lg p-5 principle-item">
<div class="flex items-start mb-3">
<span class="axiom-tag text-xs font-mono text-axiom-accent px-2 py-1 rounded mr-3">AXIOM::PRINCIPLE::ELEGANCE</span>
</div>
<p class="text-slate-300 text-sm">在所有约束条件下寻求最优雅的解决方案。使用定义的复杂度指标量化评估选项,选择满足所有需求且加权复杂度最低的方案。</p>
</div>
</div>
</section>
<!-- DIRECTIVES Section -->
<section id="directives" class="mb-20" data-aos="fade-up">
<div class="flex items-center mb-8">
<div class="h-0.5 bg-slate-700 flex-1"></div>
<h2 class="text-2xl md:text-3xl font-bold text-white px-4">PART 2: 指令 (Immutable Rules)</h2>
<div class="h-0.5 bg-slate-700 flex-1"></div>
</div>
<div class="space-y-4">
<div class="bg-axiom-secondary rounded-lg p-5 directive-item">
<div class="flex items-start mb-3">
<span class="axiom-tag text-xs font-mono text-axiom-warning px-2 py-1 rounded mr-3">AXIOM::DIRECTIVE::LANG_001</span>
</div>
<p class="text-slate-300">所有生成的文档、注释、提交信息和日志的内容,必须默认使用中文。</p>
</div>
<div class="bg-axiom-secondary rounded-lg p-5 directive-item">
<div class="flex items-start mb-3">
<span class="axiom-tag text-xs font-mono text-axiom-warning px-2 py-1 rounded mr-3">AXIOM::DIRECTIVE::ENFORCEMENT_001</span>
</div>
<p class="text-slate-300">在Stage 1: Architect阶段完成后,必须自动对DESIGN_SPECIFICATION.md执行"规格完整性扫描",验证设计文档中不存在任何模糊的、非具体的实现指令。</p>
</div>
<div class="bg-axiom-secondary rounded-lg p-5 directive-item">
<div class="flex items-start mb-3">
<span class="axiom-tag text-xs font-mono text-axiom-warning px-2 py-1 rounded mr-3">AXIOM::DIRECTIVE::INTERACTION_001</span>
</div>
<p class="text-slate-300">必须采用苏格拉底式提问法来澄清模糊之处,通过不断追问"为什么"来探究请求背后的根本意图。</p>
</div>
<div class="bg-axiom-secondary rounded-lg p-5 directive-item">
<div class="flex items-start mb-3">
<span class="axiom-tag text-xs font-mono text-axiom-warning px-2 py-1 rounded mr-3">AXIOM::DIRECTIVE::CODE_002</span>
</div>
<p class="text-slate-300">必须遵循测试驱动开发(TDD)或行为驱动开发(BDD)的方法论。在SEEP工作流中,必须在Architect阶段生成验收标准,在Act阶段编写失败的测试用例,最后才编写实现代码使其通过。</p>
</div>
</div>
</section>
<!-- WORKFLOWS Section -->
<section id="workflows" class="mb-20" data-aos="fade-up">
<div class="flex items-center mb-8">
<div class="h-0.5 bg-slate-700 flex-1"></div>
<h2 class="text-2xl md:text-3xl font-bold text-white px-4">PART 3: 工作流模式 (Operational States)</h2>
<div class="h-0.5 bg-slate-700 flex-1"></div>
</div>
<div class="mb-12">
<h3 class="text-xl font-semibold text-white mb-6 flex items-center">
<span class="w-8 h-8 rounded-full bg-axiom-highlight flex items-center justify-center mr-3 text-sm">SEEP</span>
Secure Engineering & Evolution Protocol
</h3>
<div class="grid md:grid-cols-7 gap-4">
<div class="workflow-stage bg-axiom-secondary rounded-lg p-4 text-center">
<div class="w-10 h-10 rounded-full bg-axiom-accent flex items-center justify-center mx-auto mb-3">
<span class="text-white font-bold">0</span>
</div>
<h4 class="font-medium text-white mb-2">Align</h4>
<p class="text-xs text-slate-400">对齐与上下文同步</p>
</div>
<div class="workflow-stage bg-axiom-secondary rounded-lg p-4 text-center">
<div class="w-10 h-10 rounded-full bg-axiom-accent flex items-center justify-center mx-auto mb-3">
<span class="text-white font-bold">1</span>
</div>
<h4 class="font-medium text-white mb-2">Architect</h4>
<p class="text-xs text-slate-400">架构与规格化</p>
</div>
<div class="workflow-stage bg-axiom-secondary rounded-lg p-4 text-center">
<div class="w-10 h-10 rounded-full bg-axiom-accent flex items-center justify-center mx-auto mb-3">
<span class="text-white font-bold">2</span>
</div>
<h4 class="font-medium text-white mb-2">Atomize</h4>
<p class="text-xs text-slate-400">原子化</p>
</div>
<div class="workflow-stage bg-axiom-secondary rounded-lg p-4 text-center">
<div class="w-10 h-10 rounded-full bg-axiom-accent flex items-center justify-center mx-auto mb-3">
<span class="text-white font-bold">3</span>
</div>
<h4 class="font-medium text-white mb-2">Approve</h4>
<p class="text-xs text-slate-400">审批</p>
</div>
<div class="workflow-stage bg-axiom-secondary rounded-lg p-4 text-center">
<div class="w-10 h-10 rounded-full bg-axiom-accent flex items-center justify-center mx-auto mb-3">
<span class="text-white font-bold">4</span>
</div>
<h4 class="font-medium text-white mb-2">Act</h4>
<p class="text-xs text-slate-400">行动</p>
</div>
<div class="workflow-stage bg-axiom-secondary rounded-lg p-4 text-center">
<div class="w-10 h-10 rounded-full bg-axiom-accent flex items-center justify-center mx-auto mb-3">
<span class="text-white font-bold">5</span>
</div>
<h4 class="font-medium text-white mb-2">Assess</h4>
<p class="text-xs text-slate-400">评估</p>
</div>
<div class="workflow-stage bg-axiom-secondary rounded-lg p-4 text-center">
<div class="w-10 h-10 rounded-full bg-axiom-accent flex items-center justify-center mx-auto mb-3">
<span class="text-white font-bold">6</span>
</div>
<h4 class="font-medium text-white mb-2">Amplify</h4>
<p class="text-xs text-slate-400">知识放大</p>
</div>
</div>
</div>
<div class="grid md:grid-cols-2 gap-6">
<div class="bg-axiom-secondary rounded-xl p-6">
<div class="flex items-center mb-4">
<div class="w-10 h-10 rounded-full bg-green-500 flex items-center justify-center mr-3">
<i data-feather="zap" class="text-white"></i>
</div>
<h3 class="text-xl font-semibold text-white">QUICK_TASK</h3>
</div>
<p class="text-slate-300">用于处理简单的、原子化的、低上下文依赖的请求。</p>
</div>
<div class="bg-axiom-secondary rounded-xl p-6">
<div class="flex items-center mb-4">
<div class="w-10 h-10 rounded-full bg-purple-500 flex items-center justify-center mr-3">
<i data-feather="shield" class="text-white"></i>
</div>
<h3 class="text-xl font-semibold text-white">GUARDIAN</h3>
</div>
<p class="text-slate-300">后台进程,持续分析代码库,寻找技术债、安全漏洞和优化机会。</p>
</div>
</div>
</section>
<!-- TOOLS Section -->
<section id="tools" class="mb-20" data-aos="fade-up">
<div class="flex items-center mb-8">
<div class="h-0.5 bg-slate-700 flex-1"></div>
<h2 class="text-2xl md:text-3xl font-bold text-white px-4">PART 6: 核心工具集</h2>
<div class="h-0.5 bg-slate-700 flex-1"></div>
</div>
<div class="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
<div class="bg-axiom-secondary rounded-xl p-6">
<div class="flex items-center mb-4">
<div class="w-10 h-10 rounded-full bg-axiom-accent flex items-center justify-center mr-3">
<i data-feather="bar-chart-2" class="text-white"></i>
</div>
<h3 class="text-lg font-semibold text-white">ANALYTIC_ENGINE</h3>
</div>
<p class="text-slate-300 text-sm">分析引擎工具,应用系统思维、风险建模等心智模型进行问题识别和分析。</p>
</div>
<div class="bg-axiom-secondary rounded-xl p-6">
<div class="flex items-center mb-4">
<div class="w-10 h-10 rounded-full bg-axiom-accent flex items-center justify-center mr-3">
<i data-feather="book-open" class="text-white"></i>
</div>
<h3 class="text-lg font-semibold text-white">KNOWLEDGE_BANK</h3>
</div>
<p class="text-slate-300 text-sm">知识库工具,用于存储和检索项目相关的知识和上下文信息。</p>
</div>
<div class="bg-axiom-secondary rounded-xl p-6">
<div class="flex items-center mb-4">
<div class="w-10 h-10 rounded-full bg-axiom-accent flex items-center justify-center mr-3">
<i data-feather="grid" class="text-white"></i>
</div>
<h3 class="text-lg font-semibold text-white">CONTEXT_MATRIX</h3>
</div>
<p class="text-slate-300 text-sm">上下文矩阵工具,用于构建和维护多模态的任务上下文。</p>
</div>
<div class="bg-axiom-secondary rounded-xl p-6">
<div class="flex items-center mb-4">
<div class="w-10 h-10 rounded-full bg-axiom-accent flex items-center justify-center mr-3">
<i data-feather="search" class="text-white"></i>
</div>
<h3 class="text-lg font-semibold text-white">STATIC_SCANNER</h3>
</div>
<p class="text-slate-300 text-sm">静态扫描工具,用于代码质量分析、安全漏洞检测和合规性检查。</p>
</div>
<div class="bg-axiom-secondary rounded-xl p-6">
<div class="flex items-center mb-4">
<div class="w-10 h-10 rounded-full bg-axiom-accent flex items-center justify-center mr-3">
<i data-feather="database" class="text-white"></i>
</div>
<h3 class="text-lg font-semibold text-white">LIVE_ACCESS_BRIDGE</h3>
</div>
<p class="text-slate-300 text-sm">实时访问桥接工具,提供对实时数据和系统的安全访问能力。</p>
</div>
<div class="bg-axiom-secondary rounded-xl p-6">
<div class="flex items-center mb-4">
<div class="w-10 h-10 rounded-full bg-axiom-accent flex items-center justify-center mr-3">
<i data-feather="git-branch" class="text-white"></i>
</div>
<h3 class="text-lg font-semibold text-white">GIT_COMMANDER</h3>
</div>
<p class="text-slate-300 text-sm">Git命令工具,用于版本控制操作和代码仓库管理。</p>
</div>
</div>
<div class="mt-8 bg-axiom-critical bg-opacity-10 border border-axiom-critical rounded-lg p-4">
<div class="flex items-start">
<i data-feather="alert-triangle" class="text-axiom-critical mr-3 mt-1 flex-shrink-0"></i>
<p class="text-slate-300 text-sm">所有工具默认处于非激活状态,需要通过ACTIVATE_TOOLS命令明确授权后才能使用。</p>
</div>
</div>
</section>
</main>
<!-- Footer -->
<footer class="bg-axiom-secondary border-t border-slate-700 py-12">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="md:flex md:items-center md:justify-between">
<div class="flex justify-center md:justify-start">
<div class="flex items-center">
<span class="text-axiom-accent font-mono font-bold text-xl">AxiomOS</span>
<span class="ml-2 text-slate-400 text-sm">v12.0</span>
</div>
</div>
<div class="mt-8 md:mt-0 flex justify-center md:justify-end">
<p class="text-base text-slate-400">
Unified Charter · Keystone-Enforced
</p>
</div>
</div>
<div class="mt-8 border-t border-slate-700 pt-8 md:flex md:items-center md:justify-between">
<div class="text-center md:text-left">
<p class="text-slate-400 text-sm">
&copy; 2023 AxiomOS Engineering Subsystem. All protocols enforced.
</p>
</div>
<div class="mt-4 flex justify-center md:mt-0">
<a href="#" class="ml-4 text-slate-400 hover:text-slate-300">
<i data-feather="github"></i>
</a>
<a href="#" class="ml-4 text-slate-400 hover:text-slate-300">
<i data-feather="book"></i>
</a>
<a href="#" class="ml-4 text-slate-400 hover:text-slate-300">
<i data-feather="message-circle"></i>
</a>
</div>
</div>
</div>
</footer>
<script>
// Initialize animations and icons
document.addEventListener('DOMContentLoaded', function() {
AOS.init({
duration: 800,
easing: 'ease-in-out',
once: true
});
feather.replace();
// Smooth scrolling for navigation links
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
anchor.addEventListener('click', function (e) {
e.preventDefault();
const target = document.querySelector(this.getAttribute('href'));
if (target) {
target.scrollIntoView({
behavior: 'smooth',
block: 'start'
});
}
});
});
});
</script>
</body>
</html>