From: Christian Heller <c.heller@plomlompom.de>
Date: Sat, 8 Jun 2024 19:04:07 +0000 (+0200)
Subject: Improve multiple template layouts and refactor CSS.
X-Git-Url: https://plomlompom.com/repos/%7B%7Bprefix%7D%7D/%7B%7B%20web_path%20%7D%7D/%7B%7Bdb.prefix%7D%7D/static/todo?a=commitdiff_plain;h=83c31bdf2a1b2cd1f3beadee482feb91c64759f9;p=plomtask

Improve multiple template layouts and refactor CSS.
---

diff --git a/templates/_base.html b/templates/_base.html
index 0d2debe..0b44171 100644
--- a/templates/_base.html
+++ b/templates/_base.html
@@ -7,6 +7,9 @@ body {
   text-align: left;
   padding: 0;
 }
+input[type="text"] {
+  width: 100em;
+}
 input.btn-harmless {
   color: green;
 }
@@ -29,6 +32,11 @@ th, td {
 a {
   color: black;
 }
+table.edit_table > tbody > tr > td, table.main > tbody > tr > th {
+  border-bottom: 0.1em solid #bbbbbb;
+  padding-top: 0.5em;
+  padding-bottom: 0.5em;
+}
 {% block css %}
 {% endblock %}
 </style>
diff --git a/templates/condition.html b/templates/condition.html
index 8deb71c..7142363 100644
--- a/templates/condition.html
+++ b/templates/condition.html
@@ -3,34 +3,29 @@
 
 
 
-{% block css %}
-input[name="title"] {
-  width: 100em;
-}
-{% endblock %}
-
-
-
 {% block content %}
-<h3>{% if is_new %}NEW {% endif %}condition</h3>
+<h3>
+{% if is_new %}
+add NEW condition
+{% else %}
+edit condition of ID {{condition.id_}}
+{% endif %}
+</h3>
 <form action="condition?id={{condition.id_ or ''}}" method="POST">
-<table>
 
+<table class="edit_table">
 <tr>
 <th>title</th>
-<td><input name="title" value="{{condition.title.newest|e}}" />{% if condition.id_ %} [<a href="condition_titles?id={{condition.id_}}">history</a>]{% endif %}</td>
+<td><input name="title" type="text" value="{{condition.title.newest|e}}" />{% if condition.id_ %} [<a href="condition_titles?id={{condition.id_}}">history</a>]{% endif %}</td>
 <tr/>
-
 <tr>
 <th>is active</th>
 <td><input name="is_active" type="checkbox" {% if condition.is_active %}checked{% endif %} /></td>
 <tr/>
-
 <tr>
 <th>description</th>
 <td><textarea name="description">{{condition.description.newest|e}}</textarea>{% if condition.id_ %} [<a href="condition_descriptions?id={{condition.id_}}">history</a>]{% endif %}</td>
 <tr/>
-
 <tr>
 <th>enables</th>
 <td>
@@ -39,7 +34,6 @@ input[name="title"] {
 {% endfor %}
 </td>
 </tr>
-
 <tr>
 <th>disables</th>
 <td>
@@ -48,7 +42,6 @@ input[name="title"] {
 {% endfor %}
 </td>
 </tr>
-
 <tr>
 <th>enabled by</th>
 <td>
@@ -57,7 +50,6 @@ input[name="title"] {
 {% endfor %}
 </td>
 </tr>
-
 <tr>
 <th>disabled by</th>
 <td>
@@ -66,8 +58,8 @@ input[name="title"] {
 {% endfor %}
 </td>
 </tr>
-
 </table>
+
 {{ macros.edit_buttons() }}
 {% endblock %}
 
diff --git a/templates/day.html b/templates/day.html
index 3b2e96a..c3a20aa 100644
--- a/templates/day.html
+++ b/templates/day.html
@@ -4,26 +4,23 @@
 
 
 {% block css %}
-td, th, tr, table {
-  padding: 0;
-  margin: 0;
-}
 table {
   border-collapse: collapse;
 }
 th {
   border: 1px solid black;
 }
-td.cond_line_0 {
+td.cond_line_0, td.cond_line_1, td.cond_line_2 {
+  padding: 0;
   border-top: 1px solid white;
+}
+td.cond_line_0 {
   background-color: #bfbfbf;
 }
 td.cond_line_1 {
-  border-top: 1px solid white;
   background-color: #dfdfdf;
 }
 td.cond_line_2 {
-  border-top: 1px solid white;
   background-color: #fffff;
 }
 td.cond_line_corner {
@@ -36,10 +33,10 @@ td.todo_line {
   border-bottom: 1px solid #bfbfbf;
   height: 1.7em;
 }
-tr.inactive td.todo_line {
+tr.inactive > td.todo_line {
   background-color: #bfbfbf;
 }
-tr.hidden_undone td, tr.hidden_undone a {
+tr.hidden_undone > td, tr.hidden_undone a {
   color: #9f9f9f;
 }
 td.left_border {
diff --git a/templates/process.html b/templates/process.html
index 064e83d..4027f50 100644
--- a/templates/process.html
+++ b/templates/process.html
@@ -4,9 +4,6 @@
 
 
 {% block css %}
-input[type="text"] {
-  width: 100em;
-}
 details > summary::after {
   content: '[+]';
 }
@@ -16,11 +13,6 @@ details summary {
 details[open] > summary::after {
   content: '[-]';
 }
-table.main > tbody > tr > td, table.main > tbody > tr > th {
-  border-bottom: 0.1em solid #bbbbbb;
-  padding-top: 0.5em;
-  padding-bottom: 0.5em;
-}
 {% endblock %}
 
 
@@ -61,11 +53,11 @@ table.main > tbody > tr > td, table.main > tbody > tr > th {
 {% endif %}
 
 </td>
-<td>
 {% if (not step_node.is_explicit) and (not step_node.seen) %}
+<td>
 <input type="checkbox" name="suppresses" value="{{step_id}}" {% if step_node.is_suppressed %}checked{% endif %}> suppress
-{% endif %}
 </td>
+{% endif %}
 </tr>
 {% if step_node.is_explicit or not step_node.seen %}
 {% for substep_id, substep in step_node.steps.items() %}
@@ -85,48 +77,40 @@ edit process of ID {{process.id_}}
 {% endif %}
 </h3>
 <form action="process?id={{process.id_ or ''}}" method="POST">
-<table class="main">
 
+<table class="edit_table">
 <tr>
 <th>title</th>
-<td><input name="title" value="{{process.title.newest|e}}" />{% if process.id_ %} [<a href="process_titles?id={{process.id_}}">history</a>]{% endif %}</td>
+<td><input name="title" type="text" value="{{process.title.newest|e}}" />{% if process.id_ %} [<a href="process_titles?id={{process.id_}}">history</a>]{% endif %}</td>
 </tr>
-
 <tr>
 <th>default effort</th>
 <td><input name="effort" type="number" step=0.1 value={{process.effort.newest}} />{% if process.id_ %} [<a href="process_efforts?id={{process.id_}}">history</a>]{% endif %}</td>
 </tr>
-
 <tr>
 <th>description</th>
 <td><textarea name="description">{{process.description.newest|e}}</textarea><br />{% if process.id_ %} [<a href="process_descriptions?id={{process.id_}}">history</a>]{% endif %}</td>
 </tr>
-
 <tr>
 <th>calendarize</th>
 <td><input type="checkbox" name="calendarize" {% if process.calendarize %}checked {% endif %}</td>
 </tr>
-
 <tr>
 <th>conditions</th>
 <td>{{ macros.simple_checkbox_table("condition", process.conditions, "condition", "condition_candidates") }}</td>
 </tr>
-
 <tr>
 <th>blockers</th>
 <td>{{ macros.simple_checkbox_table("blocker", process.blockers, "condition", "condition_candidates") }}</td>
 </tr>
-
 <tr>
 <th>enables</th>
 <td>{{ macros.simple_checkbox_table("enables", process.enables, "condition", "condition_candidates") }}</td>
 </tr>
-
 <tr>
 <th>disables</th>
 <td>{{ macros.simple_checkbox_table("disables", process.disables, "condition", "condition_candidates") }}</td>
 </tr>
-
 <tr>
 <th>steps</th>
 <td>
@@ -138,23 +122,20 @@ edit process of ID {{process.id_}}
 add: <input name="new_top_step" list="process_candidates" autocomplete="off" value="{{preset_top_step or ''}}" />
 </td>
 </tr>
-
 <tr>
 <th>step of</th>
 <td>{{ macros.simple_checkbox_table("step_of", owners, "process", "process_candidates") }}</td>
 </tr>
-
 <tr>
 <th>todos</th>
 <td>
 <a href="todos?process_id={{process.id_}}">{{n_todos}}</a><br />
 </td>
 </tr>
-
 </table>
+
 {{ macros.edit_buttons() }}
 </form>
-
 {{ macros.datalist_of_titles("condition_candidates", condition_candidates) }}
 {{ macros.datalist_of_titles("process_candidates", process_candidates) }}
 {% endblock %}
diff --git a/templates/todo.html b/templates/todo.html
index 870eab3..05e5b62 100644
--- a/templates/todo.html
+++ b/templates/todo.html
@@ -6,58 +6,48 @@
 {% block content %}
 <h3>Todo: {{todo.title_then|e}}</h3>
 <form action="todo?id={{todo.id_}}" method="POST">
-<table>
 
+<table class="edit_table">
 <tr>
 <th>day</th>
 <td><a href="day?date={{todo.date}}">{{todo.date}}</a></td>
 </tr>
-
 <tr>
 <th>process</th>
 <td><a href="process?id={{todo.process.id_}}">{{todo.process.title.newest|e}}</a></td>
 </tr>
-
 <tr>
 <th>done</th>
 <td><input type="checkbox" name="done" {% if todo.is_done %}checked {% endif %} {% if not todo.is_doable %}disabled {% endif %}/><br /></td>
 </tr>
-
 <tr>
 <th>effort</th>
 <td><input type="number" name="effort" step=0.1 size=5 placeholder={{todo.effort_then}} value={{todo.effort}} /><br /></td>
 </tr>
-
 <tr>
 <th>comment</th>
-<td><input name="comment" value="{{todo.comment|e}}"/></td>
+<td><input name="comment" type="text" value="{{todo.comment|e}}"/></td>
 </tr>
-
 <tr>
 <th>calendarize</th>
 <td><input type="checkbox" name="calendarize" {% if todo.calendarize %}checked {% endif %}</td>
 </tr>
-
 <tr>
 <th>conditions</th>
 <td>{{ macros.simple_checkbox_table("condition", todo.conditions, "condition", "condition_candidates") }}</td>
 </tr>
-
 <tr>
 <th>blockers</th>
 <td>{{ macros.simple_checkbox_table("blocker", todo.blockers, "condition", "condition_candidates") }}</td>
 </tr>
-
 <tr>
 <th>enables</th>
 <td>{{ macros.simple_checkbox_table("enables", todo.enables, "condition", "condition_candidates") }}</td>
 </tr>
-
 <tr>
 <th>disables</th>
 <td>{{ macros.simple_checkbox_table("disables", todo.disables, "condition", "condition_candidates") }}</td>
 </tr>
-
 <tr>
 <th>parents</th>
 <td>
@@ -66,17 +56,15 @@
 {% endfor %}
 </td>
 </tr>
-
 <tr>
 <th>children</th>
 <td>{{ macros.simple_checkbox_table("adopt", todo.children, "todo", "todo_candidates", "adopt", true) }}<br />
-make: <input name="make" list="process_candidates" autocomplete="off" /></td>
+make: <input type="text" name="make" list="process_candidates" autocomplete="off" /></td>
 </tr>
-
 </table>
+
 {{ macros.edit_buttons() }}
 </form>
-
 {{ macros.datalist_of_titles("condition_candidates", condition_candidates) }}
 {{ macros.datalist_of_titles("process_candidates", process_candidates) }}
 <datalist id="todo_candidates">