Position and bugfixes of the done/due checkbox

Plugin.php

@@ -172,7 +172,7 @@ class Plugin extends Base
 
     public function getPluginVersion()
     {
-        return '2.0.0';
+        return '2.0.1';
     }
 
     public function getPluginHomepage()

Template/board/done_badge.php

@@ -12,7 +12,7 @@ $done = $this->OrganonDoneHelper->isDone($task);
 ?>
 <span class="organontweaks-done<?= $done ? ' is-done' : '' ?>">
     <?= $this->url->link(
-        $done ? '<i class="fa fa-check-square fa-fw"></i> '.t('Done') : '<i class="fa fa-square-o fa-fw"></i> '.t('Due'),
+        $done ? '<i class="fa fa-check-square"></i> '.t('Done') : '<i class="fa fa-square"></i> '.t('Due'),
         'DoneController',
         'toggle',
         array('plugin' => 'OrganonTweaks', 'task_id' => $task['id'], 'project_id' => $task['project_id'], 'from' => 'board'),

Template/layout/done_style.php

@@ -1,33 +1,29 @@
 <?php
 /**
- * Done/Due badge styling (emitted into the head when the feature is enabled). Two states via
+ * Done/Due badge styling (emitted into the head when the feature is enabled). NATURAL document flow --
- * .is-done. The Due colors reuse FinanceBuddy's debit badge (#b94a48 / white); Done is a light green
+ * the badge renders above the title (board card) or as a list item (task view); no absolute
- * with black font. On the board the badge is pinned top-right, below the header (the card .task-board
+ * positioning, so it adapts to any card / column / avatar / username size. Two states via .is-done:
- * is position:relative); the title reserves right padding so the badge does not cover it. In the task
+ * Due = black filled box + black text on a light red (#ef9a9a); Done = checked box, black on light
- * view it is a normal inline list item. Font size is inherited (0.9em on the board, matching the card
+ * green (#a5d6a7). Both states use black text (core's `.task-board a { color:#000 }` forces the icon
- * id / assignee). All values are safe to tune.
+ * black anyway, so the backgrounds are kept light for contrast). Colors are tunable.
  */
 ?>
 <style>
-.organontweaks-done a {
+span.organontweaks-done a {
+    display: inline-block;
     text-decoration: none;
-    padding: 0 5px;
+    padding: 3px 10px;
     border-radius: 3px;
-    background: #b94a48;
+    background: #ef9a9a;
-    color: #fff;
-}
-.organontweaks-done.is-done a {
-    background: #a5d6a7;
     color: #000;
     font-weight: bold;
 }
-.task-board .organontweaks-done {
+span.organontweaks-done.is-done a {
-    position: absolute;
+    background: #a5d6a7;
-    top: 24px;
+    color: #000;
-    right: 5px;
-    z-index: 5;
 }
-.task-board .task-board-title {
+.organontweaks-done {
-    padding-right: 4.2em;
+    display: inline-block;
+    margin: 1px 0;
 }
 </style>

Template/task/done_badge.php

@@ -12,7 +12,7 @@ $done = $this->OrganonDoneHelper->isDone($task);
 <li>
     <span class="organontweaks-done<?= $done ? ' is-done' : '' ?>">
         <?= $this->url->link(
-            $done ? '<i class="fa fa-check-square fa-fw"></i> '.t('Done') : '<i class="fa fa-square-o fa-fw"></i> '.t('Due'),
+            $done ? '<i class="fa fa-check-square"></i> '.t('Done') : '<i class="fa fa-square"></i> '.t('Due'),
             'DoneController',
             'toggle',
             array('plugin' => 'OrganonTweaks', 'task_id' => $task['id'], 'project_id' => $task['project_id'], 'from' => 'task'),

VERSION

@@ -1 +1 @@
-OrganonTweaks v2.0.0
+OrganonTweaks v2.0.1