78 lines
3.6 KiB
HTML
78 lines
3.6 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block title %}{{ task.title }} · Steady{% endblock %}
|
|
|
|
{% block content %}
|
|
<article class="task-detail">
|
|
<div class="task-card__header">
|
|
<div>
|
|
<span class="badge badge--{{ task.priority }}">{{ task.priority|capitalize }}</span>
|
|
<span class="status">{{ task.status|replace('_', ' ')|title }}</span>
|
|
</div>
|
|
{% if task.due_date %}
|
|
<time datetime="{{ task.due_date.isoformat() }}">Due {{ task.due_date.strftime('%d %b %Y, %H:%M') }}</time>
|
|
{% endif %}
|
|
</div>
|
|
<h1>{{ task.title }}</h1>
|
|
{% if task.description %}<p class="task-description">{{ task.description }}</p>{% endif %}
|
|
|
|
<div class="progress-row progress-row--large">
|
|
<label for="task-progress">Progress</label>
|
|
<progress id="task-progress" max="100" value="{{ task.progress_percentage }}">
|
|
{{ task.progress_percentage }}%
|
|
</progress>
|
|
<span>{{ task.progress_percentage }}%</span>
|
|
</div>
|
|
|
|
<section aria-labelledby="steps-heading">
|
|
<h2 id="steps-heading">Small steps</h2>
|
|
{% if task.subtasks %}
|
|
<ul class="subtask-list">
|
|
{% for subtask in task.subtasks %}
|
|
<li class="subtask {% if subtask.completed %}subtask--done{% endif %}">
|
|
<form method="post" action="{{ url_for('tasks.toggle_subtask_status', task_id=task.id, subtask_id=subtask.id) }}">
|
|
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
|
|
<button class="subtask__toggle" type="submit" aria-label="Mark {{ subtask.title }} as {{ 'not completed' if subtask.completed else 'completed' }}">
|
|
<span aria-hidden="true">{{ '✓' if subtask.completed else '○' }}</span>
|
|
{{ subtask.title }}
|
|
</button>
|
|
</form>
|
|
</li>
|
|
{% endfor %}
|
|
</ul>
|
|
{% else %}
|
|
<p>No small steps yet. Add the easiest first move.</p>
|
|
{% endif %}
|
|
|
|
<form class="subtask-form" method="post" action="{{ url_for('tasks.create_subtask', task_id=task.id) }}">
|
|
{{ subtask_form.hidden_tag() }}
|
|
<div class="field">
|
|
{{ subtask_form.title.label }}
|
|
{{ subtask_form.title(placeholder="For example: open the document") }}
|
|
</div>
|
|
{{ subtask_form.submit(class="button button--quiet") }}
|
|
</form>
|
|
</section>
|
|
|
|
<div class="form-actions">
|
|
{% if task.status != 'done' %}
|
|
<a class="button button--complete" href="{{ url_for('tasks.focus_task', task_id=task.id) }}">Focus on this task</a>
|
|
<form method="post" action="{{ url_for('tasks.complete', task_id=task.id) }}">
|
|
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
|
|
<button class="button button--quiet" type="submit">Mark complete</button>
|
|
</form>
|
|
{% endif %}
|
|
<a class="button" href="{{ url_for('tasks.edit', task_id=task.id) }}">Edit task</a>
|
|
<a href="{{ url_for('tasks.index') }}">Back to tasks</a>
|
|
</div>
|
|
|
|
<details class="danger-zone">
|
|
<summary>Delete this task</summary>
|
|
<p>This permanently removes the task and its small steps.</p>
|
|
<form method="post" action="{{ url_for('tasks.delete', task_id=task.id) }}">
|
|
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
|
|
<button class="button button--danger" type="submit">Delete permanently</button>
|
|
</form>
|
|
</details>
|
|
</article>
|
|
{% endblock %}
|