9d390da76b
Update UI across all pages with: - New favicon and brand icons (favicon-new.svg, tractatus-icon-new.svg) - Theme CSS integration (tractatus-theme.min.css) - Correct GitHub repository links (AgenticGovernance/tractatus) - PWA manifest updates - Consistent branding colors and gradients 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
222 lines
10 KiB
HTML
222 lines
10 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Blog Curation | Tractatus Admin</title>
|
|
<link rel="stylesheet" href="/css/tailwind.css?v=1759833751">
|
|
<link rel="stylesheet" href="/css/tractatus-theme.min.css">
|
|
<script src="/js/admin/auth-check.js"></script>
|
|
</head>
|
|
<body class="bg-gray-50">
|
|
|
|
<!-- Navigation -->
|
|
<nav class="bg-white border-b border-gray-200">
|
|
<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">
|
|
<div class="h-8 w-8 bg-blue-600 rounded-lg flex items-center justify-center">
|
|
<svg aria-hidden="true" class="h-5 w-5 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"/>
|
|
</svg>
|
|
</div>
|
|
<span class="ml-3 text-xl font-bold text-gray-900">Blog Curation</span>
|
|
</div>
|
|
<div class="ml-10 flex items-baseline space-x-4">
|
|
<a href="#draft" class="nav-link active px-3 py-2 rounded-md text-sm font-medium">Draft Content</a>
|
|
<a href="#queue" class="nav-link px-3 py-2 rounded-md text-sm font-medium">Review Queue</a>
|
|
<a href="#guidelines" class="nav-link px-3 py-2 rounded-md text-sm font-medium">Guidelines</a>
|
|
<a href="/admin/dashboard.html" class="px-3 py-2 rounded-md text-sm font-medium text-gray-500 hover:text-gray-700">← Dashboard</a>
|
|
</div>
|
|
</div>
|
|
<div class="flex items-center">
|
|
<span id="admin-name" class="text-sm text-gray-600 mr-4"></span>
|
|
<button id="logout-btn" class="text-sm font-medium text-gray-700 hover:text-gray-900">
|
|
Logout
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<!-- Main Content -->
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
|
|
|
|
<!-- Tractatus Enforcement Notice -->
|
|
<div class="bg-blue-50 border border-blue-200 rounded-lg p-4 mb-6">
|
|
<div class="flex">
|
|
<div class="flex-shrink-0">
|
|
<svg aria-hidden="true" class="h-5 w-5 text-blue-600" fill="currentColor" viewBox="0 0 20 20">
|
|
<path fill-rule="evenodd" d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z" clip-rule="evenodd"/>
|
|
</svg>
|
|
</div>
|
|
<div class="ml-3">
|
|
<h3 class="text-sm font-medium text-blue-800">Tractatus Framework Enforcement Active</h3>
|
|
<div class="mt-2 text-sm text-blue-700">
|
|
<p>All AI-generated content is validated against:</p>
|
|
<ul class="list-disc list-inside mt-1 space-y-1">
|
|
<li><strong>inst_016:</strong> No fabricated statistics or unverifiable claims</li>
|
|
<li><strong>inst_017:</strong> No absolute assurance terms (guarantee, 100%, etc.)</li>
|
|
<li><strong>inst_018:</strong> No unverified production-ready claims</li>
|
|
</ul>
|
|
<p class="mt-2 text-xs">🤖 <strong>TRA-OPS-0002:</strong> AI suggests, human decides. All content requires human review and approval.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Draft Content Section -->
|
|
<div id="draft-section">
|
|
<h2 class="text-2xl font-bold text-gray-900 mb-6">Generate Blog Post Draft</h2>
|
|
|
|
<div class="grid grid-cols-1 lg:grid-cols-3 gap-6 mb-8">
|
|
<!-- Draft Form -->
|
|
<div class="lg:col-span-2">
|
|
<div class="bg-white rounded-lg shadow p-6">
|
|
<form id="draft-form">
|
|
<div class="space-y-4">
|
|
<!-- Topic -->
|
|
<div>
|
|
<label for="topic" class="block text-sm font-medium text-gray-700">Blog Post Topic *</label>
|
|
<input type="text" id="topic" name="topic" required
|
|
class="mt-1 block w-full border-gray-300 rounded-md shadow-sm focus:ring-blue-500 focus:border-blue-500"
|
|
placeholder="e.g., Understanding AI Boundary Enforcement in Production Systems">
|
|
</div>
|
|
|
|
<!-- Audience -->
|
|
<div>
|
|
<label for="audience" class="block text-sm font-medium text-gray-700">Target Audience *</label>
|
|
<select id="audience" name="audience" required
|
|
class="mt-1 block w-full border-gray-300 rounded-md shadow-sm focus:ring-blue-500 focus:border-blue-500">
|
|
<option value="">Select audience...</option>
|
|
<option value="researcher">Researchers (Academic, AI safety specialists)</option>
|
|
<option value="implementer">Implementers (Engineers, architects)</option>
|
|
<option value="leader">Leaders (Policy makers, ethicists)</option>
|
|
<option value="general">General (Mixed technical backgrounds)</option>
|
|
</select>
|
|
</div>
|
|
|
|
<!-- Length -->
|
|
<div>
|
|
<label for="length" class="block text-sm font-medium text-gray-700">Target Length</label>
|
|
<select id="length" name="length"
|
|
class="mt-1 block w-full border-gray-300 rounded-md shadow-sm focus:ring-blue-500 focus:border-blue-500">
|
|
<option value="short">Short (600-900 words)</option>
|
|
<option value="medium" selected>Medium (1000-1500 words)</option>
|
|
<option value="long">Long (1800-2500 words)</option>
|
|
</select>
|
|
</div>
|
|
|
|
<!-- Focus (optional) -->
|
|
<div>
|
|
<label for="focus" class="block text-sm font-medium text-gray-700">Specific Focus (Optional)</label>
|
|
<input type="text" id="focus" name="focus"
|
|
class="mt-1 block w-full border-gray-300 rounded-md shadow-sm focus:ring-blue-500 focus:border-blue-500"
|
|
placeholder="e.g., Real-world implementation challenges, case studies, best practices">
|
|
</div>
|
|
|
|
<!-- Submit -->
|
|
<div class="flex items-center justify-between">
|
|
<button type="submit" id="draft-btn"
|
|
class="bg-blue-600 text-white px-6 py-2 rounded-md font-medium hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500">
|
|
Generate Draft
|
|
</button>
|
|
<span id="draft-status" class="text-sm text-gray-500"></span>
|
|
</div>
|
|
</form>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Quick Actions -->
|
|
<div class="space-y-4">
|
|
<div class="bg-white rounded-lg shadow p-6">
|
|
<h3 class="text-lg font-medium text-gray-900 mb-4">Quick Actions</h3>
|
|
<div class="space-y-3">
|
|
<button id="suggest-topics-btn"
|
|
class="w-full text-left px-4 py-3 bg-gray-50 hover:bg-gray-100 rounded-md border border-gray-200">
|
|
<div class="font-medium text-gray-900">Suggest Topics</div>
|
|
<div class="text-sm text-gray-500">Get AI topic ideas for editorial calendar</div>
|
|
</button>
|
|
<button id="analyze-content-btn"
|
|
class="w-full text-left px-4 py-3 bg-gray-50 hover:bg-gray-100 rounded-md border border-gray-200">
|
|
<div class="font-medium text-gray-900">Analyze Content</div>
|
|
<div class="text-sm text-gray-500">Check existing content for compliance</div>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="bg-white rounded-lg shadow p-6">
|
|
<h3 class="text-lg font-medium text-gray-900 mb-2">Statistics</h3>
|
|
<div class="space-y-3">
|
|
<div>
|
|
<div class="text-2xl font-bold text-gray-900" id="stat-pending-drafts">-</div>
|
|
<div class="text-sm text-gray-500">Pending Drafts</div>
|
|
</div>
|
|
<div>
|
|
<div class="text-2xl font-bold text-gray-900" id="stat-published-posts">-</div>
|
|
<div class="text-sm text-gray-500">Published Posts</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Review Queue Section -->
|
|
<div id="queue-section" class="hidden">
|
|
<h2 class="text-2xl font-bold text-gray-900 mb-6">Blog Draft Review Queue</h2>
|
|
|
|
<div class="bg-white rounded-lg shadow">
|
|
<div class="px-6 py-4 border-b border-gray-200">
|
|
<div class="flex justify-between items-center">
|
|
<h3 class="text-lg font-medium text-gray-900">Pending Drafts</h3>
|
|
<button id="refresh-queue-btn" class="text-sm text-blue-600 hover:text-blue-800">
|
|
Refresh
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<div id="draft-queue" class="divide-y divide-gray-200">
|
|
<div class="px-6 py-8 text-center text-gray-500">Loading queue...</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Guidelines Section -->
|
|
<div id="guidelines-section" class="hidden">
|
|
<h2 class="text-2xl font-bold text-gray-900 mb-6">Editorial Guidelines</h2>
|
|
|
|
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
|
|
<div class="bg-white rounded-lg shadow p-6">
|
|
<h3 class="text-lg font-medium text-gray-900 mb-4">Writing Standards</h3>
|
|
<dl id="editorial-standards" class="space-y-3">
|
|
<div class="text-center text-gray-500">Loading guidelines...</div>
|
|
</dl>
|
|
</div>
|
|
|
|
<div class="bg-white rounded-lg shadow p-6">
|
|
<h3 class="text-lg font-medium text-gray-900 mb-4">Forbidden Patterns</h3>
|
|
<ul id="forbidden-patterns" class="space-y-2">
|
|
<li class="text-center text-gray-500">Loading patterns...</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mt-6 bg-white rounded-lg shadow p-6">
|
|
<h3 class="text-lg font-medium text-gray-900 mb-4">Core Principles</h3>
|
|
<ul id="core-principles" class="grid grid-cols-1 md:grid-cols-2 gap-4">
|
|
<li class="text-center text-gray-500">Loading principles...</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!-- Modals -->
|
|
<div id="modal-container"></div>
|
|
|
|
<script src="/js/admin/blog-curation.js?v=1759836000"></script>
|
|
|
|
</body>
|
|
</html>
|