right-justify the column total in a rounded pill

This commit is contained in:
2026-07-08 09:30:50 -03:00
parent 524f293e37
commit 3e0cf10d6c
2 changed files with 10 additions and 1 deletions

View File

@@ -13,9 +13,18 @@
.fb-column-total { .fb-column-total {
flex-basis: 100%; flex-basis: 100%;
margin-top: 2px; 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;
padding: 0 5px;
font-weight: bold; font-weight: bold;
font-size: 0.95em; font-size: 0.95em;
color: #000; color: #000;
background: rgba(0, 0, 0, 0.05);
border-radius: 3px;
} }
/* Keep the signed amount together ("-R$450,00"); a break before it (after "Total:") is fine. */ /* Keep the signed amount together ("-R$450,00"); a break before it (after "Total:") is fine. */

View File

@@ -21,5 +21,5 @@ if ($net > 0) {
} }
?> ?>
<div class="fb-column-total"> <div class="fb-column-total">
<?= t('Total') ?>: <span class="fb-amount <?= $amount_class ?>"><?= $sign ?>R$<?= \Kanboard\Plugin\FinanceBuddy\Helper\FinanceHelper::money(abs($net)) ?></span> <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> </div>