Create home button class.

src/views/css/index.css

@@ -108,6 +108,27 @@ body{
     color: white;
 }
 
+.homeButton{
+    position: absolute;
+    top: 15px;
+    right: 15px;
+    background: var(--primary);
+    color: var(--accent);
+    border: none;
+    cursor: pointer;
+    border-radius: 50%;
+    height: 50px;
+    width: 50px;
+}
+
+.homeButton:hover{
+    filter: brightness(1.25);
+}
+
+.homeButton:active{
+    filter: brightness(1.75);
+}
+
 .circleButton{
     display: flex;
     justify-content: center;

src/views/js/HomeButton.js

@@ -0,0 +1,14 @@
+import Elem from "./Elem.js";
+
+export default class HomeButton{
+    constructor(container){
+        let homeSvg = '<svg width="24px" height="24px" viewBox="0 0 24 24" stroke-width="2.5" fill="none" xmlns="http://www.w3.org/2000/svg" color="currentColor"><path d="M2 8L11.7317 3.13416C11.9006 3.04971 12.0994 3.0497 12.2683 3.13416L22 8" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M20 11V19C20 20.1046 19.1046 21 18 21H6C4.89543 21 4 20.1046 4 19V11" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"></path></svg>';
+
+        new Elem("button")
+            .innerHtml(homeSvg)
+            .addClass("homeButton")
+            .onclick(()=>{changePage("home")})
+            .appendTo(container);
+    }
+
+}

src/views/js/data/Transaction.js

@@ -23,6 +23,10 @@ export default class Transaction{
         return this._parent.getCategory(this._category, this._categoryId);
     }
 
+    get rawCategory(){
+        return this._category;
+    }
+
     get location(){
         return this._location;
     }

src/views/js/pages/ViewTransactions.js

@@ -1,6 +1,7 @@
 import Page from "./Page.js";
 import Elem from "../Elem.js";
 import Format from "../Format.js";
+import HomeButton from "../HomeButton.js";
 
 export default class ViewTransactions extends Page{
     constructor(){
@@ -10,7 +11,7 @@ export default class ViewTransactions extends Page{
     }
 
     transactionColor(transaction){
-        if(transaction.category === "income"){
+        if(transaction.rawCategory === "income"){
             if(transaction.amount < 0){
                 return "red";
             }else{
@@ -26,6 +27,8 @@ export default class ViewTransactions extends Page{
     }
 
     render(){
+        new HomeButton(this.container);
+
         new Elem("h1")
             .text(`${user.account.name} transactions`)
             .appendTo(this.container);