right-justify the column total in a rounded pill

Asset/css/finance.css

@@ -2,13 +2,27 @@
  * FinanceBuddy styles.
  */
 
-/* Per-column net total in the column header (its own line, subtle pill). */
+/* The column header (.board-column-expanded-header) is a flex row, so the total is a flex item. To
+   drop it onto its own line under the title, let that header wrap (scoped with :has to headers that
+   actually contain the total -- i.e. enabled boards only) and give the total full width. No
+   background (dropped per request); "Total:" stays black, only the amount span is colored by sign. */
+.board-column-expanded-header:has(.fb-column-total) {
+    flex-wrap: wrap;
+}
+
 .fb-column-total {
+    flex-basis: 100%;
+    margin-top: 2px;
+    text-align: right;
+}
+
+/* The visible pill hugs the text (not the full width) and is right-justified on its line. */
+.fb-total-pill {
     display: inline-block;
-    margin-top: 3px;
     padding: 0 5px;
     font-weight: bold;
     font-size: 0.95em;
+    color: #000;
     background: rgba(0, 0, 0, 0.05);
     border-radius: 3px;
 }

Plugin.php

@@ -77,7 +77,7 @@ class Plugin extends Base
 
     public function getPluginVersion()
     {
-        return '1.0.3';
+        return '1.0.5';
     }
 
     public function getPluginHomepage()

Template/board/column_total.php

@@ -1,7 +1,8 @@
 <?php
 // Per-column net total in the column header (credits - debits). Shown in every column of an
-// enabled board, including "total R$0,00" -- never hidden on zero. Server-side, re-renders on
-// every board refresh.
+// enabled board, including "Total: R$0,00" -- never hidden on zero. Server-side, re-renders on
+// every board refresh. Rendered on its own full-width line under the title; "Total:" stays the
+// default (black) and only the amount is colored by sign.
 if (empty($column['project_id']) || ! $this->FinanceHelper->isEnabled($column['project_id'])) {
     return;
 }
@@ -9,16 +10,16 @@ if (empty($column['project_id']) || ! $this->FinanceHelper->isEnabled($column['p
 $net = $this->FinanceHelper->columnNet($column);
 
 if ($net > 0) {
-    $class = 'fb-column-total fb-total-credit';
+    $amount_class = 'fb-total-credit';
     $sign = '+';
 } elseif ($net < 0) {
-    $class = 'fb-column-total fb-total-debit';
+    $amount_class = 'fb-total-debit';
     $sign = '-';
 } else {
-    $class = 'fb-column-total fb-total-zero';
+    $amount_class = 'fb-total-zero';
     $sign = '';
 }
 ?>
-<div class="<?= $class ?>">
-    <?= t('Total') ?>: <span class="fb-amount"><?= $sign ?>R$<?= \Kanboard\Plugin\FinanceBuddy\Helper\FinanceHelper::money(abs($net)) ?></span>
+<div class="fb-column-total">
+    <span class="fb-total-pill"><?= t('Total') ?>: <span class="fb-amount <?= $amount_class ?>"><?= $sign ?>R$<?= \Kanboard\Plugin\FinanceBuddy\Helper\FinanceHelper::money(abs($net)) ?></span></span>
 </div>

VERSION

@@ -1 +1 @@
-FinanceBuddy v1.0.3
+FinanceBuddy v1.0.5