caxton 0.1.3

A modern, efficient typesetting and document preparation system
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>$if(title)$$title$ - $endif$Caxton ADR</title>
    <link rel="stylesheet" href="../css/style.css">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet">
    <style>
        /* ADR-specific styles */
        .adr-content {
            max-width: 800px;
            margin: 0 auto;
            padding: var(--spacing-xl) var(--spacing-lg);
        }
        .adr-content h1 {
            color: var(--text-primary);
            margin-bottom: var(--spacing-lg);
            font-size: 2.5rem;
        }
        .adr-content h2 {
            color: var(--accent-primary);
            margin-top: var(--spacing-xl);
            margin-bottom: var(--spacing-md);
        }
        .adr-content h3 {
            color: var(--text-primary);
            margin-top: var(--spacing-lg);
            margin-bottom: var(--spacing-sm);
        }
        .adr-content p {
            margin-bottom: var(--spacing-md);
            line-height: 1.8;
        }
        .adr-content ul, .adr-content ol {
            margin-bottom: var(--spacing-md);
            padding-left: var(--spacing-lg);
        }
        .adr-content li {
            margin-bottom: var(--spacing-xs);
            line-height: 1.8;
        }
        .adr-content code {
            background-color: var(--bg-surface);
            padding: 0.2em 0.4em;
            border-radius: 4px;
            font-family: var(--font-mono);
            font-size: 0.875em;
        }
        .adr-content pre {
            background-color: var(--bg-tertiary);
            border-radius: 8px;
            padding: var(--spacing-md);
            overflow-x: auto;
            margin-bottom: var(--spacing-md);
        }
        .adr-content pre code {
            background-color: transparent;
            padding: 0;
        }
        .adr-metadata {
            color: var(--text-muted);
            font-size: 0.875rem;
            margin-bottom: var(--spacing-xl);
        }
    </style>
</head>
<body>
    <nav class="navbar">
        <div class="container">
            <div class="nav-content">
                <div class="nav-brand">
                    <div class="logo-container">
                        <img src="../img/logo.svg" alt="Caxton Logo" class="logo">
                    </div>
                    <span class="brand-text">Caxton</span>
                </div>
                <div class="nav-links">
                    <a href="../" class="nav-link">Home</a>
                    <a href="../#features" class="nav-link">Features</a>
                    <a href="../#architecture" class="nav-link">Architecture</a>
                    <a href="../caxton/" class="nav-link">API Docs</a>
                    <a href="./" class="nav-link">ADRs</a>
                    <a href="https://github.com/jwilger/caxton" class="nav-link github-link">
                        <svg class="github-icon" viewBox="0 0 24 24" fill="currentColor">
                            <path d="M12 2C6.477 2 2 6.477 2 12c0 4.42 2.865 8.17 6.84 9.49.5.09.68-.22.68-.48 0-.24-.01-.87-.01-1.71-2.78.6-3.37-1.34-3.37-1.34-.46-1.16-1.11-1.47-1.11-1.47-.91-.62.07-.61.07-.61 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.56-1.11-4.56-4.93 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.64 0 0 .84-.27 2.75 1.02.8-.22 1.65-.33 2.5-.33.85 0 1.7.11 2.5.33 1.91-1.29 2.75-1.02 2.75-1.02.55 1.37.2 2.39.1 2.64.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.68-4.57 4.93.36.31.68.92.68 1.85 0 1.34-.01 2.42-.01 2.75 0 .27.18.58.69.48C19.14 20.16 22 16.42 22 12c0-5.523-4.477-10-10-10z"/>
                        </svg>
                        GitHub
                    </a>
                </div>
            </div>
        </div>
    </nav>

    <div style="height: 80px;"></div>

    <main class="adr-content">
        $if(date)$
        <div class="adr-metadata">
            Date: $date$
        </div>
        $endif$

$body$
    </main>

    <footer class="footer">
        <div class="container">
            <div class="footer-content">
                <div class="footer-left">
                    <img src="../img/logo.svg" alt="Caxton Logo" class="footer-logo">
                    <p>MIT License</p>
                </div>
                <div class="footer-links">
                    <a href="https://github.com/jwilger/caxton">GitHub</a>
                    <a href="../">Home</a>
                    <a href="./">All ADRs</a>
                    <a href="https://github.com/jwilger/caxton/tree/main/docs/adr">View Source</a>
                </div>
            </div>
        </div>
    </footer>

    <script src="../js/adr-carousel.js"></script>
</body>
</html>