153 lines
No EOL
7.1 KiB
HTML
153 lines
No EOL
7.1 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block title %}Today's Log - Bullet Journal{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="card card--full">
|
|
<p class="card__eyebrow">Today</p>
|
|
<h2>{{ log.date.strftime('%A, %B %d, %Y') }}</h2>
|
|
|
|
<form method="POST" action="{{ url_for('main.log_edit', log_id=log.id) }}">
|
|
<!-- Prompt -->
|
|
<div class="form-group">
|
|
<label for="prompt">Daily Prompt</label>
|
|
<textarea id="prompt" name="prompt" rows="3" placeholder="What's on your mind today?">{{ log.prompt or '' }}</textarea>
|
|
<span class="form-help">Set the intention for your day.</span>
|
|
</div>
|
|
|
|
<!-- Notes -->
|
|
<div class="form-group">
|
|
<label for="notes">Notes</label>
|
|
<textarea id="notes" name="notes" rows="4" placeholder="Free-form notes...">{{ log.notes or '' }}</textarea>
|
|
</div>
|
|
|
|
<!-- Bullets Section -->
|
|
<div class="bullets-section">
|
|
<h3>Bullets & Insights</h3>
|
|
<div class="bullets-list" id="bullets-list">
|
|
{% for item in log.items %}
|
|
<div class="bullet-item" data-item-id="{{ item.id }}">
|
|
<div class="bullet-item__row">
|
|
<select name="item_type[]" class="bullet-item__type" aria-label="Item type">
|
|
<option value="bullet" {% if item.type == 'bullet' %}selected{% endif %}>Bullet</option>
|
|
<option value="task" {% if item.type == 'task' %}selected{% endif %}>Task</option>
|
|
<option value="note" {% if item.type == 'note' %}selected{% endif %}>Note</option>
|
|
</select>
|
|
<select name="item_symbol[]" class="bullet-item__symbol" aria-label="Symbol">
|
|
<option value="•" {% if item.symbol == '•' %}selected{% endif %}>•</option>
|
|
<option value="-" {% if item.symbol == '-' %}selected{% endif %}>-</option>
|
|
<option value="○" {% if item.symbol == '○' %}selected{% endif %}>○</option>
|
|
</select>
|
|
<input type="text" name="item_text[]" class="bullet-item__text" value="{{ item.text }}" placeholder="Add a bullet point..." aria-label="Bullet text">
|
|
<select name="item_status[]" class="bullet-item__status" aria-label="Status">
|
|
<option value="todo" {% if item.status == 'todo' %}selected{% endif %}>Todo</option>
|
|
<option value="doing" {% if item.status == 'doing' %}selected{% endif %}>Doing</option>
|
|
<option value="done" {% if item.status == 'done' %}selected{% endif %}>Done</option>
|
|
<option value="cancelled" {% if item.status == 'cancelled' %}selected{% endif %}>Cancelled</option>
|
|
</select>
|
|
<input type="hidden" name="item_id[]" value="{{ item.id }}">
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
<button type="button" class="btn btn-secondary btn-sm" onclick="addBullet()">+ Add Bullet</button>
|
|
</div>
|
|
|
|
<!-- Gratitude Section -->
|
|
<div class="gratitude-section">
|
|
<h3>Gratitude</h3>
|
|
<div class="gratitude-grid">
|
|
<div class="gratitude-item">
|
|
<label for="gratitude_0">1. I'm grateful for...</label>
|
|
<input type="text" id="gratitude_0" name="gratitude_0" value="{{ log.gratitude_list[0] if log.gratitude_list else '' }}" placeholder="Item 1">
|
|
</div>
|
|
<div class="gratitude-item">
|
|
<label for="gratitude_1">2. I'm grateful for...</label>
|
|
<input type="text" id="gratitude_1" name="gratitude_1" value="{{ log.gratitude_list[1] if log.gratitude_list else '' }}" placeholder="Item 2">
|
|
</div>
|
|
<div class="gratitude-item">
|
|
<label for="gratitude_2">3. I'm grateful for...</label>
|
|
<input type="text" id="gratitude_2" name="gratitude_2" value="{{ log.gratitude_list[2] if log.gratitude_list else '' }}" placeholder="Item 3">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Sleep Section -->
|
|
<div class="sleep-section">
|
|
<h3>Sleep</h3>
|
|
<div class="sleep-grid">
|
|
<div class="sleep-item">
|
|
<label for="bedtime">Bedtime</label>
|
|
<input type="text" id="bedtime" name="bedtime" value="{{ log.bedtime or '' }}" placeholder="e.g., 11:00 PM">
|
|
</div>
|
|
<div class="sleep-item">
|
|
<label for="wake_time">Wake Time</label>
|
|
<input type="text" id="wake_time" name="wake_time" value="{{ log.wake_time or '' }}" placeholder="e.g., 7:00 AM">
|
|
</div>
|
|
<div class="sleep-item">
|
|
<label for="sleep_quality">Sleep Quality</label>
|
|
<select id="sleep_quality" name="sleep_quality">
|
|
<option value="">Select...</option>
|
|
<option value="poor" {% if log.sleep_quality == 'poor' %}selected{% endif %}>Poor</option>
|
|
<option value="fair" {% if log.sleep_quality == 'fair' %}selected{% endif %}>Fair</option>
|
|
<option value="good" {% if log.sleep_quality == 'good' %}selected{% endif %}>Good</option>
|
|
<option value="excellent" {% if log.sleep_quality == 'excellent' %}selected{% endif %}>Excellent</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Mood -->
|
|
<div class="mood-section">
|
|
<h3>Mood</h3>
|
|
<div class="mood-selector">
|
|
<label for="mood">How are you feeling?</label>
|
|
<select id="mood" name="mood">
|
|
<option value="">Select mood...</option>
|
|
<option value="amazing" {% if log.mood == 'amazing' %}selected{% endif %}>Amazing</option>
|
|
<option value="good" {% if log.mood == 'good' %}selected{% endif %}>Good</option>
|
|
<option value="okay" {% if log.mood == 'okay' %}selected{% endif %}>Okay</option>
|
|
<option value="bad" {% if log.mood == 'bad' %}selected{% endif %}>Bad</option>
|
|
<option value="terrible" {% if log.mood == 'terrible' %}selected{% endif %}>Terrible</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Save Button -->
|
|
<button type="submit" class="btn btn-primary btn-block">Save Log</button>
|
|
</form>
|
|
</div>
|
|
|
|
<script>
|
|
function addBullet() {
|
|
const list = document.getElementById('bullets-list');
|
|
const newItem = document.createElement('div');
|
|
newItem.className = 'bullet-item';
|
|
newItem.dataset.itemId = '';
|
|
newItem.innerHTML = `
|
|
<div class="bullet-item__row">
|
|
<select name="item_type[]" class="bullet-item__type" aria-label="Item type">
|
|
<option value="bullet" selected>Bullet</option>
|
|
<option value="task">Task</option>
|
|
<option value="note">Note</option>
|
|
</select>
|
|
<select name="item_symbol[]" class="bullet-item__symbol" aria-label="Symbol">
|
|
<option value="•" selected>•</option>
|
|
<option value="-">-</option>
|
|
<option value="○">○</option>
|
|
</select>
|
|
<input type="text" name="item_text[]" class="bullet-item__text" placeholder="Add a bullet point..." aria-label="Bullet text">
|
|
<select name="item_status[]" class="bullet-item__status" aria-label="Status">
|
|
<option value="todo" selected>Todo</option>
|
|
<option value="doing">Doing</option>
|
|
<option value="done">Done</option>
|
|
<option value="cancelled">Cancelled</option>
|
|
</select>
|
|
<input type="hidden" name="item_id[]" value="">
|
|
</div>
|
|
`;
|
|
list.appendChild(newItem);
|
|
newItem.querySelector('.bullet-item__text').focus();
|
|
}
|
|
</script>
|
|
{% endblock %} |