john/tractatus
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat: Replace Research dropdown with mega-dropdown showing paper cards

Browse source 
Embeds the research modal's paper content directly into the navbar
Research dropdown as a wider mega-dropdown. Shows Recent Research papers
as side-by-side cards, Foundational section with edition selector pills
(Academic/Community/Policymakers), and quick links to Researchers,
Timeline, and Browse All Docs.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
TheFlow 2026-02-09 18:07:01 +13:00
parent fd3d935415
commit f2748c311c
1 changed files with 51 additions and 22 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

73
public/js/components/navbar.js
View file

@ -47,28 +47,57 @@ class TractatusNavbar {
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"/>
</svg>
</button>
<div class="nav-dropdown-panel hidden absolute left-0 top-full mt-1 w-64 bg-white rounded-lg shadow-lg border border-gray-200 py-2 z-50">
<a href="/architectural-alignment.html" class="block px-4 py-2 text-sm text-gray-700 hover:bg-blue-50 hover:text-blue-700 transition">
<span class="font-medium">Academic Paper</span>
<span class="block text-xs text-gray-500 mt-0.5">Full academic treatment with proofs</span>
</a>
<a href="/architectural-alignment-community.html" class="block px-4 py-2 text-sm text-gray-700 hover:bg-blue-50 hover:text-blue-700 transition">
<span class="font-medium">Community Paper</span>
<span class="block text-xs text-gray-500 mt-0.5">Practical guide for organisations</span>
</a>
<a href="/architectural-alignment-policymakers.html" class="block px-4 py-2 text-sm text-gray-700 hover:bg-blue-50 hover:text-blue-700 transition">
<span class="font-medium">Policymakers Paper</span>
<span class="block text-xs text-gray-500 mt-0.5">Regulatory and policy perspective</span>
</a>
<div class="border-t border-gray-100 my-1"></div>
<a href="/researcher.html" class="block px-4 py-2 text-sm text-gray-700 hover:bg-blue-50 hover:text-blue-700 transition">
<span class="font-medium">For Researchers</span>
<span class="block text-xs text-gray-500 mt-0.5">Open questions and collaboration</span>
</a>
<a href="/timeline.html" class="block px-4 py-2 text-sm text-gray-700 hover:bg-blue-50 hover:text-blue-700 transition">
<span class="font-medium">Research Timeline</span>
<span class="block text-xs text-gray-500 mt-0.5">Evolution of the research 2025-2026</span>
</a>
<div class="nav-dropdown-panel hidden absolute left-0 top-full mt-1 bg-white rounded-xl shadow-xl border border-gray-200 p-4 z-50" style="width:520px">
<!-- Recent Research -->
<p class="text-xs font-semibold text-gray-400 uppercase tracking-wider mb-2 px-1">Recent Research</p>
<div class="grid grid-cols-2 gap-2 mb-3">
<a href="/docs-viewer.html?slug=taonga-centred-steering-governance-polycentric-authority-for-sovereign-small-language-models"
class="border border-gray-200 rounded-lg p-3 hover:border-blue-300 hover:bg-blue-50/50 transition group">
<h4 class="text-sm font-semibold text-gray-900 group-hover:text-blue-700 transition-colors mb-1">Taonga-Centred Steering Governance</h4>
<p class="text-xs text-gray-500 mb-1.5">Polycentric authority for sovereign small language models</p>
<div class="flex items-center gap-2 text-xs text-gray-400">
<span>Feb 2026</span>
<span class="bg-gray-100 px-1.5 py-0.5 rounded text-gray-500">Draft</span>
</div>
</a>
<a href="/docs-viewer.html?slug=steering-vectors-mechanical-bias-sovereign-ai"
class="border border-gray-200 rounded-lg p-3 hover:border-blue-300 hover:bg-blue-50/50 transition group">
<h4 class="text-sm font-semibold text-gray-900 group-hover:text-blue-700 transition-colors mb-1">Steering Vectors &amp; Mechanical Bias</h4>
<p class="text-xs text-gray-500 mb-1.5">Inference-time debiasing for sovereign small language models</p>
<div class="flex items-center gap-2 text-xs text-gray-400">
<span>Feb 2026</span>
<span class="bg-gray-100 px-1.5 py-0.5 rounded text-gray-500">v1.1</span>
</div>
</a>
</div>
<!-- Foundational -->
<p class="text-xs font-semibold text-gray-400 uppercase tracking-wider mb-2 px-1">Foundational</p>
<div class="border border-gray-200 rounded-lg p-3 mb-3 hover:border-blue-300 hover:bg-blue-50/50 transition group">
<h4 class="text-sm font-semibold text-gray-900 group-hover:text-blue-700 transition-colors mb-1.5">Architectural Alignment</h4>
<p class="text-xs text-gray-500 mb-2">Interrupting neural reasoning through constitutional inference gating</p>
<div class="flex items-center gap-2">
<a href="/architectural-alignment.html" class="text-xs font-medium text-blue-600 hover:text-blue-800 bg-blue-50 px-2 py-1 rounded hover:bg-blue-100 transition">Academic</a>
<a href="/architectural-alignment-community.html" class="text-xs font-medium text-blue-600 hover:text-blue-800 bg-blue-50 px-2 py-1 rounded hover:bg-blue-100 transition">Community</a>
<a href="/architectural-alignment-policymakers.html" class="text-xs font-medium text-blue-600 hover:text-blue-800 bg-blue-50 px-2 py-1 rounded hover:bg-blue-100 transition">Policymakers</a>
<span class="text-xs text-gray-400 ml-auto">v2.1</span>
</div>
</div>
<!-- Quick links -->
<div class="border-t border-gray-100 pt-3 flex items-center justify-between">
<div class="flex gap-3">
<a href="/researcher.html" class="text-sm text-gray-600 hover:text-blue-700 transition">For Researchers</a>
<a href="/timeline.html" class="text-sm text-gray-600 hover:text-blue-700 transition">Research Timeline</a>
</div>
<a href="/docs.html" class="text-sm font-medium text-blue-600 hover:text-blue-800 transition flex items-center gap-1">
Browse All
<svg class="w-3.5 h-3.5" 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>
</a>
</div>
</div>
</div>