← back to AbramsOS
views/partials/header.ejs
102 lines
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title><%= typeof title !== 'undefined' ? title + ' · AbramsOS' : 'AbramsOS' %></title>
<link rel="stylesheet" href="/css/app.css">
<script>
(function () {
try {
var t = localStorage.getItem('theme') || 'dark';
document.documentElement.dataset.theme = t;
if (localStorage.getItem('sidenavCollapsed') === '1') document.documentElement.classList.add('nav-collapsed');
} catch (e) { document.documentElement.dataset.theme = 'dark'; }
})();
</script>
</head>
<body>
<div class="applayout">
<aside class="sidebar glass">
<div class="brand">
<button id="navToggle" class="nav-toggle" aria-label="Collapse menu" title="Collapse / expand menu">☰</button>
<a href="/" class="brand-name">AbramsOS</a>
<span class="version">v0.1</span>
</div>
<nav class="sidenav">
<a href="/"><span class="ic">🏠</span><span class="lb">Home</span></a>
<div class="nav-sec">Money & Claims</div>
<a href="/settlements"><span class="ic">⚖️</span><span class="lb">Settlements</span></a>
<a href="/claims"><span class="ic">📋</span><span class="lb">Claims</span></a>
<a href="/deadlines"><span class="ic">⏰</span><span class="lb">Deadlines</span></a>
<a href="/bills"><span class="ic">🧾</span><span class="lb">Bills</span></a>
<a href="/savings"><span class="ic">🐷</span><span class="lb">Savings</span></a>
<a href="/assets"><span class="ic">🏦</span><span class="lb">Assets</span></a>
<a href="/purchases"><span class="ic">🛍️</span><span class="lb">Purchases</span></a>
<a href="/reviews"><span class="ic">⭐</span><span class="lb">Reviews</span></a>
<div class="nav-sec">Health</div>
<a href="/health"><span class="ic">❤️</span><span class="lb">Health</span></a>
<a href="/biometrics"><span class="ic">📈</span><span class="lb">Biometrics</span></a>
<a href="/medications"><span class="ic">💊</span><span class="lb">Meds</span></a>
<a href="/prescriptions"><span class="ic">📝</span><span class="lb">Rx</span></a>
<a href="/recalls"><span class="ic">⚠️</span><span class="lb">Recalls</span></a>
<div class="nav-sec">Home & Life</div>
<a href="/household"><span class="ic">🏡</span><span class="lb">Household</span></a>
<a href="/warranties"><span class="ic">🛡️</span><span class="lb">Warranties</span></a>
<a href="/reorders"><span class="ic">🔁</span><span class="lb">Reorders</span></a>
<a href="/neighborhood"><span class="ic">👁️</span><span class="lb">Watch</span></a>
<div class="nav-sec">System</div>
<a href="/import"><span class="ic">⬇️</span><span class="lb">Import</span></a>
<a href="/connectors"><span class="ic">🔌</span><span class="lb">Connectors</span></a>
<a href="/audit"><span class="ic">🔍</span><span class="lb">Audit</span></a>
</nav>
<div class="side-actions">
<% if (typeof userId !== 'undefined' && userId) { %>
<form method="post" action="/signout" style="margin:0">
<input type="hidden" name="_csrf" value="<%= csrfToken %>">
<button class="signout-btn" type="submit">Sign out</button>
</form>
<% } %>
<button id="themeToggle" class="theme-toggle" aria-label="Toggle theme" title="Toggle dark/light">
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<circle cx="12" cy="12" r="4"></circle>
<path d="M12 2v2m0 16v2M4.93 4.93l1.41 1.41m11.32 11.32l1.41 1.41M2 12h2m16 0h2M4.93 19.07l1.41-1.41m11.32-11.32l1.41-1.41"></path>
</svg>
</button>
</div>
<script>
(function(){ try { var p = location.pathname;
document.querySelectorAll('.sidenav a').forEach(function(a){
var h = a.getAttribute('href');
if (h === p || (h !== '/' && p.indexOf(h) === 0)) a.classList.add('active');
});
var tg = document.getElementById('navToggle');
if (tg) tg.onclick = function(){
var on = document.documentElement.classList.toggle('nav-collapsed');
try { localStorage.setItem('sidenavCollapsed', on ? '1' : '0'); } catch(e){}
};
} catch(e){} })();
</script>
</aside>
<div class="content-wrap">
<% if (typeof userId !== 'undefined' && userId) { %>
<div class="aos-topbar glass">
<div class="aos-topbar-inner">
<span class="aos-tb-field">
<span class="aos-tb-label">Model</span>
<select id="aosChatModel"></select>
<button type="button" class="aos-chat-info" data-spec="model" title="Model spec">ⓘ</button>
</span>
<span class="aos-tb-field">
<span class="aos-tb-label">Agent</span>
<select id="aosChatAgent"></select>
<button type="button" class="aos-chat-info" data-spec="agent" title="Agent spec">ⓘ</button>
</span>
<span id="aosChatLane" class="aos-chat-lane" title="Where your data goes"></span>
<button type="button" id="aosChatAllSpecs" class="aos-chat-allspecs" title="All specs">All specs</button>
<button type="button" id="aosChatLauncher" class="aos-tb-ask">💬 Ask</button>
</div>
</div>
<% } %>
<main>