fix: FAQ modal scrolling and standardize footers
## FAQ Modal Fixes - Fix modal scrolling: changed max-h-[85vh] to h-[85vh] with min-h-0 - Added flex-shrink-0 to modal header for proper flex behavior - Users can now scroll through all 30 FAQ questions (was stuck at 8) - Enhanced markdown parsing with error handling and fallback ## UI Improvements - Removed Quick Actions section from FAQ page per user request - Standardized footer across 7 user-facing pages - Added Newsletter link under Community section in all footers ## Pages Updated - faq.html, researcher.html, implementer.html, leader.html - about.html, media-inquiry.html, case-submission.html ## Version - Bumped to 1.0.4 with force update enabled - Service worker cache updated 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
TheFlow
parent
98d2caa989
commit
a54eb6cffd
10 changed files with 935 additions and 217 deletions
|
|
@ -228,47 +228,54 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Footer with Te Tiriti Acknowledgment -->
|
<!-- Footer with Te Tiriti Acknowledgment -->
|
||||||
<footer class="bg-gray-900 text-gray-400 py-12">
|
<!-- Footer -->
|
||||||
|
<footer class="bg-gray-900 text-gray-400 py-12 mt-16" role="contentinfo">
|
||||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||||
<div class="grid grid-cols-1 md:grid-cols-4 gap-8">
|
<div class="grid grid-cols-1 md:grid-cols-5 gap-8">
|
||||||
<div>
|
<div>
|
||||||
<h3 class="text-white font-bold mb-4">Tractatus Framework</h3>
|
<h3 class="text-white font-semibold mb-4">Tractatus Framework</h3>
|
||||||
<p class="text-sm mb-3">
|
|
||||||
Preserving human agency through architectural constraints, not aspirational goals.
|
|
||||||
</p>
|
|
||||||
<p class="text-sm">
|
<p class="text-sm">
|
||||||
<a href="mailto:research@agenticgovernance.digital" class="text-blue-400 hover:text-blue-300 transition">research@agenticgovernance.digital</a>
|
Reference implementation of architectural AI safety constraints—structural governance validated in single-project deployment.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<h3 class="text-white font-bold mb-4">Audience Paths</h3>
|
<h3 class="text-white font-semibold mb-4">Resources</h3>
|
||||||
<ul class="space-y-2 text-sm">
|
|
||||||
<li><a href="/researcher.html" class="hover:text-white transition">Researchers</a></li>
|
|
||||||
<li><a href="/implementer.html" class="hover:text-white transition">Implementers</a></li>
|
|
||||||
<li><a href="/leader.html" class="hover:text-white transition">Leaders</a></li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<h3 class="text-white font-bold mb-4">Resources</h3>
|
|
||||||
<ul class="space-y-2 text-sm">
|
<ul class="space-y-2 text-sm">
|
||||||
<li><a href="/docs.html" class="hover:text-white transition">Documentation</a></li>
|
<li><a href="/docs.html" class="hover:text-white transition">Documentation</a></li>
|
||||||
<li><a href="/demos/classification-demo.html" class="hover:text-white transition">Interactive Demos</a></li>
|
<li><a href="/demos/tractatus-demo.html" class="hover:text-white transition">Interactive Demos</a></li>
|
||||||
<li><a href="/about.html" class="hover:text-white transition">About</a></li>
|
<li><a href="/researcher.html" class="hover:text-white transition">For Researchers</a></li>
|
||||||
<li><a href="/about/values.html" class="hover:text-white transition">Values</a></li>
|
<li><a href="/implementer.html" class="hover:text-white transition">For Implementers</a></li>
|
||||||
<li><a href="/media-inquiry.html" class="hover:text-white transition">Media Inquiries</a></li>
|
<li><a href="/leader.html" class="hover:text-white transition">For Leaders</a></li>
|
||||||
<li><a href="/case-submission.html" class="hover:text-white transition">Submit Case Study</a></li>
|
<li><a href="/about.html" class="hover:text-white transition">About & Values</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<h3 class="text-white font-bold mb-4">Te Tiriti o Waitangi</h3>
|
<h3 class="text-white font-semibold mb-4">Community</h3>
|
||||||
|
<ul class="space-y-2 text-sm">
|
||||||
|
<li><a href="/media-inquiry.html" class="hover:text-white transition">Media Inquiries</a></li>
|
||||||
|
<li><a href="/case-submission.html" class="hover:text-white transition">Submit Case Study</a></li>
|
||||||
|
<li><a href="/blog.html" class="hover:text-white transition">Blog</a></li>
|
||||||
|
<li><a href="/#newsletter" class="hover:text-white transition">Newsletter</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<h3 class="text-white font-semibold mb-4">Support This Work</h3>
|
||||||
|
<ul class="space-y-2 text-sm">
|
||||||
|
<li><a href="/koha.html" class="hover:text-white transition">Make a Donation</a></li>
|
||||||
|
<li><a href="/koha/transparency.html" class="hover:text-white transition">Transparency Dashboard</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<h3 class="text-white font-semibold mb-4">Acknowledgment</h3>
|
||||||
<p class="text-sm">
|
<p class="text-sm">
|
||||||
This framework is developed in Aotearoa New Zealand. We acknowledge <a href="/about/values.html#te-tiriti" class="text-blue-400 hover:text-blue-300 transition">Te Tiriti o Waitangi</a> and indigenous data sovereignty principles.
|
This framework acknowledges Te Tiriti o Waitangi and indigenous leadership in digital sovereignty.
|
||||||
|
Built with respect for CARE Principles and Māori data sovereignty.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="mt-8 pt-8 border-t border-gray-800 text-center text-sm space-y-2">
|
<div class="mt-8 pt-8 border-t border-gray-800 text-center text-sm space-y-2">
|
||||||
<p class="text-gray-300">Safety Through Structure, Not Aspiration | Built with <a href="https://claude.ai/claude-code" class="text-blue-400 hover:text-blue-300 transition" target="_blank" rel="noopener">Claude Code</a></p>
|
<p class="text-gray-300">Safety Through Structure, Not Aspiration | Built with <a href="https://claude.ai/claude-code" class="text-blue-400 hover:text-blue-300 transition" target="_blank" rel="noopener">Claude Code</a></p>
|
||||||
<p>© 2025 Tractatus AI Safety Framework. Licensed under <a href="https://www.apache.org/licenses/LICENSE-2.0" class="text-blue-400 hover:text-blue-300 transition" target="_blank" rel="noopener">Apache License 2.0</a>. <a href="/about/values.html" class="text-blue-400 hover:text-blue-300 transition">Read our values</a>.</p>
|
<p>© 2025 Tractatus AI Safety Framework. Licensed under <a href="https://www.apache.org/licenses/LICENSE-2.0" class="text-blue-400 hover:text-blue-300 transition" target="_blank" rel="noopener">Apache License 2.0</a>.</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</footer>
|
</footer>
|
||||||
|
|
|
||||||
|
|
@ -214,30 +214,49 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Footer -->
|
<!-- Footer -->
|
||||||
<footer class="bg-gray-900 text-gray-300 mt-16 py-12">
|
<footer class="bg-gray-900 text-gray-400 py-12 mt-16" role="contentinfo">
|
||||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||||
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
|
<div class="grid grid-cols-1 md:grid-cols-5 gap-8">
|
||||||
<div>
|
<div>
|
||||||
<h3 class="text-white font-semibold mb-4">Tractatus Framework</h3>
|
<h3 class="text-white font-semibold mb-4">Tractatus Framework</h3>
|
||||||
<p class="text-sm">
|
<p class="text-sm">
|
||||||
AI safety through architectural constraints and human agency preservation.
|
Reference implementation of architectural AI safety constraints—structural governance validated in single-project deployment.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<h3 class="text-white font-semibold mb-4">Quick Links</h3>
|
<h3 class="text-white font-semibold mb-4">Resources</h3>
|
||||||
<ul class="space-y-2 text-sm">
|
<ul class="space-y-2 text-sm">
|
||||||
<li><a href="/docs.html" class="hover:text-white transition">Documentation</a></li>
|
<li><a href="/docs.html" class="hover:text-white transition">Documentation</a></li>
|
||||||
<li><a href="/about.html" class="hover:text-white transition">About</a></li>
|
<li><a href="/demos/tractatus-demo.html" class="hover:text-white transition">Interactive Demos</a></li>
|
||||||
<li><a href="/about/values.html" class="hover:text-white transition">Values</a></li>
|
<li><a href="/researcher.html" class="hover:text-white transition">For Researchers</a></li>
|
||||||
|
<li><a href="/implementer.html" class="hover:text-white transition">For Implementers</a></li>
|
||||||
|
<li><a href="/leader.html" class="hover:text-white transition">For Leaders</a></li>
|
||||||
|
<li><a href="/about.html" class="hover:text-white transition">About & Values</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<h3 class="text-white font-semibold mb-4">Contact</h3>
|
<h3 class="text-white font-semibold mb-4">Community</h3>
|
||||||
<ul class="space-y-2 text-sm">
|
<ul class="space-y-2 text-sm">
|
||||||
<li><a href="/media-inquiry.html" class="hover:text-white transition">Media Inquiries</a></li>
|
<li><a href="/media-inquiry.html" class="hover:text-white transition">Media Inquiries</a></li>
|
||||||
<li><a href="/case-submission.html" class="hover:text-white transition">Submit Case Study</a></li>
|
<li><a href="/case-submission.html" class="hover:text-white transition">Submit Case Study</a></li>
|
||||||
|
<li><a href="/blog.html" class="hover:text-white transition">Blog</a></li>
|
||||||
|
<li><a href="/#newsletter" class="hover:text-white transition">Newsletter</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
|
<div>
|
||||||
|
<h3 class="text-white font-semibold mb-4">Support This Work</h3>
|
||||||
|
<ul class="space-y-2 text-sm">
|
||||||
|
<li><a href="/koha.html" class="hover:text-white transition">Make a Donation</a></li>
|
||||||
|
<li><a href="/koha/transparency.html" class="hover:text-white transition">Transparency Dashboard</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<h3 class="text-white font-semibold mb-4">Acknowledgment</h3>
|
||||||
|
<p class="text-sm">
|
||||||
|
This framework acknowledges Te Tiriti o Waitangi and indigenous leadership in digital sovereignty.
|
||||||
|
Built with respect for CARE Principles and Māori data sovereignty.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="mt-8 pt-8 border-t border-gray-800 text-center text-sm space-y-2">
|
<div class="mt-8 pt-8 border-t border-gray-800 text-center text-sm space-y-2">
|
||||||
<p class="text-gray-300">Safety Through Structure, Not Aspiration | Built with <a href="https://claude.ai/claude-code" class="text-blue-400 hover:text-blue-300 transition" target="_blank" rel="noopener">Claude Code</a></p>
|
<p class="text-gray-300">Safety Through Structure, Not Aspiration | Built with <a href="https://claude.ai/claude-code" class="text-blue-400 hover:text-blue-300 transition" target="_blank" rel="noopener">Claude Code</a></p>
|
||||||
|
|
|
||||||
485
public/faq.html
485
public/faq.html
|
|
@ -41,7 +41,7 @@
|
||||||
a:focus:not(:focus-visible) { outline: none; }
|
a:focus:not(:focus-visible) { outline: none; }
|
||||||
a:focus-visible { outline: 3px solid #3b82f6; outline-offset: 2px; }
|
a:focus-visible { outline: 3px solid #3b82f6; outline-offset: 2px; }
|
||||||
|
|
||||||
/* FAQ expandable sections */
|
/* FAQ expandable sections (modal) */
|
||||||
.faq-item { transition: all 0.2s ease; }
|
.faq-item { transition: all 0.2s ease; }
|
||||||
.faq-question { cursor: pointer; user-select: none; }
|
.faq-question { cursor: pointer; user-select: none; }
|
||||||
.faq-answer {
|
.faq-answer {
|
||||||
|
|
@ -56,6 +56,85 @@
|
||||||
}
|
}
|
||||||
.faq-item.open .faq-arrow { transform: rotate(180deg); }
|
.faq-item.open .faq-arrow { transform: rotate(180deg); }
|
||||||
|
|
||||||
|
/* Inline FAQ expandable sections (main page) */
|
||||||
|
.inline-faq-item { transition: all 0.2s ease; }
|
||||||
|
.inline-faq-question { cursor: pointer; user-select: none; }
|
||||||
|
.inline-faq-answer {
|
||||||
|
max-height: 0;
|
||||||
|
overflow: hidden;
|
||||||
|
transition: max-height 0.3s ease-out;
|
||||||
|
}
|
||||||
|
.inline-faq-item.open .inline-faq-answer { max-height: none; }
|
||||||
|
.inline-faq-item.open .faq-arrow { transform: rotate(180deg); }
|
||||||
|
|
||||||
|
/* Inline FAQ Answer Prose Styling */
|
||||||
|
.inline-faq-answer-content {
|
||||||
|
line-height: 1.75;
|
||||||
|
color: #374151;
|
||||||
|
}
|
||||||
|
.inline-faq-answer-content h1, .inline-faq-answer-content h2, .inline-faq-answer-content h3 {
|
||||||
|
font-weight: 700;
|
||||||
|
color: #111827;
|
||||||
|
margin-top: 2em;
|
||||||
|
margin-bottom: 1em;
|
||||||
|
line-height: 1.3;
|
||||||
|
}
|
||||||
|
.inline-faq-answer-content h1 { font-size: 1.875rem; }
|
||||||
|
.inline-faq-answer-content h2 { font-size: 1.5rem; }
|
||||||
|
.inline-faq-answer-content h3 { font-size: 1.25rem; }
|
||||||
|
.inline-faq-answer-content p { margin-bottom: 1.25em; }
|
||||||
|
.inline-faq-answer-content strong { font-weight: 700; color: #111827; }
|
||||||
|
.inline-faq-answer-content ul, .inline-faq-answer-content ol {
|
||||||
|
margin: 1.25em 0;
|
||||||
|
padding-left: 1.75em;
|
||||||
|
list-style-position: outside;
|
||||||
|
}
|
||||||
|
.inline-faq-answer-content ul { list-style-type: disc; }
|
||||||
|
.inline-faq-answer-content ol { list-style-type: decimal; }
|
||||||
|
.inline-faq-answer-content li { margin-bottom: 0.5em; padding-left: 0.375em; }
|
||||||
|
.inline-faq-answer-content li::marker { color: #3b82f6; font-weight: 600; }
|
||||||
|
.inline-faq-answer-content a {
|
||||||
|
color: #2563eb;
|
||||||
|
text-decoration: underline;
|
||||||
|
font-weight: 500;
|
||||||
|
transition: color 0.2s;
|
||||||
|
}
|
||||||
|
.inline-faq-answer-content a:hover { color: #1d4ed8; }
|
||||||
|
.inline-faq-answer-content code {
|
||||||
|
background-color: #f3f4f6;
|
||||||
|
padding: 0.125rem 0.375rem;
|
||||||
|
border-radius: 0.25rem;
|
||||||
|
font-size: 0.875em;
|
||||||
|
font-family: 'Monaco', 'Courier New', monospace;
|
||||||
|
color: #dc2626;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
.inline-faq-answer-content pre {
|
||||||
|
background-color: #1e293b;
|
||||||
|
border-radius: 0.5rem;
|
||||||
|
padding: 1.25rem;
|
||||||
|
margin: 1.5em 0;
|
||||||
|
overflow-x: auto;
|
||||||
|
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
|
||||||
|
}
|
||||||
|
.inline-faq-answer-content pre code {
|
||||||
|
background: none;
|
||||||
|
padding: 0;
|
||||||
|
border-radius: 0;
|
||||||
|
color: #e2e8f0;
|
||||||
|
font-size: 0.875rem;
|
||||||
|
font-weight: normal;
|
||||||
|
line-height: 1.6;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
.inline-faq-answer-content blockquote {
|
||||||
|
border-left: 4px solid #3b82f6;
|
||||||
|
padding-left: 1rem;
|
||||||
|
margin: 1.5em 0;
|
||||||
|
font-style: italic;
|
||||||
|
color: #6b7280;
|
||||||
|
}
|
||||||
|
|
||||||
/* Search highlighting */
|
/* Search highlighting */
|
||||||
.highlight { background-color: #fef08a; padding: 0 2px; }
|
.highlight { background-color: #fef08a; padding: 0 2px; }
|
||||||
|
|
||||||
|
|
@ -186,6 +265,31 @@
|
||||||
list-style: none;
|
list-style: none;
|
||||||
margin-left: -1.75em;
|
margin-left: -1.75em;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Modal styles */
|
||||||
|
#search-modal, #search-tips-modal {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#search-modal.show, #search-tips-modal.show {
|
||||||
|
display: flex !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Smooth modal animations */
|
||||||
|
#search-modal > div, #search-tips-modal > div {
|
||||||
|
animation: slideUp 0.3s ease-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes slideUp {
|
||||||
|
from {
|
||||||
|
transform: translateY(20px);
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
to {
|
||||||
|
transform: translateY(0);
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body class="bg-gray-50">
|
<body class="bg-gray-50">
|
||||||
|
|
@ -201,93 +305,103 @@
|
||||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||||
<div class="text-center">
|
<div class="text-center">
|
||||||
<h1 class="text-5xl font-bold text-gray-900 mb-4">Frequently Asked Questions</h1>
|
<h1 class="text-5xl font-bold text-gray-900 mb-4">Frequently Asked Questions</h1>
|
||||||
<p class="text-xl text-gray-600 max-w-3xl mx-auto">
|
<p class="text-xl text-gray-600 max-w-3xl mx-auto mb-8">
|
||||||
Common questions about Tractatus framework implementation, performance, and architecture
|
Common questions about Tractatus framework implementation, performance, and architecture
|
||||||
</p>
|
</p>
|
||||||
</div>
|
<button type="button" id="open-search-modal-btn" class="px-6 py-3 bg-blue-600 text-white rounded-lg font-semibold hover:bg-blue-700 transition inline-flex items-center gap-2 shadow-lg" aria-label="Open search">
|
||||||
</div>
|
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Search & Filters -->
|
|
||||||
<div class="bg-white border-b border-gray-200 sticky top-0 z-10 shadow-sm">
|
|
||||||
<div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 py-6">
|
|
||||||
<!-- Search -->
|
|
||||||
<div class="mb-4">
|
|
||||||
<div class="relative">
|
|
||||||
<input
|
|
||||||
type="text"
|
|
||||||
id="faq-search"
|
|
||||||
placeholder="Search questions..."
|
|
||||||
class="w-full px-4 py-3 pl-11 pr-4 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 transition"
|
|
||||||
aria-label="Search FAQ"
|
|
||||||
/>
|
|
||||||
<svg class="absolute left-3 top-3.5 h-5 w-5 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
||||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"/>
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"/>
|
||||||
</svg>
|
</svg>
|
||||||
</div>
|
<span>Search FAQ</span>
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Audience Filters -->
|
|
||||||
<div class="flex flex-wrap gap-2">
|
|
||||||
<button class="filter-pill active px-4 py-2 rounded-full text-sm font-medium bg-gray-100 text-gray-700 hover:bg-gray-200 transition" data-filter="all">
|
|
||||||
All Questions
|
|
||||||
</button>
|
|
||||||
<button class="filter-pill px-4 py-2 rounded-full text-sm font-medium bg-gray-100 text-gray-700 hover:bg-gray-200 transition" data-filter="researcher">
|
|
||||||
For Researchers
|
|
||||||
</button>
|
|
||||||
<button class="filter-pill px-4 py-2 rounded-full text-sm font-medium bg-gray-100 text-gray-700 hover:bg-gray-200 transition" data-filter="implementer">
|
|
||||||
For Implementers
|
|
||||||
</button>
|
|
||||||
<button class="filter-pill px-4 py-2 rounded-full text-sm font-medium bg-gray-100 text-gray-700 hover:bg-gray-200 transition" data-filter="leader">
|
|
||||||
For Leaders
|
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Results count -->
|
|
||||||
<div id="results-count" class="mt-4 text-sm text-gray-600"></div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- FAQ Content -->
|
<!-- FAQ Content -->
|
||||||
<main id="main-content" class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
|
<main id="main-content" class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
|
||||||
|
|
||||||
<!-- Quick Actions -->
|
<!-- Browse by Audience (Interactive Filters) -->
|
||||||
<div class="bg-blue-50 rounded-lg p-6 mb-8">
|
<div class="bg-white rounded-lg shadow-sm p-6 mb-8">
|
||||||
<h2 class="text-lg font-bold text-gray-900 mb-3">Quick Actions</h2>
|
<h2 class="text-xl font-bold text-gray-900 mb-4">Browse by Audience</h2>
|
||||||
<div class="grid grid-cols-1 md:grid-cols-3 gap-4">
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-4">
|
||||||
<a href="/downloads/tractatus-quickstart.tar.gz" class="flex items-center gap-2 text-blue-700 hover:text-blue-900 font-medium">
|
<button
|
||||||
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
class="category-filter-btn text-left p-4 border-2 border-purple-200 rounded-lg hover:border-purple-400 hover:bg-purple-50 transition group"
|
||||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/>
|
data-audience="researcher"
|
||||||
|
>
|
||||||
|
<div class="flex items-start gap-3">
|
||||||
|
<div class="w-10 h-10 bg-purple-100 rounded-lg flex items-center justify-center flex-shrink-0 group-hover:bg-purple-200 transition">
|
||||||
|
<svg class="w-5 h-5 text-purple-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.663 17h4.673M12 3v1m6.364 1.636l-.707.707M21 12h-1M4 12H3m3.343-5.657l-.707-.707m2.828 9.9a5 5 0 117.072 0l-.548.547A3.374 3.374 0 0014 18.469V19a2 2 0 11-4 0v-.531c0-.895-.356-1.754-.988-2.386l-.548-.547z"/>
|
||||||
</svg>
|
</svg>
|
||||||
Deployment Quickstart
|
|
||||||
</a>
|
|
||||||
<a href="/docs.html" class="flex items-center gap-2 text-blue-700 hover:text-blue-900 font-medium">
|
|
||||||
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
||||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/>
|
|
||||||
</svg>
|
|
||||||
Full Documentation
|
|
||||||
</a>
|
|
||||||
<a href="/demos/classification-demo.html" class="flex items-center gap-2 text-blue-700 hover:text-blue-900 font-medium">
|
|
||||||
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
||||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14 10l-2 1m0 0l-2-1m2 1v2.5M20 7l-2 1m2-1l-2-1m2 1v2.5M14 4l-2-1-2 1M4 7l2-1M4 7l2 1M4 7v2.5M12 21l-2-1m2 1l2-1m-2 1v-2.5M6 18l-2-1v-2.5M18 18l2-1v-2.5"/>
|
|
||||||
</svg>
|
|
||||||
Interactive Demos
|
|
||||||
</a>
|
|
||||||
</div>
|
</div>
|
||||||
|
<div class="flex-1 min-w-0">
|
||||||
|
<h3 class="font-semibold text-gray-900 group-hover:text-purple-900 transition">Researchers</h3>
|
||||||
|
<p class="text-sm text-gray-600 mt-1">Theory, validation, academic research</p>
|
||||||
|
</div>
|
||||||
|
<svg class="w-5 h-5 text-gray-400 group-hover:text-purple-600 transition flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"/>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<button
|
||||||
|
class="category-filter-btn text-left p-4 border-2 border-blue-200 rounded-lg hover:border-blue-400 hover:bg-blue-50 transition group"
|
||||||
|
data-audience="implementer"
|
||||||
|
>
|
||||||
|
<div class="flex items-start gap-3">
|
||||||
|
<div class="w-10 h-10 bg-blue-100 rounded-lg flex items-center justify-center flex-shrink-0 group-hover:bg-blue-200 transition">
|
||||||
|
<svg class="w-5 h-5 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 20l4-16m4 4l4 4-4 4M6 16l-4-4 4-4"/>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
<div class="flex-1 min-w-0">
|
||||||
|
<h3 class="font-semibold text-gray-900 group-hover:text-blue-900 transition">Implementers</h3>
|
||||||
|
<p class="text-sm text-gray-600 mt-1">Implementation, integration, deployment</p>
|
||||||
|
</div>
|
||||||
|
<svg class="w-5 h-5 text-gray-400 group-hover:text-blue-600 transition flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"/>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<button
|
||||||
|
class="category-filter-btn text-left p-4 border-2 border-green-200 rounded-lg hover:border-green-400 hover:bg-green-50 transition group"
|
||||||
|
data-audience="leader"
|
||||||
|
>
|
||||||
|
<div class="flex items-start gap-3">
|
||||||
|
<div class="w-10 h-10 bg-green-100 rounded-lg flex items-center justify-center flex-shrink-0 group-hover:bg-green-200 transition">
|
||||||
|
<svg class="w-5 h-5 text-green-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 13.255A23.931 23.931 0 0112 15c-3.183 0-6.22-.62-9-1.745M16 6V4a2 2 0 00-2-2h-4a2 2 0 00-2 2v2m4 6h.01M5 20h14a2 2 0 002-2V8a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"/>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
<div class="flex-1 min-w-0">
|
||||||
|
<h3 class="font-semibold text-gray-900 group-hover:text-green-900 transition">Leaders</h3>
|
||||||
|
<p class="text-sm text-gray-600 mt-1">Strategic business, organizational leadership</p>
|
||||||
|
</div>
|
||||||
|
<svg class="w-5 h-5 text-gray-400 group-hover:text-green-600 transition flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"/>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<p class="text-sm text-gray-500 mt-4 text-center">Click any category to see filtered questions in advanced search</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- FAQ Sections -->
|
<!-- Most Common Questions (Inline, Expandable) -->
|
||||||
<div id="faq-container">
|
<div class="bg-white rounded-lg shadow-sm p-8 mb-8">
|
||||||
<!-- Section will be populated by JavaScript -->
|
<h2 class="text-2xl font-bold text-gray-900 mb-6">Most Common Questions</h2>
|
||||||
|
<div id="inline-faq-container" class="space-y-4">
|
||||||
|
<!-- Will be populated by JavaScript -->
|
||||||
</div>
|
</div>
|
||||||
|
<div class="mt-6 text-center">
|
||||||
<!-- No results message -->
|
<button id="view-all-questions-btn" class="px-6 py-3 bg-blue-600 text-white rounded-lg font-semibold hover:bg-blue-700 transition inline-flex items-center gap-2 shadow-md">
|
||||||
<div id="no-results" class="hidden text-center py-12">
|
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||||
<svg class="mx-auto h-12 w-12 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"/>
|
||||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.172 16.172a4 4 0 015.656 0M9 10h.01M15 10h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"/>
|
|
||||||
</svg>
|
</svg>
|
||||||
<h3 class="mt-2 text-lg font-medium text-gray-900">No questions found</h3>
|
<span>View All Questions & Search</span>
|
||||||
<p class="mt-1 text-sm text-gray-500">Try adjusting your search or filter</p>
|
</button>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Still have questions? -->
|
<!-- Still have questions? -->
|
||||||
|
|
@ -297,60 +411,251 @@
|
||||||
Can't find what you're looking for? We're here to help.
|
Can't find what you're looking for? We're here to help.
|
||||||
</p>
|
</p>
|
||||||
<div class="flex flex-wrap justify-center gap-4">
|
<div class="flex flex-wrap justify-center gap-4">
|
||||||
<a href="/media-inquiry.html" class="bg-white text-blue-600 px-6 py-3 rounded-lg font-semibold hover:bg-gray-100 transition">
|
<a href="/case-submission.html" class="bg-white text-blue-600 px-6 py-3 rounded-lg font-semibold hover:bg-gray-100 transition inline-flex items-center gap-2">
|
||||||
Contact Us
|
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/>
|
||||||
|
</svg>
|
||||||
|
Submit a Case Study
|
||||||
</a>
|
</a>
|
||||||
<a href="https://github.com/AgenticGovernance/tractatus-framework/issues" target="_blank" rel="noopener noreferrer" class="bg-blue-700 text-white px-6 py-3 rounded-lg font-semibold hover:bg-blue-800 transition border-2 border-white">
|
<a href="https://github.com/AgenticGovernance/tractatus-framework/issues" target="_blank" rel="noopener noreferrer" class="bg-blue-700 text-white px-6 py-3 rounded-lg font-semibold hover:bg-blue-800 transition border-2 border-white inline-flex items-center gap-2">
|
||||||
|
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24">
|
||||||
|
<path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.430.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"/>
|
||||||
|
</svg>
|
||||||
GitHub Discussions
|
GitHub Discussions
|
||||||
</a>
|
</a>
|
||||||
|
<a href="/media-inquiry.html" class="bg-blue-500 text-white px-6 py-3 rounded-lg font-semibold hover:bg-blue-600 transition border-2 border-blue-300 inline-flex items-center gap-2">
|
||||||
|
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"/>
|
||||||
|
</svg>
|
||||||
|
Media Inquiry
|
||||||
|
</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
<!-- Footer -->
|
<!-- Footer -->
|
||||||
<footer class="bg-gray-900 text-gray-400 py-12 mt-16">
|
<footer class="bg-gray-900 text-gray-400 py-12 mt-16" role="contentinfo">
|
||||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||||
<div class="grid grid-cols-1 md:grid-cols-4 gap-8">
|
<div class="grid grid-cols-1 md:grid-cols-5 gap-8">
|
||||||
<div>
|
<div>
|
||||||
<h3 class="text-white font-bold mb-4">Tractatus Framework</h3>
|
<h3 class="text-white font-semibold mb-4">Tractatus Framework</h3>
|
||||||
<p class="text-sm">Safety Through Structure, Not Aspiration</p>
|
<p class="text-sm">
|
||||||
|
Reference implementation of architectural AI safety constraints—structural governance validated in single-project deployment.
|
||||||
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<h3 class="text-white font-bold mb-4">Audience Paths</h3>
|
<h3 class="text-white font-semibold mb-4">Resources</h3>
|
||||||
<ul class="space-y-2 text-sm">
|
|
||||||
<li><a href="/researcher.html" class="hover:text-white transition">Researchers</a></li>
|
|
||||||
<li><a href="/implementer.html" class="hover:text-white transition">Implementers</a></li>
|
|
||||||
<li><a href="/leader.html" class="hover:text-white transition">Leaders</a></li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<h3 class="text-white font-bold mb-4">Resources</h3>
|
|
||||||
<ul class="space-y-2 text-sm">
|
<ul class="space-y-2 text-sm">
|
||||||
<li><a href="/docs.html" class="hover:text-white transition">Documentation</a></li>
|
<li><a href="/docs.html" class="hover:text-white transition">Documentation</a></li>
|
||||||
<li><a href="/demos/classification-demo.html" class="hover:text-white transition">Interactive Demos</a></li>
|
<li><a href="/demos/tractatus-demo.html" class="hover:text-white transition">Interactive Demos</a></li>
|
||||||
<li><a href="/faq.html" class="hover:text-white transition">FAQ</a></li>
|
<li><a href="/researcher.html" class="hover:text-white transition">For Researchers</a></li>
|
||||||
|
<li><a href="/implementer.html" class="hover:text-white transition">For Implementers</a></li>
|
||||||
|
<li><a href="/leader.html" class="hover:text-white transition">For Leaders</a></li>
|
||||||
|
<li><a href="/about.html" class="hover:text-white transition">About & Values</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<h3 class="text-white font-bold mb-4">Community</h3>
|
<h3 class="text-white font-semibold mb-4">Community</h3>
|
||||||
<ul class="space-y-2 text-sm">
|
<ul class="space-y-2 text-sm">
|
||||||
<li><a href="/media-inquiry.html" class="hover:text-white transition">Media Inquiries</a></li>
|
<li><a href="/media-inquiry.html" class="hover:text-white transition">Media Inquiries</a></li>
|
||||||
<li><a href="/case-submission.html" class="hover:text-white transition">Submit Case Study</a></li>
|
<li><a href="/case-submission.html" class="hover:text-white transition">Submit Case Study</a></li>
|
||||||
|
<li><a href="/blog.html" class="hover:text-white transition">Blog</a></li>
|
||||||
|
<li><a href="/#newsletter" class="hover:text-white transition">Newsletter</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
|
<div>
|
||||||
|
<h3 class="text-white font-semibold mb-4">Support This Work</h3>
|
||||||
|
<ul class="space-y-2 text-sm">
|
||||||
|
<li><a href="/koha.html" class="hover:text-white transition">Make a Donation</a></li>
|
||||||
|
<li><a href="/koha/transparency.html" class="hover:text-white transition">Transparency Dashboard</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<h3 class="text-white font-semibold mb-4">Acknowledgment</h3>
|
||||||
|
<p class="text-sm">
|
||||||
|
This framework acknowledges Te Tiriti o Waitangi and indigenous leadership in digital sovereignty.
|
||||||
|
Built with respect for CARE Principles and Māori data sovereignty.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="mt-8 pt-8 border-t border-gray-800 text-center text-sm space-y-2">
|
<div class="mt-8 pt-8 border-t border-gray-800 text-center text-sm space-y-2">
|
||||||
<p class="text-gray-300">Built with <a href="https://claude.ai/claude-code" class="text-blue-400 hover:text-blue-300 transition" target="_blank" rel="noopener">Claude Code</a></p>
|
<p class="text-gray-300">Safety Through Structure, Not Aspiration | Built with <a href="https://claude.ai/claude-code" class="text-blue-400 hover:text-blue-300 transition" target="_blank" rel="noopener">Claude Code</a></p>
|
||||||
<p>© 2025 Tractatus AI Safety Framework. Licensed under <a href="https://www.apache.org/licenses/LICENSE-2.0" class="text-blue-400 hover:text-blue-300 transition" target="_blank" rel="noopener">Apache License 2.0</a>.</p>
|
<p>© 2025 Tractatus AI Safety Framework. Licensed under <a href="https://www.apache.org/licenses/LICENSE-2.0" class="text-blue-400 hover:text-blue-300 transition" target="_blank" rel="noopener">Apache License 2.0</a>.</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</footer>
|
</footer>
|
||||||
|
|
||||||
|
<!-- Search Modal -->
|
||||||
|
<div id="search-modal" class="fixed inset-0 bg-black bg-opacity-50 z-50 hidden items-center justify-center p-4">
|
||||||
|
<div class="bg-white rounded-lg shadow-2xl max-w-4xl w-full h-[85vh] flex flex-col overflow-hidden">
|
||||||
|
<!-- Modal Header -->
|
||||||
|
<div class="flex items-center justify-between p-6 border-b border-gray-200 flex-shrink-0">
|
||||||
|
<h2 class="text-2xl font-bold text-gray-900">Search FAQ</h2>
|
||||||
|
<button id="search-modal-close-btn"
|
||||||
|
class="p-2 text-gray-400 hover:text-gray-600 hover:bg-gray-100 rounded transition"
|
||||||
|
aria-label="Close search">
|
||||||
|
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/>
|
||||||
|
</svg>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Modal Content -->
|
||||||
|
<div id="search-modal-content" class="flex-1 overflow-y-auto p-6 min-h-0">
|
||||||
|
<!-- Search Input -->
|
||||||
|
<div class="mb-4">
|
||||||
|
<div class="relative">
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
id="faq-search"
|
||||||
|
placeholder="Search FAQ..."
|
||||||
|
class="w-full px-4 py-3 pl-11 pr-4 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent transition"
|
||||||
|
aria-label="Search FAQ"
|
||||||
|
/>
|
||||||
|
<svg class="absolute left-3 top-3.5 h-5 w-5 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"/>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Filters Row -->
|
||||||
|
<div class="flex flex-wrap items-center gap-3 mb-4">
|
||||||
|
<!-- Audience Filter -->
|
||||||
|
<div class="flex-1 min-w-[200px]">
|
||||||
|
<label for="filter-audience" class="sr-only">Filter by Audience</label>
|
||||||
|
<select id="filter-audience" class="w-full px-3 py-2 border border-gray-300 rounded-lg bg-white focus:ring-2 focus:ring-blue-500 focus:border-blue-500 transition">
|
||||||
|
<option value="all">All Audiences</option>
|
||||||
|
<option value="researcher">Researcher</option>
|
||||||
|
<option value="implementer">Implementer</option>
|
||||||
|
<option value="leader">Leader</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Clear Filters Button -->
|
||||||
|
<button id="clear-filters-btn" class="px-4 py-2 text-sm font-medium text-gray-700 bg-white border border-gray-300 rounded-lg hover:bg-gray-50 transition">
|
||||||
|
Clear Filters
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<!-- Search Tips Button -->
|
||||||
|
<button id="search-tips-btn" class="p-2 text-gray-600 hover:text-blue-600 hover:bg-white rounded-lg transition" title="Search Tips" aria-label="Show search tips">
|
||||||
|
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"/>
|
||||||
|
</svg>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Search Results Summary -->
|
||||||
|
<div id="search-results-summary" class="mb-4 text-sm text-gray-600">
|
||||||
|
<span id="search-results-count"></span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Search Results in Modal -->
|
||||||
|
<div id="search-results-modal" class="mt-6">
|
||||||
|
<div id="faq-container-modal" class="space-y-4">
|
||||||
|
<!-- Results will be populated here by JavaScript -->
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- No results message -->
|
||||||
|
<div id="no-results-modal" class="hidden text-center py-12">
|
||||||
|
<svg class="mx-auto h-12 w-12 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.172 16.172a4 4 0 015.656 0M9 10h.01M15 10h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"/>
|
||||||
|
</svg>
|
||||||
|
<h3 class="mt-2 text-lg font-medium text-gray-900">No questions found</h3>
|
||||||
|
<p class="mt-1 text-sm text-gray-500">Try adjusting your search or filter</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Search Tips Modal -->
|
||||||
|
<div id="search-tips-modal" class="fixed inset-0 bg-black bg-opacity-50 z-50 hidden items-center justify-center p-4">
|
||||||
|
<div class="bg-white rounded-lg shadow-2xl max-w-2xl w-full max-h-[80vh] flex flex-col">
|
||||||
|
<!-- Modal Header -->
|
||||||
|
<div class="flex items-center justify-between p-6 border-b border-gray-200">
|
||||||
|
<h2 class="text-2xl font-bold text-gray-900">Search Tips</h2>
|
||||||
|
<button id="search-tips-close-btn" class="p-2 text-gray-400 hover:text-gray-600 hover:bg-gray-100 rounded transition" aria-label="Close search tips">
|
||||||
|
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/>
|
||||||
|
</svg>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Modal Content -->
|
||||||
|
<div class="flex-1 overflow-y-auto p-6">
|
||||||
|
<div class="space-y-6">
|
||||||
|
<!-- Basic Search -->
|
||||||
|
<div>
|
||||||
|
<h3 class="text-lg font-semibold text-gray-900 mb-2">Basic Search</h3>
|
||||||
|
<p class="text-gray-600 mb-3">Type keywords in the search box to find relevant questions. The search looks through both questions and answers.</p>
|
||||||
|
<div class="bg-gray-50 p-3 rounded border border-gray-200">
|
||||||
|
<code class="text-sm text-gray-800">Example: "deployment" or "performance overhead"</code>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Filters -->
|
||||||
|
<div>
|
||||||
|
<h3 class="text-lg font-semibold text-gray-900 mb-2">Audience Filter</h3>
|
||||||
|
<p class="text-gray-600 mb-3">Filter questions by intended audience:</p>
|
||||||
|
<ul class="space-y-2 text-gray-600">
|
||||||
|
<li class="flex items-start">
|
||||||
|
<span class="font-medium text-blue-600 mr-2">•</span>
|
||||||
|
<span><strong>Researcher:</strong> Academic questions about theory and validation</span>
|
||||||
|
</li>
|
||||||
|
<li class="flex items-start">
|
||||||
|
<span class="font-medium text-blue-600 mr-2">•</span>
|
||||||
|
<span><strong>Implementer:</strong> Technical implementation and integration questions</span>
|
||||||
|
</li>
|
||||||
|
<li class="flex items-start">
|
||||||
|
<span class="font-medium text-blue-600 mr-2">•</span>
|
||||||
|
<span><strong>Leader:</strong> Strategic business and organizational questions</span>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Search Tips -->
|
||||||
|
<div>
|
||||||
|
<h3 class="text-lg font-semibold text-gray-900 mb-2">Search Tips</h3>
|
||||||
|
<ul class="space-y-2 text-gray-600">
|
||||||
|
<li class="flex items-start">
|
||||||
|
<span class="font-medium text-green-600 mr-2">✓</span>
|
||||||
|
<span>Use specific terms for better results</span>
|
||||||
|
</li>
|
||||||
|
<li class="flex items-start">
|
||||||
|
<span class="font-medium text-green-600 mr-2">✓</span>
|
||||||
|
<span>Filter by audience to narrow results</span>
|
||||||
|
</li>
|
||||||
|
<li class="flex items-start">
|
||||||
|
<span class="font-medium text-green-600 mr-2">✓</span>
|
||||||
|
<span>Questions are searchable by keywords</span>
|
||||||
|
</li>
|
||||||
|
<li class="flex items-start">
|
||||||
|
<span class="font-medium text-green-600 mr-2">✓</span>
|
||||||
|
<span>Click any question to expand the full answer</span>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Keyboard Shortcuts -->
|
||||||
|
<div>
|
||||||
|
<h3 class="text-lg font-semibold text-gray-900 mb-2">Keyboard Shortcuts</h3>
|
||||||
|
<div class="space-y-2">
|
||||||
|
<div class="flex items-center justify-between bg-gray-50 p-2 rounded">
|
||||||
|
<span class="text-gray-600">Close search</span>
|
||||||
|
<kbd class="px-2 py-1 bg-white border border-gray-300 rounded text-sm font-mono">Esc</kbd>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<!-- Version Management & PWA -->
|
<!-- Version Management & PWA -->
|
||||||
<script src="/js/version-manager.js"></script>
|
<script src="/js/version-manager.js"></script>
|
||||||
|
|
||||||
<script src="/js/faq.js?v=0.1.0.1760254958072"></script>
|
<script src="/js/faq.js?v=1760427000"></script>
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
||||||
|
|
@ -727,38 +727,49 @@ if (pressure.level === 'CRITICAL') {
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Footer -->
|
<!-- Footer -->
|
||||||
<footer class="bg-gray-900 text-gray-400 py-12">
|
<footer class="bg-gray-900 text-gray-400 py-12 mt-16" role="contentinfo">
|
||||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||||
<div class="grid grid-cols-1 md:grid-cols-4 gap-8">
|
<div class="grid grid-cols-1 md:grid-cols-5 gap-8">
|
||||||
<div>
|
<div>
|
||||||
<h3 class="text-white font-bold mb-4">Tractatus Framework</h3>
|
<h3 class="text-white font-semibold mb-4">Tractatus Framework</h3>
|
||||||
<p class="text-sm">
|
<p class="text-sm">
|
||||||
Preserving human agency through architectural constraints, not aspirational goals.
|
Reference implementation of architectural AI safety constraints—structural governance validated in single-project deployment.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<h3 class="text-white font-bold mb-4">Audience Paths</h3>
|
<h3 class="text-white font-semibold mb-4">Resources</h3>
|
||||||
<ul class="space-y-2 text-sm">
|
<ul class="space-y-2 text-sm">
|
||||||
<li><a href="/researcher.html" class="hover:text-white">Researchers</a></li>
|
<li><a href="/docs.html" class="hover:text-white transition">Documentation</a></li>
|
||||||
<li><a href="/implementer.html" class="hover:text-white">Implementers</a></li>
|
<li><a href="/demos/tractatus-demo.html" class="hover:text-white transition">Interactive Demos</a></li>
|
||||||
<li><a href="/leader.html" class="hover:text-white">Leaders</a></li>
|
<li><a href="/researcher.html" class="hover:text-white transition">For Researchers</a></li>
|
||||||
|
<li><a href="/implementer.html" class="hover:text-white transition">For Implementers</a></li>
|
||||||
|
<li><a href="/leader.html" class="hover:text-white transition">For Leaders</a></li>
|
||||||
|
<li><a href="/about.html" class="hover:text-white transition">About & Values</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<h3 class="text-white font-bold mb-4">Resources</h3>
|
<h3 class="text-white font-semibold mb-4">Community</h3>
|
||||||
<ul class="space-y-2 text-sm">
|
|
||||||
<li><a href="/docs.html" class="hover:text-white">Documentation</a></li>
|
|
||||||
<li><a href="/demos/classification-demo.html" class="hover:text-white">Interactive Demos</a></li>
|
|
||||||
<li><a href="/" class="hover:text-white">Home</a></li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<h3 class="text-white font-bold mb-4">Community</h3>
|
|
||||||
<ul class="space-y-2 text-sm">
|
<ul class="space-y-2 text-sm">
|
||||||
<li><a href="/media-inquiry.html" class="hover:text-white transition">Media Inquiries</a></li>
|
<li><a href="/media-inquiry.html" class="hover:text-white transition">Media Inquiries</a></li>
|
||||||
<li><a href="/case-submission.html" class="hover:text-white transition">Submit Case Study</a></li>
|
<li><a href="/case-submission.html" class="hover:text-white transition">Submit Case Study</a></li>
|
||||||
|
<li><a href="/blog.html" class="hover:text-white transition">Blog</a></li>
|
||||||
|
<li><a href="/#newsletter" class="hover:text-white transition">Newsletter</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
|
<div>
|
||||||
|
<h3 class="text-white font-semibold mb-4">Support This Work</h3>
|
||||||
|
<ul class="space-y-2 text-sm">
|
||||||
|
<li><a href="/koha.html" class="hover:text-white transition">Make a Donation</a></li>
|
||||||
|
<li><a href="/koha/transparency.html" class="hover:text-white transition">Transparency Dashboard</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<h3 class="text-white font-semibold mb-4">Acknowledgment</h3>
|
||||||
|
<p class="text-sm">
|
||||||
|
This framework acknowledges Te Tiriti o Waitangi and indigenous leadership in digital sovereignty.
|
||||||
|
Built with respect for CARE Principles and Māori data sovereignty.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="mt-8 pt-8 border-t border-gray-800 text-center text-sm space-y-2">
|
<div class="mt-8 pt-8 border-t border-gray-800 text-center text-sm space-y-2">
|
||||||
<p class="text-gray-300">Safety Through Structure, Not Aspiration | Built with <a href="https://claude.ai/claude-code" class="text-blue-400 hover:text-blue-300 transition" target="_blank" rel="noopener">Claude Code</a></p>
|
<p class="text-gray-300">Safety Through Structure, Not Aspiration | Built with <a href="https://claude.ai/claude-code" class="text-blue-400 hover:text-blue-300 transition" target="_blank" rel="noopener">Claude Code</a></p>
|
||||||
|
|
|
||||||
369
public/js/faq.js
369
public/js/faq.js
|
|
@ -2785,6 +2785,260 @@ See [Audit Guide](/downloads/implementation-guide.pdf) Section 9: "Regulatory Co
|
||||||
let currentFilter = 'all';
|
let currentFilter = 'all';
|
||||||
let currentSearchQuery = '';
|
let currentSearchQuery = '';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Open the search modal
|
||||||
|
*/
|
||||||
|
function openSearchModal() {
|
||||||
|
const modal = document.getElementById('search-modal');
|
||||||
|
const searchInput = document.getElementById('faq-search');
|
||||||
|
|
||||||
|
modal.classList.add('show');
|
||||||
|
|
||||||
|
// Focus on search input
|
||||||
|
setTimeout(() => {
|
||||||
|
searchInput.focus();
|
||||||
|
}, 100);
|
||||||
|
|
||||||
|
// Render initial results
|
||||||
|
renderFAQs();
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Close the search modal
|
||||||
|
*/
|
||||||
|
function closeSearchModal() {
|
||||||
|
const modal = document.getElementById('search-modal');
|
||||||
|
modal.classList.remove('show');
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Open search tips modal
|
||||||
|
*/
|
||||||
|
function openSearchTipsModal() {
|
||||||
|
const modal = document.getElementById('search-tips-modal');
|
||||||
|
modal.classList.add('show');
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Close search tips modal
|
||||||
|
*/
|
||||||
|
function closeSearchTipsModal() {
|
||||||
|
const modal = document.getElementById('search-tips-modal');
|
||||||
|
modal.classList.remove('show');
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Setup modal event listeners
|
||||||
|
*/
|
||||||
|
function setupModalListeners() {
|
||||||
|
// Open search modal button
|
||||||
|
const openBtn = document.getElementById('open-search-modal-btn');
|
||||||
|
if (openBtn) {
|
||||||
|
openBtn.addEventListener('click', openSearchModal);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Featured question buttons
|
||||||
|
const featuredBtns = document.querySelectorAll('.featured-question-btn');
|
||||||
|
featuredBtns.forEach(btn => {
|
||||||
|
btn.addEventListener('click', () => {
|
||||||
|
const searchQuery = btn.dataset.search;
|
||||||
|
openSearchModal();
|
||||||
|
// Set search value after modal opens
|
||||||
|
setTimeout(() => {
|
||||||
|
const searchInput = document.getElementById('faq-search');
|
||||||
|
if (searchInput) {
|
||||||
|
searchInput.value = searchQuery;
|
||||||
|
searchInput.dispatchEvent(new Event('input'));
|
||||||
|
}
|
||||||
|
}, 100);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
// Close search modal button
|
||||||
|
const closeBtn = document.getElementById('search-modal-close-btn');
|
||||||
|
if (closeBtn) {
|
||||||
|
closeBtn.addEventListener('click', closeSearchModal);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Search tips button
|
||||||
|
const tipsBtn = document.getElementById('search-tips-btn');
|
||||||
|
if (tipsBtn) {
|
||||||
|
tipsBtn.addEventListener('click', openSearchTipsModal);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Close search tips button
|
||||||
|
const tipCloseBtn = document.getElementById('search-tips-close-btn');
|
||||||
|
if (tipCloseBtn) {
|
||||||
|
tipCloseBtn.addEventListener('click', closeSearchTipsModal);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Clear filters button
|
||||||
|
const clearBtn = document.getElementById('clear-filters-btn');
|
||||||
|
if (clearBtn) {
|
||||||
|
clearBtn.addEventListener('click', () => {
|
||||||
|
currentFilter = 'all';
|
||||||
|
currentSearchQuery = '';
|
||||||
|
document.getElementById('faq-search').value = '';
|
||||||
|
document.getElementById('filter-audience').value = 'all';
|
||||||
|
renderFAQs();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Close modal on backdrop click
|
||||||
|
const searchModal = document.getElementById('search-modal');
|
||||||
|
if (searchModal) {
|
||||||
|
searchModal.addEventListener('click', (e) => {
|
||||||
|
if (e.target === searchModal) {
|
||||||
|
closeSearchModal();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
const tipsModal = document.getElementById('search-tips-modal');
|
||||||
|
if (tipsModal) {
|
||||||
|
tipsModal.addEventListener('click', (e) => {
|
||||||
|
if (e.target === tipsModal) {
|
||||||
|
closeSearchTipsModal();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Keyboard shortcuts
|
||||||
|
document.addEventListener('keydown', (e) => {
|
||||||
|
// Escape key closes modals
|
||||||
|
if (e.key === 'Escape') {
|
||||||
|
closeSearchModal();
|
||||||
|
closeSearchTipsModal();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Render top FAQs inline on the main page (expandable)
|
||||||
|
*/
|
||||||
|
function renderInlineFAQs() {
|
||||||
|
const container = document.getElementById('inline-faq-container');
|
||||||
|
if (!container) return;
|
||||||
|
|
||||||
|
// Get top 6 most important FAQs (mix of all audiences)
|
||||||
|
const topFAQs = FAQ_DATA.filter(faq => [19, 12, 27, 13, 1, 2].includes(faq.id));
|
||||||
|
|
||||||
|
// Sort by ID to maintain order
|
||||||
|
const sorted = topFAQs.sort((a, b) => a.id - b.id);
|
||||||
|
|
||||||
|
// Render as expandable items
|
||||||
|
container.innerHTML = sorted.map(faq => createInlineFAQItemHTML(faq)).join('');
|
||||||
|
|
||||||
|
// Add click listeners for expand/collapse
|
||||||
|
document.querySelectorAll('.inline-faq-question').forEach(question => {
|
||||||
|
question.addEventListener('click', () => {
|
||||||
|
const item = question.closest('.inline-faq-item');
|
||||||
|
const wasOpen = item.classList.contains('open');
|
||||||
|
|
||||||
|
// Close all other items
|
||||||
|
document.querySelectorAll('.inline-faq-item').forEach(other => {
|
||||||
|
other.classList.remove('open');
|
||||||
|
});
|
||||||
|
|
||||||
|
// Toggle this item (only if it wasn't already open)
|
||||||
|
if (!wasOpen) {
|
||||||
|
item.classList.add('open');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
// Apply syntax highlighting to code blocks
|
||||||
|
if (typeof hljs !== 'undefined') {
|
||||||
|
document.querySelectorAll('.inline-faq-answer-content pre code').forEach((block) => {
|
||||||
|
hljs.highlightElement(block);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Enable markdown links
|
||||||
|
document.querySelectorAll('.inline-faq-answer-content a').forEach(link => {
|
||||||
|
link.setAttribute('target', '_blank');
|
||||||
|
link.setAttribute('rel', 'noopener noreferrer');
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Create HTML for inline FAQ item (expandable on main page)
|
||||||
|
*/
|
||||||
|
function createInlineFAQItemHTML(faq) {
|
||||||
|
const audienceColors = {
|
||||||
|
'researcher': 'border-purple-200 hover:border-purple-300',
|
||||||
|
'implementer': 'border-blue-200 hover:border-blue-300',
|
||||||
|
'leader': 'border-green-200 hover:border-green-300'
|
||||||
|
};
|
||||||
|
|
||||||
|
const primaryAudience = faq.audience[0];
|
||||||
|
const colorClass = audienceColors[primaryAudience] || 'border-gray-200 hover:border-gray-300';
|
||||||
|
|
||||||
|
// Parse markdown answer
|
||||||
|
let answerHtml = faq.answer;
|
||||||
|
if (typeof marked !== 'undefined') {
|
||||||
|
answerHtml = marked.parse(faq.answer);
|
||||||
|
}
|
||||||
|
|
||||||
|
return `
|
||||||
|
<div class="inline-faq-item border-2 ${colorClass} rounded-lg transition">
|
||||||
|
<div class="inline-faq-question p-4 flex items-start justify-between cursor-pointer group">
|
||||||
|
<h3 class="text-lg font-semibold text-gray-900 group-hover:text-blue-600 transition flex-1 pr-4">${escapeHtml(faq.question)}</h3>
|
||||||
|
<svg class="faq-arrow w-6 h-6 text-gray-400 group-hover:text-blue-600 transition flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"/>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
<div class="inline-faq-answer">
|
||||||
|
<div class="inline-faq-answer-content p-6 pt-0">
|
||||||
|
${answerHtml}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Setup category filter button listeners
|
||||||
|
*/
|
||||||
|
function setupCategoryButtons() {
|
||||||
|
const categoryBtns = document.querySelectorAll('.category-filter-btn');
|
||||||
|
|
||||||
|
categoryBtns.forEach(btn => {
|
||||||
|
btn.addEventListener('click', () => {
|
||||||
|
const audience = btn.dataset.audience;
|
||||||
|
// Set filter and clear search
|
||||||
|
currentFilter = audience;
|
||||||
|
currentSearchQuery = '';
|
||||||
|
|
||||||
|
// Open modal (this will call renderFAQs automatically)
|
||||||
|
openSearchModal();
|
||||||
|
|
||||||
|
// Update the filter dropdown to match (UI sync only)
|
||||||
|
setTimeout(() => {
|
||||||
|
const filterSelect = document.getElementById('filter-audience');
|
||||||
|
if (filterSelect) {
|
||||||
|
filterSelect.value = audience;
|
||||||
|
}
|
||||||
|
}, 50);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Setup "View All Questions" button listener
|
||||||
|
*/
|
||||||
|
function setupViewAllButton() {
|
||||||
|
const viewAllBtn = document.getElementById('view-all-questions-btn');
|
||||||
|
|
||||||
|
if (viewAllBtn) {
|
||||||
|
viewAllBtn.addEventListener('click', () => {
|
||||||
|
currentFilter = 'all';
|
||||||
|
currentSearchQuery = '';
|
||||||
|
openSearchModal();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// Initialize on page load
|
// Initialize on page load
|
||||||
document.addEventListener('DOMContentLoaded', () => {
|
document.addEventListener('DOMContentLoaded', () => {
|
||||||
// Configure marked.js for better rendering
|
// Configure marked.js for better rendering
|
||||||
|
|
@ -2796,18 +3050,24 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
renderFAQs();
|
// Render top 6 FAQs inline on page load
|
||||||
|
renderInlineFAQs();
|
||||||
|
|
||||||
|
// Setup all event listeners
|
||||||
|
setupModalListeners();
|
||||||
setupSearchListener();
|
setupSearchListener();
|
||||||
setupFilterListeners();
|
setupFilterListeners();
|
||||||
|
setupCategoryButtons();
|
||||||
|
setupViewAllButton();
|
||||||
});
|
});
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Render FAQ items based on current filter and search
|
* Render FAQ items based on current filter and search
|
||||||
*/
|
*/
|
||||||
function renderFAQs() {
|
function renderFAQs() {
|
||||||
const container = document.getElementById('faq-container');
|
const container = document.getElementById('faq-container-modal');
|
||||||
const noResults = document.getElementById('no-results');
|
const noResults = document.getElementById('no-results-modal');
|
||||||
const resultsCount = document.getElementById('results-count');
|
const resultsCount = document.getElementById('search-results-count');
|
||||||
|
|
||||||
// Filter by audience
|
// Filter by audience
|
||||||
let filtered = FAQ_DATA;
|
let filtered = FAQ_DATA;
|
||||||
|
|
@ -2833,7 +3093,7 @@ function renderFAQs() {
|
||||||
if (filtered.length === 0) {
|
if (filtered.length === 0) {
|
||||||
container.classList.add('hidden');
|
container.classList.add('hidden');
|
||||||
noResults.classList.remove('hidden');
|
noResults.classList.remove('hidden');
|
||||||
resultsCount.textContent = '';
|
resultsCount.textContent = 'No questions found';
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -2844,22 +3104,72 @@ function renderFAQs() {
|
||||||
const filterText = currentFilter === 'all' ? 'all questions' : `${currentFilter} questions`;
|
const filterText = currentFilter === 'all' ? 'all questions' : `${currentFilter} questions`;
|
||||||
resultsCount.textContent = `Showing ${filtered.length} of ${FAQ_DATA.length} ${filterText}`;
|
resultsCount.textContent = `Showing ${filtered.length} of ${FAQ_DATA.length} ${filterText}`;
|
||||||
|
|
||||||
// Render FAQ items
|
console.log(`[FAQ] Rendering ${filtered.length} FAQs in modal (marked available: ${typeof marked !== 'undefined'})`);
|
||||||
|
|
||||||
|
// Render FAQ items (fast, no blocking)
|
||||||
container.innerHTML = filtered.map(faq => createFAQItemHTML(faq)).join('');
|
container.innerHTML = filtered.map(faq => createFAQItemHTML(faq)).join('');
|
||||||
|
|
||||||
// Add click listeners for expand/collapse
|
// Use event delegation for better performance (single listener instead of 31)
|
||||||
document.querySelectorAll('.faq-question').forEach(question => {
|
container.removeEventListener('click', handleFAQClick); // Remove old listener if exists
|
||||||
question.addEventListener('click', () => {
|
container.addEventListener('click', handleFAQClick);
|
||||||
const item = question.closest('.faq-item');
|
|
||||||
item.classList.toggle('open');
|
// Defer expensive syntax highlighting to avoid blocking UI
|
||||||
|
requestAnimationFrame(() => {
|
||||||
|
if (typeof hljs !== 'undefined') {
|
||||||
|
const codeBlocks = container.querySelectorAll('.faq-answer-content pre code');
|
||||||
|
// Highlight in small batches to avoid freezing
|
||||||
|
highlightCodeBlocksInBatches(codeBlocks);
|
||||||
|
}
|
||||||
});
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Event delegation handler for FAQ clicks (single listener for all FAQs)
|
||||||
|
*/
|
||||||
|
function handleFAQClick(event) {
|
||||||
|
const question = event.target.closest('.faq-question');
|
||||||
|
if (!question) return;
|
||||||
|
|
||||||
|
const item = question.closest('.faq-item');
|
||||||
|
if (item) {
|
||||||
|
item.classList.toggle('open');
|
||||||
|
|
||||||
|
// Lazy-load syntax highlighting only when FAQ is opened for first time
|
||||||
|
if (item.classList.contains('open') && !item.dataset.highlighted) {
|
||||||
|
const codeBlocks = item.querySelectorAll('.faq-answer-content pre code');
|
||||||
|
if (codeBlocks.length > 0 && typeof hljs !== 'undefined') {
|
||||||
|
codeBlocks.forEach(block => hljs.highlightElement(block));
|
||||||
|
item.dataset.highlighted = 'true';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Highlight code blocks in batches to avoid UI freeze
|
||||||
|
*/
|
||||||
|
function highlightCodeBlocksInBatches(codeBlocks, batchSize = 5) {
|
||||||
|
const blocks = Array.from(codeBlocks);
|
||||||
|
let index = 0;
|
||||||
|
|
||||||
|
function processBatch() {
|
||||||
|
const batch = blocks.slice(index, index + batchSize);
|
||||||
|
batch.forEach(block => {
|
||||||
|
if (typeof hljs !== 'undefined') {
|
||||||
|
hljs.highlightElement(block);
|
||||||
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
// Apply syntax highlighting to code blocks
|
index += batchSize;
|
||||||
if (typeof hljs !== 'undefined') {
|
|
||||||
document.querySelectorAll('.faq-answer-content pre code').forEach((block) => {
|
if (index < blocks.length) {
|
||||||
hljs.highlightElement(block);
|
// Schedule next batch
|
||||||
});
|
requestAnimationFrame(processBatch);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if (blocks.length > 0) {
|
||||||
|
processBatch();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -2872,7 +3182,17 @@ function createFAQItemHTML(faq) {
|
||||||
// Parse markdown to HTML
|
// Parse markdown to HTML
|
||||||
let answerHTML = faq.answer;
|
let answerHTML = faq.answer;
|
||||||
if (typeof marked !== 'undefined') {
|
if (typeof marked !== 'undefined') {
|
||||||
|
try {
|
||||||
answerHTML = marked.parse(faq.answer);
|
answerHTML = marked.parse(faq.answer);
|
||||||
|
} catch (error) {
|
||||||
|
console.error('[FAQ] Markdown parsing failed for FAQ', faq.id, error);
|
||||||
|
// Fallback to plain text with line breaks
|
||||||
|
answerHTML = `<p>${faq.answer.replace(/\n\n/g, '</p><p>').replace(/\n/g, '<br>')}</p>`;
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
console.warn('[FAQ] marked.js not loaded - using plain text');
|
||||||
|
// Fallback to plain text with line breaks
|
||||||
|
answerHTML = `<p>${faq.answer.replace(/\n\n/g, '</p><p>').replace(/\n/g, '<br>')}</p>`;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Highlight search query in rendered HTML (if searching)
|
// Highlight search query in rendered HTML (if searching)
|
||||||
|
|
@ -2952,20 +3272,15 @@ function setupSearchListener() {
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Setup filter pill listeners
|
* Setup filter dropdown listener
|
||||||
*/
|
*/
|
||||||
function setupFilterListeners() {
|
function setupFilterListeners() {
|
||||||
const pills = document.querySelectorAll('.filter-pill');
|
const audienceFilter = document.getElementById('filter-audience');
|
||||||
|
|
||||||
pills.forEach(pill => {
|
if (audienceFilter) {
|
||||||
pill.addEventListener('click', (e) => {
|
audienceFilter.addEventListener('change', (e) => {
|
||||||
// Update active state
|
currentFilter = e.target.value;
|
||||||
pills.forEach(p => p.classList.remove('active'));
|
|
||||||
e.target.classList.add('active');
|
|
||||||
|
|
||||||
// Update filter
|
|
||||||
currentFilter = e.target.dataset.filter;
|
|
||||||
renderFAQs();
|
renderFAQs();
|
||||||
});
|
});
|
||||||
});
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -562,33 +562,53 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Footer -->
|
<!-- Footer -->
|
||||||
<footer class="bg-gray-900 text-gray-400 py-12 mt-16">
|
<footer class="bg-gray-900 text-gray-400 py-12 mt-16" role="contentinfo">
|
||||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||||
<div class="grid grid-cols-1 md:grid-cols-3 gap-8 text-sm">
|
<div class="grid grid-cols-1 md:grid-cols-5 gap-8">
|
||||||
<div>
|
<div>
|
||||||
<h3 class="text-gray-200 font-semibold mb-3">Tractatus Framework</h3>
|
<h3 class="text-white font-semibold mb-4">Tractatus Framework</h3>
|
||||||
<p class="text-gray-500">
|
<p class="text-sm">
|
||||||
Research framework for structural AI governance. Apache 2.0 licence.
|
Reference implementation of architectural AI safety constraints—structural governance validated in single-project deployment.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<h3 class="text-gray-200 font-semibold mb-3">Documentation</h3>
|
<h3 class="text-white font-semibold mb-4">Resources</h3>
|
||||||
<ul class="space-y-2">
|
<ul class="space-y-2 text-sm">
|
||||||
<li><a href="/docs.html" class="hover:text-amber-400">Technical Specifications</a></li>
|
<li><a href="/docs.html" class="hover:text-white transition">Documentation</a></li>
|
||||||
<li><a href="/implementer.html" class="hover:text-amber-400">Implementation</a></li>
|
<li><a href="/demos/tractatus-demo.html" class="hover:text-white transition">Interactive Demos</a></li>
|
||||||
<li><a href="/researcher.html" class="hover:text-amber-400">Research</a></li>
|
<li><a href="/researcher.html" class="hover:text-white transition">For Researchers</a></li>
|
||||||
<li><a href="/about.html" class="hover:text-amber-400">About</a></li>
|
<li><a href="/implementer.html" class="hover:text-white transition">For Implementers</a></li>
|
||||||
|
<li><a href="/leader.html" class="hover:text-white transition">For Leaders</a></li>
|
||||||
|
<li><a href="/about.html" class="hover:text-white transition">About & Values</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<h3 class="text-gray-200 font-semibold mb-3">Status</h3>
|
<h3 class="text-white font-semibold mb-4">Community</h3>
|
||||||
<p class="text-gray-500">
|
<ul class="space-y-2 text-sm">
|
||||||
Early development, research validation phase. Open for organisational pilots and independent evaluation.
|
<li><a href="/media-inquiry.html" class="hover:text-white transition">Media Inquiries</a></li>
|
||||||
|
<li><a href="/case-submission.html" class="hover:text-white transition">Submit Case Study</a></li>
|
||||||
|
<li><a href="/blog.html" class="hover:text-white transition">Blog</a></li>
|
||||||
|
<li><a href="/#newsletter" class="hover:text-white transition">Newsletter</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<h3 class="text-white font-semibold mb-4">Support This Work</h3>
|
||||||
|
<ul class="space-y-2 text-sm">
|
||||||
|
<li><a href="/koha.html" class="hover:text-white transition">Make a Donation</a></li>
|
||||||
|
<li><a href="/koha/transparency.html" class="hover:text-white transition">Transparency Dashboard</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<h3 class="text-white font-semibold mb-4">Acknowledgment</h3>
|
||||||
|
<p class="text-sm">
|
||||||
|
This framework acknowledges Te Tiriti o Waitangi and indigenous leadership in digital sovereignty.
|
||||||
|
Built with respect for CARE Principles and Māori data sovereignty.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="border-t border-gray-800 mt-8 pt-8 text-center text-xs text-gray-600">
|
<div class="mt-8 pt-8 border-t border-gray-800 text-center text-sm space-y-2">
|
||||||
<p>Tractatus AI Safety Framework — Research Project</p>
|
<p class="text-gray-300">Safety Through Structure, Not Aspiration | Built with <a href="https://claude.ai/claude-code" class="text-blue-400 hover:text-blue-300 transition" target="_blank" rel="noopener">Claude Code</a></p>
|
||||||
|
<p>© 2025 Tractatus AI Safety Framework. Licensed under <a href="https://www.apache.org/licenses/LICENSE-2.0" class="text-blue-400 hover:text-blue-300 transition" target="_blank" rel="noopener">Apache License 2.0</a>.</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</footer>
|
</footer>
|
||||||
|
|
|
||||||
|
|
@ -168,30 +168,49 @@
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
<!-- Footer -->
|
<!-- Footer -->
|
||||||
<footer class="bg-gray-900 text-gray-300 mt-16 py-12">
|
<footer class="bg-gray-900 text-gray-400 py-12 mt-16" role="contentinfo">
|
||||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||||
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
|
<div class="grid grid-cols-1 md:grid-cols-5 gap-8">
|
||||||
<div>
|
<div>
|
||||||
<h3 class="text-white font-semibold mb-4">Tractatus Framework</h3>
|
<h3 class="text-white font-semibold mb-4">Tractatus Framework</h3>
|
||||||
<p class="text-sm">
|
<p class="text-sm">
|
||||||
AI safety through architectural constraints and human agency preservation.
|
Reference implementation of architectural AI safety constraints—structural governance validated in single-project deployment.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<h3 class="text-white font-semibold mb-4">Quick Links</h3>
|
<h3 class="text-white font-semibold mb-4">Resources</h3>
|
||||||
<ul class="space-y-2 text-sm">
|
<ul class="space-y-2 text-sm">
|
||||||
<li><a href="/docs.html" class="hover:text-white transition">Documentation</a></li>
|
<li><a href="/docs.html" class="hover:text-white transition">Documentation</a></li>
|
||||||
<li><a href="/about.html" class="hover:text-white transition">About</a></li>
|
<li><a href="/demos/tractatus-demo.html" class="hover:text-white transition">Interactive Demos</a></li>
|
||||||
<li><a href="/about/values.html" class="hover:text-white transition">Values</a></li>
|
<li><a href="/researcher.html" class="hover:text-white transition">For Researchers</a></li>
|
||||||
|
<li><a href="/implementer.html" class="hover:text-white transition">For Implementers</a></li>
|
||||||
|
<li><a href="/leader.html" class="hover:text-white transition">For Leaders</a></li>
|
||||||
|
<li><a href="/about.html" class="hover:text-white transition">About & Values</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<h3 class="text-white font-semibold mb-4">Contact</h3>
|
<h3 class="text-white font-semibold mb-4">Community</h3>
|
||||||
<ul class="space-y-2 text-sm">
|
<ul class="space-y-2 text-sm">
|
||||||
<li><a href="/media-inquiry.html" class="hover:text-white transition">Media Inquiries</a></li>
|
<li><a href="/media-inquiry.html" class="hover:text-white transition">Media Inquiries</a></li>
|
||||||
<li><a href="/case-submission.html" class="hover:text-white transition">Submit Case Study</a></li>
|
<li><a href="/case-submission.html" class="hover:text-white transition">Submit Case Study</a></li>
|
||||||
|
<li><a href="/blog.html" class="hover:text-white transition">Blog</a></li>
|
||||||
|
<li><a href="/#newsletter" class="hover:text-white transition">Newsletter</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
|
<div>
|
||||||
|
<h3 class="text-white font-semibold mb-4">Support This Work</h3>
|
||||||
|
<ul class="space-y-2 text-sm">
|
||||||
|
<li><a href="/koha.html" class="hover:text-white transition">Make a Donation</a></li>
|
||||||
|
<li><a href="/koha/transparency.html" class="hover:text-white transition">Transparency Dashboard</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<h3 class="text-white font-semibold mb-4">Acknowledgment</h3>
|
||||||
|
<p class="text-sm">
|
||||||
|
This framework acknowledges Te Tiriti o Waitangi and indigenous leadership in digital sovereignty.
|
||||||
|
Built with respect for CARE Principles and Māori data sovereignty.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="mt-8 pt-8 border-t border-gray-800 text-center text-sm space-y-2">
|
<div class="mt-8 pt-8 border-t border-gray-800 text-center text-sm space-y-2">
|
||||||
<p class="text-gray-300">Safety Through Structure, Not Aspiration | Built with <a href="https://claude.ai/claude-code" class="text-blue-400 hover:text-blue-300 transition" target="_blank" rel="noopener">Claude Code</a></p>
|
<p class="text-gray-300">Safety Through Structure, Not Aspiration | Built with <a href="https://claude.ai/claude-code" class="text-blue-400 hover:text-blue-300 transition" target="_blank" rel="noopener">Claude Code</a></p>
|
||||||
|
|
|
||||||
|
|
@ -465,33 +465,54 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Footer -->
|
<!-- Footer -->
|
||||||
<footer class="bg-gray-900 text-gray-400 py-12 mt-16">
|
<!-- Footer -->
|
||||||
|
<footer class="bg-gray-900 text-gray-400 py-12 mt-16" role="contentinfo">
|
||||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||||
<div class="grid grid-cols-1 md:grid-cols-3 gap-8 text-sm">
|
<div class="grid grid-cols-1 md:grid-cols-5 gap-8">
|
||||||
<div>
|
<div>
|
||||||
<h3 class="text-gray-200 font-semibold mb-3">Tractatus Framework</h3>
|
<h3 class="text-white font-semibold mb-4">Tractatus Framework</h3>
|
||||||
<p class="text-gray-500">
|
<p class="text-sm">
|
||||||
Research framework exploring architectural approaches to AI governance. Apache 2.0 licence.
|
Reference implementation of architectural AI safety constraints—structural governance validated in single-project deployment.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<h3 class="text-gray-200 font-semibold mb-3">Documentation</h3>
|
<h3 class="text-white font-semibold mb-4">Resources</h3>
|
||||||
<ul class="space-y-2">
|
<ul class="space-y-2 text-sm">
|
||||||
<li><a href="/docs.html" class="hover:text-amber-400">Technical Specifications</a></li>
|
<li><a href="/docs.html" class="hover:text-white transition">Documentation</a></li>
|
||||||
<li><a href="/implementer.html" class="hover:text-amber-400">Implementation</a></li>
|
<li><a href="/demos/tractatus-demo.html" class="hover:text-white transition">Interactive Demos</a></li>
|
||||||
<li><a href="/leader.html" class="hover:text-amber-400">For Leaders</a></li>
|
<li><a href="/researcher.html" class="hover:text-white transition">For Researchers</a></li>
|
||||||
<li><a href="/about.html" class="hover:text-amber-400">About</a></li>
|
<li><a href="/implementer.html" class="hover:text-white transition">For Implementers</a></li>
|
||||||
|
<li><a href="/leader.html" class="hover:text-white transition">For Leaders</a></li>
|
||||||
|
<li><a href="/about.html" class="hover:text-white transition">About & Values</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<h3 class="text-gray-200 font-semibold mb-3">Research Status</h3>
|
<h3 class="text-white font-semibold mb-4">Community</h3>
|
||||||
<p class="text-gray-500">
|
<ul class="space-y-2 text-sm">
|
||||||
Early-stage exploratory research. Observations from single-project context. Independent validation needed.
|
<li><a href="/media-inquiry.html" class="hover:text-white transition">Media Inquiries</a></li>
|
||||||
|
<li><a href="/case-submission.html" class="hover:text-white transition">Submit Case Study</a></li>
|
||||||
|
<li><a href="/blog.html" class="hover:text-white transition">Blog</a></li>
|
||||||
|
<li><a href="/#newsletter" class="hover:text-white transition">Newsletter</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<h3 class="text-white font-semibold mb-4">Support This Work</h3>
|
||||||
|
<ul class="space-y-2 text-sm">
|
||||||
|
<li><a href="/koha.html" class="hover:text-white transition">Make a Donation</a></li>
|
||||||
|
<li><a href="/koha/transparency.html" class="hover:text-white transition">Transparency Dashboard</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<h3 class="text-white font-semibold mb-4">Acknowledgment</h3>
|
||||||
|
<p class="text-sm">
|
||||||
|
This framework acknowledges Te Tiriti o Waitangi and indigenous leadership in digital sovereignty.
|
||||||
|
Built with respect for CARE Principles and Māori data sovereignty.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="border-t border-gray-800 mt-8 pt-8 text-center text-xs text-gray-600">
|
<div class="mt-8 pt-8 border-t border-gray-800 text-center text-sm space-y-2">
|
||||||
<p>Tractatus AI Safety Framework — Research Project</p>
|
<p class="text-gray-300">Safety Through Structure, Not Aspiration | Built with <a href="https://claude.ai/claude-code" class="text-blue-400 hover:text-blue-300 transition" target="_blank" rel="noopener">Claude Code</a></p>
|
||||||
|
<p>© 2025 Tractatus AI Safety Framework. Licensed under <a href="https://www.apache.org/licenses/LICENSE-2.0" class="text-blue-400 hover:text-blue-300 transition" target="_blank" rel="noopener">Apache License 2.0</a>.</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</footer>
|
</footer>
|
||||||
|
|
|
||||||
|
|
@ -5,7 +5,7 @@
|
||||||
* - PWA functionality
|
* - PWA functionality
|
||||||
*/
|
*/
|
||||||
|
|
||||||
const CACHE_VERSION = '1.0.0';
|
const CACHE_VERSION = '1.0.4';
|
||||||
const CACHE_NAME = `tractatus-v${CACHE_VERSION}`;
|
const CACHE_NAME = `tractatus-v${CACHE_VERSION}`;
|
||||||
const VERSION_CHECK_INTERVAL = 3600000; // 1 hour in milliseconds
|
const VERSION_CHECK_INTERVAL = 3600000; // 1 hour in milliseconds
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,11 +1,12 @@
|
||||||
{
|
{
|
||||||
"version": "1.0.0",
|
"version": "1.0.4",
|
||||||
"buildDate": "2025-10-14T10:30:00Z",
|
"buildDate": "2025-10-14T13:00:00Z",
|
||||||
"changelog": [
|
"changelog": [
|
||||||
"Landing page accuracy improvements",
|
"Fixed modal scrolling - changed to h-[85vh] with min-h-0 for proper flex scroll",
|
||||||
"FAQ enhanced for Leader audience",
|
"Removed Quick Actions section from FAQ page",
|
||||||
"Removed overstated claims"
|
"Standardized footer across all pages with newsletter link",
|
||||||
|
"Enhanced markdown parsing with error handling"
|
||||||
],
|
],
|
||||||
"forceUpdate": false,
|
"forceUpdate": true,
|
||||||
"minVersion": "1.0.0"
|
"minVersion": "1.0.4"
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue