lifeos-dev/templates/eisenhower.html

{% extends "base.html" %}
{% block content %}
<div class="page-header">
    <h1>Eisenhower Matrix</h1>
    <span class="text-muted">{{ total }} open tasks classified by priority &amp; urgency</span>
</div>

<div class="eisenhower-grid">
    <!-- Axis labels -->
    <div class="eisenhower-y-label">
        <span>Important</span>
    </div>

    <!-- Q1: Urgent + Important -->
    <div class="eisenhower-quadrant eisenhower-q1">
        <div class="eisenhower-quadrant-header">
            <h3>Do First</h3>
            <span class="eisenhower-quadrant-subtitle">Urgent &amp; Important</span>
            <span class="badge badge-red">{{ counts.do_first }}</span>
        </div>
        <div class="eisenhower-task-list">
            {% for task in quadrants.do_first %}
            <a href="/tasks/{{ task.id }}" class="eisenhower-task">
                <span class="priority-dot priority-{{ task.priority }}"></span>
                <span class="eisenhower-task-title">{{ task.title }}</span>
                {% if task.due_date %}
                <span class="eisenhower-task-due {% if task.due_date < today %}overdue{% endif %}">
                    {{ task.due_date.strftime('%b %-d') }}
                </span>
                {% endif %}
                {% if task.project_name %}
                <span class="eisenhower-task-project">{{ task.project_name }}</span>
                {% endif %}
            </a>
            {% else %}
            <div class="eisenhower-empty">No tasks</div>
            {% endfor %}
        </div>
    </div>

    <!-- Q2: Not Urgent + Important -->
    <div class="eisenhower-quadrant eisenhower-q2">
        <div class="eisenhower-quadrant-header">
            <h3>Schedule</h3>
            <span class="eisenhower-quadrant-subtitle">Not Urgent &amp; Important</span>
            <span class="badge badge-accent">{{ counts.schedule }}</span>
        </div>
        <div class="eisenhower-task-list">
            {% for task in quadrants.schedule %}
            <a href="/tasks/{{ task.id }}" class="eisenhower-task">
                <span class="priority-dot priority-{{ task.priority }}"></span>
                <span class="eisenhower-task-title">{{ task.title }}</span>
                {% if task.due_date %}
                <span class="eisenhower-task-due">{{ task.due_date.strftime('%b %-d') }}</span>
                {% endif %}
                {% if task.project_name %}
                <span class="eisenhower-task-project">{{ task.project_name }}</span>
                {% endif %}
            </a>
            {% else %}
            <div class="eisenhower-empty">No tasks</div>
            {% endfor %}
        </div>
    </div>

    <!-- Second row y-label -->
    <div class="eisenhower-y-label">
        <span>Not Important</span>
    </div>

    <!-- Q3: Urgent + Not Important -->
    <div class="eisenhower-quadrant eisenhower-q3">
        <div class="eisenhower-quadrant-header">
            <h3>Delegate</h3>
            <span class="eisenhower-quadrant-subtitle">Urgent &amp; Not Important</span>
            <span class="badge badge-amber">{{ counts.delegate }}</span>
        </div>
        <div class="eisenhower-task-list">
            {% for task in quadrants.delegate %}
            <a href="/tasks/{{ task.id }}" class="eisenhower-task">
                <span class="priority-dot priority-{{ task.priority }}"></span>
                <span class="eisenhower-task-title">{{ task.title }}</span>
                {% if task.due_date %}
                <span class="eisenhower-task-due {% if task.due_date < today %}overdue{% endif %}">
                    {{ task.due_date.strftime('%b %-d') }}
                </span>
                {% endif %}
                {% if task.project_name %}
                <span class="eisenhower-task-project">{{ task.project_name }}</span>
                {% endif %}
            </a>
            {% else %}
            <div class="eisenhower-empty">No tasks</div>
            {% endfor %}
        </div>
    </div>

    <!-- Q4: Not Urgent + Not Important -->
    <div class="eisenhower-quadrant eisenhower-q4">
        <div class="eisenhower-quadrant-header">
            <h3>Eliminate</h3>
            <span class="eisenhower-quadrant-subtitle">Not Urgent &amp; Not Important</span>
            <span class="badge badge-muted">{{ counts.eliminate }}</span>
        </div>
        <div class="eisenhower-task-list">
            {% for task in quadrants.eliminate %}
            <a href="/tasks/{{ task.id }}" class="eisenhower-task">
                <span class="priority-dot priority-{{ task.priority }}"></span>
                <span class="eisenhower-task-title">{{ task.title }}</span>
                {% if task.due_date %}
                <span class="eisenhower-task-due">{{ task.due_date.strftime('%b %-d') }}</span>
                {% endif %}
                {% if task.project_name %}
                <span class="eisenhower-task-project">{{ task.project_name }}</span>
                {% endif %}
            </a>
            {% else %}
            <div class="eisenhower-empty">No tasks</div>
            {% endfor %}
        </div>
    </div>

    <!-- X-axis labels -->
    <div class="eisenhower-x-spacer"></div>
    <div class="eisenhower-x-label">Urgent</div>
    <div class="eisenhower-x-label">Not Urgent</div>
</div>

{% endblock %}