oib/aitbc
1
0
Fork 0
Code Issues Pull Requests Actions 7 Packages Projects Releases Wiki Activity
Files
7062b2cc787914973f8509e7a636ac0c40b3a611
aitbc/website/index.html
oib 7062b2cc78 feat: add dark mode, navigation, and Web Vitals tracking to marketplace 
Backend:
- Simplify DatabaseConfig: remove effective_url property and project root finder
- Update to Pydantic v2 model_config (replace nested Config class)
- Add web_vitals router to main.py and __init__.py
- Fix ExplorerService datetime handling (ensure timezone-naive comparisons)
- Fix status_label extraction to handle both enum and string job states

Frontend (Marketplace):
- Add dark mode toggle with system preference detection
2026-02-15 19:02:51 +01:00

328 lines
17 KiB
HTML
Raw Blame History

<!DOCTYPE html>
<html lang="en" data-theme="dark">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>AITBC - Production-Ready AI Blockchain Platform</title>
<meta name="description" content="AITBC - Production-ready AI blockchain platform with 7 live components, 30+ GPU services, and Stage 7 complete">
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Expires" content="0">
<link rel="preconnect" href="https://aitbc.bubuit.net">
<link rel="dns-prefetch" href="//aitbc.bubuit.net">
<meta name="theme-color" content="#2563eb">
<meta property="og:title" content="AITBC - Production-Ready AI Blockchain Platform">
<meta property="og:description" content="Production-ready AI blockchain platform with 7 live components, 30+ GPU services">
<meta property="og:type" content="website">
<meta property="og:url" content="https://aitbc.bubuit.net">
<meta name="twitter:card" content="summary_large_image">
<style>
/* Critical CSS for above-the-fold content */
:root{--primary-color:#2563eb;--secondary-color:#1e40af;--accent-color:#3b82f6;--text-dark:#1f2937;--bg-white:#ffffff;--gradient:linear-gradient(135deg,#667eea 0%,#764ba2 100%)}[data-theme="dark"]{--primary-color:#3b82f6;--secondary-color:#2563eb;--accent-color:#60a5fa;--text-dark:#f9fafb;--bg-white:#1f2937;--gradient:linear-gradient(135deg,#667eea 0%,#764ba2 100%)}body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;line-height:1.6;color:var(--text-dark);background-color:var(--bg-light);transition:background-color .3s ease,color .3s ease}.container{max-width:1200px;margin:0 auto;padding:0 20px}header{background:var(--bg-white);box-shadow:0 1px 3px rgba(0,0,0,.1);position:fixed;width:100%;top:0;z-index:1000}nav{display:flex;justify-content:space-between;align-items:center;padding:1rem 0}.logo{font-size:1.5rem;font-weight:700;color:var(--primary-color);text-decoration:none}.nav-button{background:transparent!important;color:var(--text-dark)!important;padding:.5rem .75rem;border-radius:.5rem;font-weight:500;transition:all .2s ease;text-decoration:none;display:inline-flex;align-items:center}.nav-button:hover{background:rgba(59,130,246,.1)!important;color:var(--primary-color)!important}.hero{background:var(--gradient);color:#fff;padding:100px 0 80px;text-align:center}.hero h1{font-size:3.5rem;margin-bottom:1rem;animation:fadeInUp .8s ease}.hero p{font-size:1.25rem;margin-bottom:2rem;opacity:.9;animation:fadeInUp .8s ease .2s both}.cta-button{display:inline-block;padding:12px 30px;background:var(--bg-white);color:var(--primary-color);text-decoration:none;border-radius:5px;font-weight:600;transition:transform .3s,box-shadow .3s;animation:fadeInUp .8s ease .4s both}.cta-button:hover{transform:translateY(-2px);box-shadow:0 10px 20px rgba(0,0,0,.1)}@keyframes fadeInUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@media (max-width:768px){.hero h1{font-size:2.5rem}}
</style>
<link rel="preload" href="/assets/css/font-awesome.min.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
<link rel="preload" href="/assets/css/main.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
<noscript><link rel="stylesheet" href="/assets/css/font-awesome.min.css"><link rel="stylesheet" href="/assets/css/main.css"></noscript>
<!-- Font Awesome CDN fallback -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" crossorigin="anonymous" media="print" onload="this.media='all'; this.onload=null;">
</head>
<body>
<!-- Header -->
<header class="text-white shadow-lg" style="background: var(--bg-white);">
<div class="container mx-auto px-4 py-6">
<div class="flex items-center justify-between">
<div class="flex items-center space-x-3">
<i class="fas fa-cube" style="font-size: 2rem; color: var(--primary-color);"></i>
<h1 class="text-2xl font-bold" style="color: var(--text-dark);">AITBC</h1>
</div>
<nav class="flex items-center space-x-6">
<a href="/explorer/" class="nav-button" style="background: transparent !important; color: var(--text-dark) !important;">Explorer</a>
<a href="/marketplace/" class="nav-button" style="background: transparent !important; color: var(--text-dark) !important;">Marketplace</a>
<a href="/Exchange/" class="nav-button" style="background: transparent !important; color: var(--text-dark) !important;">Exchange</a>
<a href="docs/index.html" class="nav-button" style="background: transparent !important; color: var(--text-dark) !important;">Docs</a>
<button onclick="toggleDarkMode()" class="nav-button" title="Toggle dark mode" style="background: rgba(59, 130, 246, 0.1) !important; color: var(--primary-color) !important; border: 2px solid var(--primary-color); padding: 0.5rem 1rem;">
<span id="darkModeEmoji">🌙</span>
<span id="darkModeText" style="margin-left: 0.5rem;">Dark</span>
</button>
</nav>
</div>
</div>
</header>
<!-- Hero Section -->
<section class="hero" id="hero">
<div class="container">
<h1>Production-Ready AI Blockchain Platform</h1>
<p>7 Live Components • 30+ GPU Services • Stage 11 Complete</p>
<a href="#features" class="cta-button">Explore Features</a>
</div>
</section>
<!-- Features Section -->
<section class="features" id="features">
<div class="container">
<h2 class="section-title">Platform Components</h2>
<div class="features-grid">
<div class="feature-card">
<div class="feature-icon">
<i class="fas fa-cube"></i>
</div>
<h3>Blockchain Node</h3>
<p>PoA/PoS consensus with REST/WebSocket RPC, real-time gossip layer, and comprehensive observability. Production-ready with devnet tooling.</p>
<a href="docs/blockchain-node.html" class="feature-link">View Docs <i class="fas fa-arrow-right"></i></a>
</div>
<div class="feature-card">
<div class="feature-icon">
<i class="fas fa-server"></i>
</div>
<h3>Coordinator API</h3>
<p>FastAPI service for job submission, miner registration, and receipt management. SQLite persistence with comprehensive endpoints.</p>
<a href="docs/coordinator-api.html" class="feature-link">View Docs <i class="fas fa-arrow-right"></i></a>
</div>
<div class="feature-card">
<div class="feature-icon">
<i class="fas fa-store"></i>
</div>
<h3>Marketplace Web</h3>
<p>Vite/TypeScript marketplace with offer/bid functionality, stats dashboard, and mock/live data toggle. Production UI ready.</p>
<a href="docs/marketplace-web.html" class="feature-link">View Docs <i class="fas fa-arrow-right"></i></a>
</div>
<div class="feature-card">
<div class="feature-icon">
<i class="fas fa-search"></i>
</div>
<h3>Explorer Web</h3>
<p>Full-featured blockchain explorer with blocks, transactions, addresses, and receipts tracking. Responsive design with live data.</p>
<a href="docs/explorer-web.html" class="feature-link">View Docs <i class="fas fa-arrow-right"></i></a>
</div>
<div class="feature-card">
<div class="feature-icon">
<i class="fas fa-wallet"></i>
</div>
<h3>Wallet Daemon</h3>
<p>Encrypted keystore with Argon2id + XChaCha20-Poly1305, REST/JSON-RPC APIs, and receipt verification capabilities.</p>
<a href="docs/wallet-daemon.html" class="feature-link">View Docs <i class="fas fa-arrow-right"></i></a>
</div>
<div class="feature-card">
<div class="feature-icon">
<i class="fas fa-exchange-alt"></i>
</div>
<h3>Trade Exchange</h3>
<p>Bitcoin-to-AITBC exchange with QR payments, user management, and real-time trading. Buy tokens with BTC instantly.</p>
<a href="docs/trade-exchange.html" class="feature-link">View Docs <i class="fas fa-arrow-right"></i></a>
</div>
<div class="feature-card">
<div class="feature-icon">
<i class="fas fa-swimming-pool"></i>
</div>
<h3>Pool Hub</h3>
<p>Miner registry with scoring engine, Redis/PostgreSQL backing, and comprehensive metrics. Live matching API deployed.</p>
<a href="docs/pool-hub.html" class="feature-link">View Docs <i class="fas fa-arrow-right"></i></a>
</div>
</div>
</div>
</section>
<!-- Architecture Section -->
<section class="architecture" id="architecture">
<div class="container">
<h2 class="section-title">Architecture</h2>
<div class="architecture-grid">
<div class="arch-component">
<i class="fas fa-server"></i>
<h3>Coordinator API</h3>
<p>Central coordination layer for marketplace operations</p>
</div>
<div class="arch-component">
<i class="fas fa-link"></i>
<h3>Blockchain Node</h3>
<p>Hybrid PoA/PoS consensus with fast finality</p>
</div>
<div class="arch-component">
<i class="fas fa-cube"></i>
<h3>GPU Providers</h3>
<p>Decentralized compute network for AI workloads</p>
</div>
<div class="arch-component">
<i class="fas fa-wallet"></i>
<h3>Wallet Daemon</h3>
<p>Secure wallet management and transaction signing</p>
</div>
</div>
</div>
</section>
<!-- Stats Section -->
<section class="stats">
<div class="container">
<div class="stats-grid">
<div class="stat-item">
<h3>100,000+</h3>
<p>Transactions Per Second</p>
</div>
<div class="stat-item">
<h3>&lt;1s</h3>
<p>Finality Time</p>
</div>
<div class="stat-item">
<h3>64</h3>
<p>Shard Chains</p>
</div>
<div class="stat-item">
<h3>95%</h3>
<p>Energy Reduction vs PoW</p>
</div>
</div>
</div>
</section>
<!-- Documentation Section -->
<section class="documentation" id="documentation">
<div class="container">
<h2 class="section-title">Documentation</h2>
<p class="section-subtitle">Choose your reader level for tailored documentation</p>
<div class="docs-grid">
<div class="doc-card">
<div class="doc-icon">
<i class="fas fa-hammer"></i>
</div>
<h3>Miners</h3>
<p>Learn mining, staking, and earning rewards</p>
<a href="docs/miners.html" class="doc-link">Miner Docs <i class="fas fa-arrow-right"></i></a>
</div>
<div class="doc-card">
<div class="doc-icon">
<i class="fas fa-users"></i>
</div>
<h3>Clients</h3>
<p>Use AITBC for AI/ML workloads</p>
<a href="docs/clients.html" class="doc-link">Client Docs <i class="fas fa-arrow-right"></i></a>
</div>
<div class="doc-card">
<div class="doc-icon">
<i class="fas fa-code"></i>
</div>
<h3>Developers</h3>
<p>Build on AITBC and contribute</p>
<a href="docs/developers.html" class="doc-link">Developer Docs <i class="fas fa-arrow-right"></i></a>
</div>
</div>
<div class="docs-cta">
<a href="docs/index.html" class="cta-button">View All Documentation</a>
</div>
</div>
</section>
<!-- Achievements Section -->
<section class="stats" id="achievements">
<div class="container">
<h2 class="section-title">Platform Achievements</h2>
<div class="stats-grid">
<div class="stat-item">
<h3>7</h3>
<p>Live Components</p>
</div>
<div class="stat-item">
<h3>30+</h3>
<p>GPU Services</p>
</div>
<div class="stat-item">
<h3>Stages 1-11</h3>
<p>Complete</p>
</div>
<div class="stat-item">
<h3>100%</h3>
<p>Open Source</p>
</div>
</div>
</div>
</section>
<!-- Roadmap Section -->
<section class="roadmap" id="roadmap">
<div class="container">
<h2 class="section-title">Development Roadmap</h2>
<div class="roadmap-timeline">
<div class="roadmap-item">
<div class="roadmap-marker">✓</div>
<div class="roadmap-content">
<h4>Stages 1-11 Complete</h4>
<p>Core infrastructure, marketplace, explorer, wallet, trade exchange, and 30+ GPU services deployed</p>
</div>
</div>
<div class="roadmap-item">
<div class="roadmap-marker">🔄</div>
<div class="roadmap-content">
<h4>Stage 8 - Current Focus</h4>
<p>Research consortium, sharding prototypes, ZK applications, and global expansion</p>
</div>
</div>
<div class="roadmap-item">
<div class="roadmap-marker">9</div>
<div class="roadmap-content">
<h4>Stage 9 - Moonshot Initiatives</h4>
<p>Decentralized infrastructure, AI automation, and global standards</p>
</div>
</div>
<div class="roadmap-item">
<div class="roadmap-marker">10</div>
<div class="roadmap-content">
<h4>Stage 10 - Stewardship</h4>
<p>Open governance, educational programs, and long-term preservation</p>
</div>
</div>
</div>
</div>
</section>
<!-- Footer -->
<footer>
<div class="container">
<ul class="nav-links">
<li><a href="/explorer/">Explorer</a></li>
<li><a href="/marketplace/">Marketplace</a></li>
<li><a href="/Exchange/">Exchange</a></li>
<li><a href="docs/index.html">Documentation</a></li>
<li><a href="mailto:andreas.fleckl@bubuit.net">Contact</a></li>
</ul>
<p>&copy; 2025 AITBC. All rights reserved.</p>
</div>
</footer>
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "Organization",
"name": "AITBC",
"description": "Production-ready AI blockchain platform with 7 live components and 30+ GPU services",
"url": "https://aitbc.bubuit.net",
"logo": "https://aitbc.bubuit.net/favicon.ico",
"sameAs": [
"https://github.com/aitbc"
],
"contactPoint": {
"@type": "ContactPoint",
"email": "andreas.fleckl@bubuit.net",
"contactType": "General Inquiries"
}
}
</script>
<script>
// Register service worker for offline support
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('/assets/js/sw.js')
.then(registration => console.log('SW registered'))
.catch(err => console.log('SW registration failed'));
}
</script>
<script src="/assets/js/main.js" async></script>
<script src="/assets/js/web-vitals.js" async></script>
<!-- Lightweight Analytics - privacy focused, no cookies -->
<script data-host="https://ackee.bubuit.net" data-ackee-server="https://ackee.bubuit.net" src="/assets/js/analytics.js" async data-auto-opts='{"website": "aitbc-main", "name": "AITBC Main Website"}'></script>
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink