100 lines
5.4 KiB
HTML
100 lines
5.4 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Documentation - Tractatus Framework</title>
|
|
<link rel="stylesheet" href="/css/tailwind.css?v=0.1.2.1774503360480">
|
|
<link rel="stylesheet" href="/css/tractatus-theme.min.css?v=0.1.2.1774503360480">
|
|
<style>
|
|
/* Prose styling for document content - uses plain CSS (not @apply, which is build-time only) */
|
|
.prose h1 { font-size: 1.875rem; font-weight: 700; margin-top: 2rem; margin-bottom: 1rem; color: #111827; line-height: 1.2; }
|
|
.prose h2 { font-size: 1.5rem; font-weight: 700; margin-top: 2.5rem; margin-bottom: 0.75rem; color: #111827; line-height: 1.3; padding-bottom: 0.5rem; border-bottom: 1px solid #e5e7eb; }
|
|
.prose h3 { font-size: 1.25rem; font-weight: 600; margin-top: 1.5rem; margin-bottom: 0.5rem; color: #1f2937; line-height: 1.4; }
|
|
.prose p { margin-top: 1rem; margin-bottom: 1rem; color: #374151; line-height: 1.75; }
|
|
.prose ul { margin-top: 1rem; margin-bottom: 1rem; list-style-type: disc; padding-left: 1.5rem; color: #374151; }
|
|
.prose ul li { margin-bottom: 0.5rem; line-height: 1.75; }
|
|
.prose ol { margin-top: 1rem; margin-bottom: 1rem; list-style-type: decimal; padding-left: 1.5rem; color: #374151; }
|
|
.prose ol li { margin-bottom: 0.5rem; line-height: 1.75; }
|
|
.prose code { background-color: #f3f4f6; padding: 0.125rem 0.375rem; border-radius: 0.25rem; font-size: 0.875rem; font-family: ui-monospace, monospace; color: #dc2626; }
|
|
.prose pre { background-color: #111827; color: #f3f4f6; padding: 1rem; border-radius: 0.5rem; overflow-x: auto; margin: 1rem 0; }
|
|
.prose pre code { background-color: transparent; color: #f3f4f6; padding: 0; }
|
|
.prose a { color: #2563eb; text-decoration: underline; }
|
|
.prose a:hover { color: #1d4ed8; }
|
|
.prose blockquote { border-left: 4px solid #3b82f6; padding-left: 1rem; font-style: italic; color: #4b5563; margin: 1.5rem 0; }
|
|
.prose strong { font-weight: 600; color: #111827; }
|
|
.prose em { font-style: italic; }
|
|
.prose hr { margin: 2rem 0; border: none; border-top: 1px solid #d1d5db; }
|
|
.prose table { width: 100%; border-collapse: collapse; margin: 1.5rem 0; font-size: 0.875rem; }
|
|
.prose thead th { background-color: #f9fafb; font-weight: 600; text-align: left; padding: 0.75rem 1rem; border: 1px solid #e5e7eb; color: #111827; }
|
|
.prose tbody td { padding: 0.75rem 1rem; border: 1px solid #e5e7eb; color: #374151; vertical-align: top; }
|
|
.prose tbody tr:hover { background-color: #f9fafb; }
|
|
.prose li > p { margin: 0.25rem 0; }
|
|
|
|
/* Editorial notes */
|
|
.prose .editorial-note { background-color: #eff6ff; border: 1px solid #bfdbfe; border-left: 4px solid #3b82f6; border-radius: 0.5rem; padding: 1.25rem 1.5rem; margin: 2rem 0; }
|
|
.prose .editorial-note .note-title { font-weight: 700; color: #1e40af; margin-top: 0; margin-bottom: 0.75rem; font-size: 0.95rem; }
|
|
.prose .editorial-note p { color: #1e3a5f; font-size: 0.935rem; line-height: 1.7; }
|
|
.prose .editorial-note em { color: #1e3a5f; }
|
|
.prose .editorial-note a { color: #1d4ed8; }
|
|
</style>
|
|
|
|
<!-- Auto-reload on service worker update -->
|
|
</head>
|
|
<body class="bg-gray-50">
|
|
|
|
<!-- Navigation -->
|
|
<nav class="bg-white border-b border-gray-200 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">
|
|
<a href="/"
|
|
class="flex items-center space-x-2 px-2 py-2 -ml-2 rounded-lg hover:bg-blue-50 transition-all duration-200 group"
|
|
title="Return to homepage">
|
|
<img src="/images/tractatus-icon-new.svg" alt="Tractatus Icon" class="w-8 h-8">
|
|
<span class="text-lg font-bold text-gray-900 group-hover:text-blue-700 transition-colors">Tractatus Framework</span>
|
|
</a>
|
|
</div>
|
|
<div class="flex items-center space-x-6">
|
|
<a href="/docs.html" class="text-gray-700 hover:text-gray-900">Documentation</a>
|
|
<a href="/" class="text-gray-600 hover:text-gray-900">Home</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<!-- Main Content -->
|
|
<div class="flex">
|
|
<!-- Sidebar -->
|
|
<aside class="w-64 bg-white border-r border-gray-200 min-h-screen p-6">
|
|
<h2 class="text-sm font-semibold text-gray-900 uppercase mb-4">Framework Docs</h2>
|
|
<nav id="doc-navigation" class="space-y-2">
|
|
<!-- Will be populated by JavaScript -->
|
|
</nav>
|
|
</aside>
|
|
|
|
<!-- Document Viewer -->
|
|
<main class="flex-1 flex">
|
|
<div class="flex-1 p-8">
|
|
<div id="document-viewer" class="prose max-w-none"></div>
|
|
</div>
|
|
|
|
<!-- Table of Contents (Sticky) -->
|
|
<aside class="hidden lg:block w-64 bg-white border-l border-gray-200 p-6 sticky top-16 h-screen overflow-y-auto">
|
|
<div id="table-of-contents">
|
|
<!-- Will be populated by toc.js -->
|
|
</div>
|
|
</aside>
|
|
</main>
|
|
</div>
|
|
|
|
<!-- Scripts -->
|
|
<script src="/js/utils/api.js?v=0.1.2.1774503360480"></script>
|
|
<script src="/js/utils/router.js?v=0.1.2.1774503360480"></script>
|
|
<script src="/js/components/document-viewer.js?v=0.1.2.1774503360480"></script>
|
|
<script src="/js/components/code-copy-button.js?v=0.1.2.1774503360480"></script>
|
|
<script src="/js/components/toc.js?v=0.1.2.1774503360480"></script>
|
|
<script src="/js/docs-viewer-app.js?v=0.1.2.1774503360480"></script>
|
|
|
|
</body>
|
|
</html>
|