238 lines
17 KiB
HTML
238 lines
17 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en" data-theme="dark">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>{{ page_title or "Life OS" }} - Life OS</title>
|
|
<link rel="stylesheet" href="/static/style.css">
|
|
</head>
|
|
<body>
|
|
<div class="app-layout">
|
|
<!-- Sidebar -->
|
|
<aside class="sidebar">
|
|
<div class="sidebar-header">
|
|
<a href="/" class="sidebar-logo">Life<span>OS</span></a>
|
|
</div>
|
|
<nav class="sidebar-nav">
|
|
<div class="nav-section">
|
|
<a href="/" class="nav-item {{ 'active' if active_nav == 'dashboard' }}">
|
|
<svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="3" width="7" height="7" rx="1"/><rect x="14" y="3" width="7" height="7" rx="1"/><rect x="3" y="14" width="7" height="7" rx="1"/><rect x="14" y="14" width="7" height="7" rx="1"/></svg>
|
|
Dashboard
|
|
</a>
|
|
<a href="/focus" class="nav-item {{ 'active' if active_nav == 'focus' }}">
|
|
<svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10"/><circle cx="12" cy="12" r="6"/><circle cx="12" cy="12" r="2"/></svg>
|
|
Focus
|
|
{% if sidebar.focus_count %}<span class="badge">{{ sidebar.focus_count }}</span>{% endif %}
|
|
</a>
|
|
<a href="/tasks" class="nav-item {{ 'active' if active_nav == 'tasks' }}">
|
|
<svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 11l3 3L22 4"/><path d="M21 12v7a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11"/></svg>
|
|
All Tasks
|
|
</a>
|
|
<a href="/projects" class="nav-item {{ 'active' if active_nav == 'projects' }}">
|
|
<svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z"/></svg>
|
|
Projects
|
|
</a>
|
|
<a href="/notes" class="nav-item {{ 'active' if active_nav == 'notes' }}">
|
|
<svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><path d="M14 2v6h6"/></svg>
|
|
Notes
|
|
</a>
|
|
<a href="/contacts" class="nav-item {{ 'active' if active_nav == 'contacts' }}">
|
|
<svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"/><circle cx="12" cy="7" r="4"/></svg>
|
|
Contacts
|
|
</a>
|
|
<a href="/links" class="nav-item {{ 'active' if active_nav == 'links' }}">
|
|
<svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"/><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"/></svg>
|
|
Links
|
|
</a>
|
|
<a href="/lists" class="nav-item {{ 'active' if active_nav == 'lists' }}">
|
|
<svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="8" y1="6" x2="21" y2="6"/><line x1="8" y1="12" x2="21" y2="12"/><line x1="8" y1="18" x2="21" y2="18"/><line x1="3" y1="6" x2="3.01" y2="6"/><line x1="3" y1="12" x2="3.01" y2="12"/><line x1="3" y1="18" x2="3.01" y2="18"/></svg>
|
|
Lists
|
|
</a>
|
|
<a href="/processes" class="nav-item {{ 'active' if active_nav == 'processes' }}">
|
|
<svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="3"/><path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83-2.83l.06-.06A1.65 1.65 0 0 0 4.68 15a1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 2.83-2.83l.06.06A1.65 1.65 0 0 0 9 4.68a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 2.83l-.06.06A1.65 1.65 0 0 0 19.4 9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z"/></svg>
|
|
Processes
|
|
</a>
|
|
<a href="/meetings" class="nav-item {{ 'active' if active_nav == 'meetings' }}">
|
|
<svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M23 21v-2a4 4 0 0 0-3-3.87"/><path d="M16 3.13a4 4 0 0 1 0 7.75"/></svg>
|
|
Meetings
|
|
</a>
|
|
<a href="/appointments" class="nav-item {{ 'active' if active_nav == 'appointments' }}">
|
|
<svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"/><line x1="16" y1="2" x2="16" y2="6"/><line x1="8" y1="2" x2="8" y2="6"/><line x1="3" y1="10" x2="21" y2="10"/></svg>
|
|
Appointments
|
|
</a>
|
|
<a href="/calendar" class="nav-item {{ 'active' if active_nav == 'calendar' }}">
|
|
<svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"/><line x1="16" y1="2" x2="16" y2="6"/><line x1="8" y1="2" x2="8" y2="6"/><line x1="3" y1="10" x2="21" y2="10"/><rect x="7" y="14" width="3" height="3" rx="0.5"/><rect x="14" y="14" width="3" height="3" rx="0.5"/></svg>
|
|
Calendar
|
|
</a>
|
|
<a href="/decisions" class="nav-item {{ 'active' if active_nav == 'decisions' }}">
|
|
<svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 22c5.523 0 10-4.477 10-10S17.523 2 12 2 2 6.477 2 12s4.477 10 10 10z"/><path d="M9 12l2 2 4-4"/></svg>
|
|
Decisions
|
|
</a>
|
|
<a href="/files" class="nav-item {{ 'active' if active_nav == 'files' }}">
|
|
<svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z"/><polyline points="13 2 13 9 20 9"/></svg>
|
|
Files
|
|
</a>
|
|
<a href="/weblinks" class="nav-item {{ 'active' if active_nav == 'weblinks' }}">
|
|
<svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"/><polyline points="15 3 21 3 21 9"/><line x1="10" y1="14" x2="21" y2="3"/></svg>
|
|
Weblinks
|
|
</a>
|
|
<a href="/time" class="nav-item {{ 'active' if active_nav == 'time' }}">
|
|
<svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></svg>
|
|
Time Log
|
|
</a>
|
|
<a href="/time-budgets" class="nav-item {{ 'active' if active_nav == 'time_budgets' }}">
|
|
<svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10"/><path d="M12 6v6l4 2"/><path d="M16 3l2 2-2 2"/></svg>
|
|
Time Budgets
|
|
</a>
|
|
<a href="/capture" class="nav-item {{ 'active' if active_nav == 'capture' }}">
|
|
<svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="22 12 16 12 14 15 10 15 8 12 2 12"/><path d="M5.45 5.11L2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.45-6.89A2 2 0 0 0 16.76 4H7.24a2 2 0 0 0-1.79 1.11z"/></svg>
|
|
Capture
|
|
{% if sidebar.capture_count %}<span class="badge">{{ sidebar.capture_count }}</span>{% endif %}
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Domain hierarchy -->
|
|
<div class="nav-section">
|
|
<div class="nav-section-label">Domains</div>
|
|
{% for domain in sidebar.domain_tree %}
|
|
<div class="domain-group">
|
|
<div class="domain-header" data-domain-id="{{ domain.id }}">
|
|
<span class="domain-dot" style="background: {{ domain.color or '#4F6EF7' }}"></span>
|
|
{{ domain.name }}
|
|
</div>
|
|
<div class="domain-children" data-domain-id="{{ domain.id }}">
|
|
{% for area in domain.areas %}
|
|
<div class="area-label">{{ area.name }}</div>
|
|
{% for p in area.projects %}
|
|
<a href="/projects/{{ p.id }}" class="project-link">{{ p.name }}</a>
|
|
{% endfor %}
|
|
{% endfor %}
|
|
{% for p in domain.standalone_projects %}
|
|
<a href="/projects/{{ p.id }}" class="project-link">{{ p.name }}</a>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
|
|
<div class="nav-section" style="margin-top: auto; padding-bottom: 12px;">
|
|
<a href="/admin/trash" class="nav-item {{ 'active' if active_nav == 'trash' }}">
|
|
<svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="3 6 5 6 21 6"/><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/></svg>
|
|
Trash
|
|
</a>
|
|
<a href="/domains" class="nav-item {{ 'active' if active_nav == 'domains' }}">
|
|
<svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="3"/><path d="M12 1v6m0 6v6m-7-7h6m6 0h6"/></svg>
|
|
Manage Domains
|
|
</a>
|
|
<a href="/areas" class="nav-item {{ 'active' if active_nav == 'areas' }}">
|
|
<svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="3" width="18" height="18" rx="2"/><line x1="3" y1="9" x2="21" y2="9"/><line x1="9" y1="21" x2="9" y2="9"/></svg>
|
|
Manage Areas
|
|
</a>
|
|
<div class="nav-item" onclick="toggleTheme()" style="cursor: pointer;">
|
|
<svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"/></svg>
|
|
Toggle Theme
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
</aside>
|
|
|
|
<!-- Main content -->
|
|
<main class="main-content">
|
|
<header class="topbar">
|
|
{% if request.state.environment == 'development' %}
|
|
<span class="topbar-env">DEV</span>
|
|
{% endif %}
|
|
<div class="topbar-spacer"></div>
|
|
<!-- Timer Pill (populated by JS) -->
|
|
<div id="timer-pill" class="timer-pill hidden">
|
|
<div class="timer-pill-dot"></div>
|
|
<a id="timer-pill-task" class="timer-pill-task" href="#"></a>
|
|
<span id="timer-pill-elapsed" class="timer-pill-elapsed">0:00</span>
|
|
<form method="POST" action="/time/stop" style="display:inline;">
|
|
<button type="submit" class="timer-pill-stop" title="Stop timer">■</button>
|
|
</form>
|
|
</div>
|
|
<button class="search-trigger" onclick="openSearch()" title="Search (Cmd/K)">
|
|
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="11" cy="11" r="8"/><line x1="21" y1="21" x2="16.65" y2="16.65"/></svg>
|
|
<span>Search...</span>
|
|
<kbd>⌘K</kbd>
|
|
</button>
|
|
</header>
|
|
|
|
<div class="page-content">
|
|
{% block content %}{% endblock %}
|
|
</div>
|
|
</main>
|
|
</div>
|
|
<!-- Search Modal -->
|
|
<div id="search-modal" class="search-modal hidden">
|
|
<div class="search-modal-backdrop" onclick="closeSearch()"></div>
|
|
<div class="search-modal-content">
|
|
<div class="search-modal-input-wrap">
|
|
<svg class="search-modal-icon" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="11" cy="11" r="8"/><line x1="21" y1="21" x2="16.65" y2="16.65"/></svg>
|
|
<input type="text" id="search-input" class="search-modal-input" placeholder="Search tasks, projects, notes..." autocomplete="off">
|
|
<kbd class="search-modal-esc" onclick="closeSearch()">Esc</kbd>
|
|
</div>
|
|
<div id="search-results" class="search-results"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Mobile Bottom Nav -->
|
|
<nav class="mobile-bottom-bar">
|
|
<a href="/" class="mobile-nav-item {% if active_nav == 'dashboard' %}active{% endif %}">
|
|
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="3" width="7" height="7" rx="1"/><rect x="14" y="3" width="7" height="7" rx="1"/><rect x="3" y="14" width="7" height="7" rx="1"/><rect x="14" y="14" width="7" height="7" rx="1"/></svg>
|
|
<span>Dashboard</span>
|
|
</a>
|
|
<a href="/focus" class="mobile-nav-item {% if active_nav == 'focus' %}active{% endif %}">
|
|
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10"/><circle cx="12" cy="12" r="6"/><circle cx="12" cy="12" r="2"/></svg>
|
|
<span>Focus</span>
|
|
</a>
|
|
<a href="/tasks" class="mobile-nav-item {% if active_nav == 'tasks' %}active{% endif %}">
|
|
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 11l3 3L22 4"/><path d="M21 12v7a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11"/></svg>
|
|
<span>Tasks</span>
|
|
</a>
|
|
<a href="/calendar" class="mobile-nav-item {% if active_nav == 'calendar' %}active{% endif %}">
|
|
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"/><line x1="16" y1="2" x2="16" y2="6"/><line x1="8" y1="2" x2="8" y2="6"/><line x1="3" y1="10" x2="21" y2="10"/></svg>
|
|
<span>Calendar</span>
|
|
</a>
|
|
<button class="mobile-nav-item" id="mobile-more-btn" onclick="toggleMobileMore()">
|
|
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="3" y1="6" x2="21" y2="6"/><line x1="3" y1="12" x2="21" y2="12"/><line x1="3" y1="18" x2="21" y2="18"/></svg>
|
|
<span>More</span>
|
|
</button>
|
|
</nav>
|
|
|
|
<!-- Mobile More Panel -->
|
|
<div id="mobile-more-panel" class="mobile-more-panel">
|
|
<div class="mobile-more-backdrop" onclick="toggleMobileMore()"></div>
|
|
<div class="mobile-more-content">
|
|
<a href="/notes" class="mobile-more-item">
|
|
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><path d="M14 2v6h6"/></svg>
|
|
Notes
|
|
</a>
|
|
<a href="/meetings" class="mobile-more-item">
|
|
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M23 21v-2a4 4 0 0 0-3-3.87"/><path d="M16 3.13a4 4 0 0 1 0 7.75"/></svg>
|
|
Meetings
|
|
</a>
|
|
<a href="/decisions" class="mobile-more-item">
|
|
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 22c5.523 0 10-4.477 10-10S17.523 2 12 2 2 6.477 2 12s4.477 10 10 10z"/><path d="M9 12l2 2 4-4"/></svg>
|
|
Decisions
|
|
</a>
|
|
<a href="/contacts" class="mobile-more-item">
|
|
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"/><circle cx="12" cy="7" r="4"/></svg>
|
|
Contacts
|
|
</a>
|
|
<a href="/weblinks" class="mobile-more-item">
|
|
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"/><polyline points="15 3 21 3 21 9"/><line x1="10" y1="14" x2="21" y2="3"/></svg>
|
|
Weblinks
|
|
</a>
|
|
<a href="/admin/trash" class="mobile-more-item">
|
|
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="3 6 5 6 21 6"/><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/></svg>
|
|
Admin
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="/static/app.js"></script>
|
|
</body>
|
|
</html>
|