From 6f4bff929e62b4f0507d3612bcd87949fab85afb Mon Sep 17 00:00:00 2001
From: Jan Bader <jan@javil.eu>
Date: Tue, 7 Dec 2021 14:49:58 +0000
Subject: [PATCH] Extract amount template

---
 web/account.html        |  4 +---
 web/amount.tpl          | 11 +++++++++++
 web/budget-sidebar.tpl  |  2 +-
 web/budget.html         |  4 +---
 web/budgeting.html      |  8 ++------
 web/static/css/main.css |  4 ++++
 6 files changed, 20 insertions(+), 13 deletions(-)
 create mode 100644 web/amount.tpl

diff --git a/web/account.html b/web/account.html
index 5059f87..676cdf4 100644
--- a/web/account.html
+++ b/web/account.html
@@ -29,9 +29,7 @@
         <td>
             <a href="transaction/{{.ID}}">{{.Memo}}</a>
         </td>
-        <td style="text-align: right;{{if .Amount.GetPositive}}{{else}}color: red;{{end}}">
-            {{printf "%.2f" .Amount.GetFloat64}}
-        </td>
+        {{template "amount-cell" .Amount}}
     </tr>
     {{end}}
 </table>
diff --git a/web/amount.tpl b/web/amount.tpl
new file mode 100644
index 0000000..1f6a9c6
--- /dev/null
+++ b/web/amount.tpl
@@ -0,0 +1,11 @@
+{{define "amount"}}
+        <span class="right {{if .GetPositive}}{{else}}negative{{end}}">
+            {{printf "%.2f" .GetFloat64}}
+        </span>
+{{end}}
+
+{{define "amount-cell"}}
+        <td class="right {{if .GetPositive}}{{else}}negative{{end}}">
+            {{printf "%.2f" .GetFloat64}}
+        </td>
+{{end}}
\ No newline at end of file
diff --git a/web/budget-sidebar.tpl b/web/budget-sidebar.tpl
index e8e1c86..a88bd06 100644
--- a/web/budget-sidebar.tpl
+++ b/web/budget-sidebar.tpl
@@ -9,7 +9,7 @@
                         {{range .Accounts}}
                                 <li>
                                         <a href="/budget/{{$.Budget.ID}}/account/{{.ID}}">{{.Name}}</a>
-                                        <span class="right">{{printf "%.2f" .Balance.GetFloat64}}</span>
+                                        {{template "amount" .Balance}}
                                 </li>
                         {{end}}
                         <li>
diff --git a/web/budget.html b/web/budget.html
index ca7d443..84c83cf 100644
--- a/web/budget.html
+++ b/web/budget.html
@@ -24,9 +24,7 @@
         <td>
             <a href="transaction/{{.ID}}">{{.Memo}}</a>
         </td>
-        <td style="text-align: right;{{if .Amount.GetPositive}}{{else}}color: red;{{end}}">
-            {{printf "%.2f" .Amount.GetFloat64}}
-        </td>
+        {{template "amount-cell" .Amount}}
     </tr>
     {{end}}
 </table>
diff --git a/web/budgeting.html b/web/budgeting.html
index ea84b95..a8ac940 100644
--- a/web/budgeting.html
+++ b/web/budgeting.html
@@ -28,12 +28,8 @@
         </td>
         <td>
         </td>
-        <td style="text-align: right;{{if .Balance.GetPositive}}{{else}}color: red;{{end}}">
-            {{printf "%.2f" .Balance.GetFloat64}}
-        </td>
-        <td style="text-align: right;{{if .Activity.GetPositive}}{{else}}color: red;{{end}}">
-            {{printf "%.2f" .Activity.GetFloat64}}
-        </td>
+        {{template "amount-cell" .Balance}}
+        {{template "amount-cell" .Activity}}
     </tr>
     {{end}}
 </table>
diff --git a/web/static/css/main.css b/web/static/css/main.css
index 4c97039..3e68448 100644
--- a/web/static/css/main.css
+++ b/web/static/css/main.css
@@ -59,4 +59,8 @@ body {
 
 .right {
     text-align: right;
+}
+
+.negative {
+    color: #d50000;
 }
\ No newline at end of file