diff --git a/BudgetMasterServer/src/main/resources/static/css/style.css b/BudgetMasterServer/src/main/resources/static/css/style.css
index 10e635825912728b884644921f005f313d9160e6..53c2f5d6409d77429ccc0920ad62027c9c630eef 100644
--- a/BudgetMasterServer/src/main/resources/static/css/style.css
+++ b/BudgetMasterServer/src/main/resources/static/css/style.css
@@ -191,7 +191,7 @@ main {
}
.budget-headline-icon {
- margin-top: 0;
+ width: 4.2vmin;
}
.mobile-menu {
diff --git a/BudgetMasterServer/src/main/resources/static/images/piggy_expenditure.svg b/BudgetMasterServer/src/main/resources/static/images/piggy_expenditure.svg
new file mode 100644
index 0000000000000000000000000000000000000000..3fb6c2a50c475a4745cb8173c7cc9e1268824ffa
--- /dev/null
+++ b/BudgetMasterServer/src/main/resources/static/images/piggy_expenditure.svg
@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?><!-- Generator: Gravit.io --><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="isolation:isolate" viewBox="0 0 500 500" width="500pt" height="500pt"><defs><clipPath id="_clipPath_xltUIULegjbjXtTX9LlmmnhRwRFPNTsK"><rect width="500" height="500"/></clipPath></defs><g clip-path="url(#_clipPath_xltUIULegjbjXtTX9LlmmnhRwRFPNTsK)"><g><path d=" M 325 200 C 327.734 200 329.766 200.078 333.125 200.234 C 336.484 200.469 339.766 200.781 342.969 201.25 C 356.719 185.234 377.187 175 400 175 L 425 175 L 410.313 233.672 C 422.734 245.234 432.734 259.297 439.609 275 L 450 275 C 463.828 275 475 286.172 475 300 L 475 375 C 475 388.828 463.828 400 450 400 L 425 400 C 417.891 409.453 409.453 417.891 400 425 L 400 475 C 400 488.828 388.828 500 375 500 L 350 500 C 336.172 500 325 488.828 325 475 L 325 450 L 225 450 L 225 475 C 225 488.828 213.828 500 200 500 L 175 500 C 161.172 500 150 488.828 150 475 L 150 425 C 122.734 404.531 104.141 373.281 100.617 337.5 L 78.125 337.5 C 48.781 337.5 25 313.75 25 284.375 C 25 255 48.781 231.25 78.125 231.25 L 81.25 231.25 C 91.602 231.25 100 239.609 100 250 C 100 260.391 91.602 268.75 81.25 268.75 L 78.125 268.75 C 69.492 268.75 62.5 275.078 62.5 284.375 C 62.5 292.969 69.492 300 78.125 300 L 102.5 300 C 111.953 253.281 147.578 216.016 193.359 204.062 C 203.437 201.406 213.359 200 225 200 L 325 200 Z M 356.25 287.5 C 345.859 287.5 337.5 295.859 337.5 306.25 C 337.5 316.641 345.859 325 356.25 325 C 366.641 325 375 316.641 375 306.25 C 375 295.859 366.641 287.5 356.25 287.5 Z " fill-rule="evenodd" fill="rgb(245,88,86)"/><g><path d=" M 210.357 171.786 L 289.643 171.786 L 289.643 92.5 L 342.5 92.5 L 250 0 L 157.5 92.5 L 210.357 92.5 L 210.357 171.786 Z " fill="rgb(245,88,86)"/></g></g></g></svg>
\ No newline at end of file
diff --git a/BudgetMasterServer/src/main/resources/static/images/piggy_income.svg b/BudgetMasterServer/src/main/resources/static/images/piggy_income.svg
new file mode 100644
index 0000000000000000000000000000000000000000..76dbca74527adeef7f6633869cb4b47d2c42ff0b
--- /dev/null
+++ b/BudgetMasterServer/src/main/resources/static/images/piggy_income.svg
@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?><!-- Generator: Gravit.io --><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="isolation:isolate" viewBox="0 0 500 500" width="500pt" height="500pt"><defs><clipPath id="_clipPath_QZkJ2HZ7QbS7iEwhFv3icIFa7OCeoePa"><rect width="500" height="500"/></clipPath></defs><g clip-path="url(#_clipPath_QZkJ2HZ7QbS7iEwhFv3icIFa7OCeoePa)"><path d=" M 325 200 C 327.734 200 329.766 200.078 333.125 200.234 C 336.484 200.469 339.766 200.781 342.969 201.25 C 356.719 185.234 377.187 175 400 175 L 425 175 L 410.313 233.672 C 422.734 245.234 432.734 259.297 439.609 275 L 450 275 C 463.828 275 475 286.172 475 300 L 475 375 C 475 388.828 463.828 400 450 400 L 425 400 C 417.891 409.453 409.453 417.891 400 425 L 400 475 C 400 488.828 388.828 500 375 500 L 350 500 C 336.172 500 325 488.828 325 475 L 325 450 L 225 450 L 225 475 C 225 488.828 213.828 500 200 500 L 175 500 C 161.172 500 150 488.828 150 475 L 150 425 C 122.734 404.531 104.141 373.281 100.617 337.5 L 78.125 337.5 C 48.781 337.5 25 313.75 25 284.375 C 25 255 48.781 231.25 78.125 231.25 L 81.25 231.25 C 91.602 231.25 100 239.609 100 250 C 100 260.391 91.602 268.75 81.25 268.75 L 78.125 268.75 C 69.492 268.75 62.5 275.078 62.5 284.375 C 62.5 292.969 69.492 300 78.125 300 L 102.5 300 C 111.953 253.281 147.578 216.016 193.359 204.062 C 203.437 201.406 213.359 200 225 200 L 325 200 Z M 356.25 287.5 C 345.859 287.5 337.5 295.859 337.5 306.25 C 337.5 316.641 345.859 325 356.25 325 C 366.641 325 375 316.641 375 306.25 C 375 295.859 366.641 287.5 356.25 287.5 Z " fill-rule="evenodd" fill="rgb(92,184,92)"/><g><path d=" M 342.5 79.286 L 289.643 79.286 L 289.643 0 L 210.357 0 L 210.357 79.286 L 157.5 79.286 L 250 171.786 L 342.5 79.286 Z " fill="rgb(92,184,92)"/></g><g><path d=" M 50.143 49.714 L 250.143 49.714 L 250.143 249.714 L 50.143 249.714 L 50.143 49.714 Z " fill="none"/><path d=" M 655.333 71.333 L 705.333 71.333 L 705.333 21.333 L 738.667 21.333 L 680.333 -37 L 622 21.333 L 655.333 21.333 L 655.333 71.333 Z " fill="rgb(0,0,0)"/></g></g></svg>
\ No newline at end of file
diff --git a/BudgetMasterServer/src/main/resources/static/images/piggy_rest.svg b/BudgetMasterServer/src/main/resources/static/images/piggy_rest.svg
new file mode 100644
index 0000000000000000000000000000000000000000..b0bba66aa63e84dd0eccd72f63198a196dd5aa30
--- /dev/null
+++ b/BudgetMasterServer/src/main/resources/static/images/piggy_rest.svg
@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?><!-- Generator: Gravit.io --><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="isolation:isolate" viewBox="0 0 500 500" width="500pt" height="500pt"><defs><clipPath id="_clipPath_8u3fJPh3brWU1WvueWxMMKfG0rasHovs"><rect width="500" height="500"/></clipPath></defs><g clip-path="url(#_clipPath_8u3fJPh3brWU1WvueWxMMKfG0rasHovs)"><path d=" M 337.5 175 L 336.797 175.516 C 333.359 175.172 329.219 175 325 175 L 225 175 C 212.109 175 199.609 176.625 187.656 179.688 C 187.578 178.125 187.5 176.578 187.5 175 C 187.5 133.578 220.391 100 262.5 100 C 303.906 100 337.5 133.578 337.5 175 Z M 325 200 C 327.734 200 329.766 200.078 333.125 200.234 C 336.484 200.469 339.766 200.781 342.969 201.25 C 356.719 185.234 377.188 175 400 175 L 425 175 L 410.313 233.672 C 422.734 245.234 432.734 259.297 439.609 275 L 450 275 C 463.828 275 475 286.172 475 300 L 475 375 C 475 388.828 463.828 400 450 400 L 425 400 C 417.891 409.453 409.453 417.891 400 425 L 400 475 C 400 488.828 388.828 500 375 500 L 350 500 C 336.172 500 325 488.828 325 475 L 325 450 L 225 450 L 225 475 C 225 488.828 213.828 500 200 500 L 175 500 C 161.172 500 150 488.828 150 475 L 150 425 C 122.734 404.531 104.141 373.281 100.617 337.5 L 78.125 337.5 C 48.781 337.5 25 313.75 25 284.375 C 25 255 48.781 231.25 78.125 231.25 L 81.25 231.25 C 91.602 231.25 100 239.609 100 250 C 100 260.391 91.602 268.75 81.25 268.75 L 78.125 268.75 C 69.492 268.75 62.5 275.078 62.5 284.375 C 62.5 292.969 69.492 300 78.125 300 L 102.5 300 C 111.953 253.281 147.578 216.016 193.359 204.063 C 203.438 201.406 213.359 200 225 200 L 325 200 Z M 356.25 287.5 C 345.859 287.5 337.5 295.859 337.5 306.25 C 337.5 316.641 345.859 325 356.25 325 C 366.641 325 375 316.641 375 306.25 C 375 295.859 366.641 287.5 356.25 287.5 Z " fill="rgb(46,121,185)"/></g></svg>
\ No newline at end of file
diff --git a/BudgetMasterServer/src/main/resources/templates/transactions/transactions.ftl b/BudgetMasterServer/src/main/resources/templates/transactions/transactions.ftl
index 3ec4d04447e6310449ca42c7313c390bb9bf0415..f11ab9a9db193e0cadb0e5f4801ee7d98431f2cc 100644
--- a/BudgetMasterServer/src/main/resources/templates/transactions/transactions.ftl
+++ b/BudgetMasterServer/src/main/resources/templates/transactions/transactions.ftl
@@ -24,20 +24,20 @@
<div class="container transaction-container">
<div class="row">
<div class="col s4">
- <div class="icon-block">
- <h1 class="center text-green budget-headline-icon no-margin-bottom"><i class="material-icons icon-budget">file_download</i></h1>
- <h5 class="center budget">${currencyService.getCurrencyString(budget.getIncomeSum())}</h5>
+ <div class="icon-block center-align">
+ <img class="budget-headline-icon" src="<@s.url '/images/piggy_income.svg'/>">
+ <h5 class="budget">${currencyService.getCurrencyString(budget.getIncomeSum())}</h5>
</div>
</div>
<div class="col s4">
- <div class="icon-block">
- <h1 class="center ${redTextColor} budget-headline-icon no-margin-bottom"><i class="material-icons icon-budget">file_upload</i></h1>
+ <div class="icon-block center-align">
+ <img class="budget-headline-icon" src="<@s.url '/images/piggy_expenditure.svg'/>">
<h5 class="center budget">${currencyService.getCurrencyString(budget.getExpenditureSum())}</h5>
</div>
</div>
<div class="col s4">
- <div class="icon-block">
- <h1 class="center text-blue budget-headline-icon no-margin-bottom"><i class="fas fa-piggy-bank icon-budget"></i></h1>
+ <div class="icon-block center-align">
+ <img class="budget-headline-icon" src="<@s.url '/images/piggy_rest.svg'/>">
<h5 class="center budget">${currencyService.getCurrencyString(budget.getRest())}</h5>
</div>
</div>
diff --git a/build/icons/piggy_expenditure.svg b/build/icons/piggy_expenditure.svg
new file mode 100644
index 0000000000000000000000000000000000000000..3fb6c2a50c475a4745cb8173c7cc9e1268824ffa
--- /dev/null
+++ b/build/icons/piggy_expenditure.svg
@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?><!-- Generator: Gravit.io --><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="isolation:isolate" viewBox="0 0 500 500" width="500pt" height="500pt"><defs><clipPath id="_clipPath_xltUIULegjbjXtTX9LlmmnhRwRFPNTsK"><rect width="500" height="500"/></clipPath></defs><g clip-path="url(#_clipPath_xltUIULegjbjXtTX9LlmmnhRwRFPNTsK)"><g><path d=" M 325 200 C 327.734 200 329.766 200.078 333.125 200.234 C 336.484 200.469 339.766 200.781 342.969 201.25 C 356.719 185.234 377.187 175 400 175 L 425 175 L 410.313 233.672 C 422.734 245.234 432.734 259.297 439.609 275 L 450 275 C 463.828 275 475 286.172 475 300 L 475 375 C 475 388.828 463.828 400 450 400 L 425 400 C 417.891 409.453 409.453 417.891 400 425 L 400 475 C 400 488.828 388.828 500 375 500 L 350 500 C 336.172 500 325 488.828 325 475 L 325 450 L 225 450 L 225 475 C 225 488.828 213.828 500 200 500 L 175 500 C 161.172 500 150 488.828 150 475 L 150 425 C 122.734 404.531 104.141 373.281 100.617 337.5 L 78.125 337.5 C 48.781 337.5 25 313.75 25 284.375 C 25 255 48.781 231.25 78.125 231.25 L 81.25 231.25 C 91.602 231.25 100 239.609 100 250 C 100 260.391 91.602 268.75 81.25 268.75 L 78.125 268.75 C 69.492 268.75 62.5 275.078 62.5 284.375 C 62.5 292.969 69.492 300 78.125 300 L 102.5 300 C 111.953 253.281 147.578 216.016 193.359 204.062 C 203.437 201.406 213.359 200 225 200 L 325 200 Z M 356.25 287.5 C 345.859 287.5 337.5 295.859 337.5 306.25 C 337.5 316.641 345.859 325 356.25 325 C 366.641 325 375 316.641 375 306.25 C 375 295.859 366.641 287.5 356.25 287.5 Z " fill-rule="evenodd" fill="rgb(245,88,86)"/><g><path d=" M 210.357 171.786 L 289.643 171.786 L 289.643 92.5 L 342.5 92.5 L 250 0 L 157.5 92.5 L 210.357 92.5 L 210.357 171.786 Z " fill="rgb(245,88,86)"/></g></g></g></svg>
\ No newline at end of file
diff --git a/build/icons/piggy_icons.gvdesign b/build/icons/piggy_icons.gvdesign
new file mode 100644
index 0000000000000000000000000000000000000000..c667377e1bf6a06d878aedb374dfce34a5666551
Binary files /dev/null and b/build/icons/piggy_icons.gvdesign differ
diff --git a/build/icons/piggy_income.svg b/build/icons/piggy_income.svg
new file mode 100644
index 0000000000000000000000000000000000000000..76dbca74527adeef7f6633869cb4b47d2c42ff0b
--- /dev/null
+++ b/build/icons/piggy_income.svg
@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?><!-- Generator: Gravit.io --><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="isolation:isolate" viewBox="0 0 500 500" width="500pt" height="500pt"><defs><clipPath id="_clipPath_QZkJ2HZ7QbS7iEwhFv3icIFa7OCeoePa"><rect width="500" height="500"/></clipPath></defs><g clip-path="url(#_clipPath_QZkJ2HZ7QbS7iEwhFv3icIFa7OCeoePa)"><path d=" M 325 200 C 327.734 200 329.766 200.078 333.125 200.234 C 336.484 200.469 339.766 200.781 342.969 201.25 C 356.719 185.234 377.187 175 400 175 L 425 175 L 410.313 233.672 C 422.734 245.234 432.734 259.297 439.609 275 L 450 275 C 463.828 275 475 286.172 475 300 L 475 375 C 475 388.828 463.828 400 450 400 L 425 400 C 417.891 409.453 409.453 417.891 400 425 L 400 475 C 400 488.828 388.828 500 375 500 L 350 500 C 336.172 500 325 488.828 325 475 L 325 450 L 225 450 L 225 475 C 225 488.828 213.828 500 200 500 L 175 500 C 161.172 500 150 488.828 150 475 L 150 425 C 122.734 404.531 104.141 373.281 100.617 337.5 L 78.125 337.5 C 48.781 337.5 25 313.75 25 284.375 C 25 255 48.781 231.25 78.125 231.25 L 81.25 231.25 C 91.602 231.25 100 239.609 100 250 C 100 260.391 91.602 268.75 81.25 268.75 L 78.125 268.75 C 69.492 268.75 62.5 275.078 62.5 284.375 C 62.5 292.969 69.492 300 78.125 300 L 102.5 300 C 111.953 253.281 147.578 216.016 193.359 204.062 C 203.437 201.406 213.359 200 225 200 L 325 200 Z M 356.25 287.5 C 345.859 287.5 337.5 295.859 337.5 306.25 C 337.5 316.641 345.859 325 356.25 325 C 366.641 325 375 316.641 375 306.25 C 375 295.859 366.641 287.5 356.25 287.5 Z " fill-rule="evenodd" fill="rgb(92,184,92)"/><g><path d=" M 342.5 79.286 L 289.643 79.286 L 289.643 0 L 210.357 0 L 210.357 79.286 L 157.5 79.286 L 250 171.786 L 342.5 79.286 Z " fill="rgb(92,184,92)"/></g><g><path d=" M 50.143 49.714 L 250.143 49.714 L 250.143 249.714 L 50.143 249.714 L 50.143 49.714 Z " fill="none"/><path d=" M 655.333 71.333 L 705.333 71.333 L 705.333 21.333 L 738.667 21.333 L 680.333 -37 L 622 21.333 L 655.333 21.333 L 655.333 71.333 Z " fill="rgb(0,0,0)"/></g></g></svg>
\ No newline at end of file
diff --git a/build/icons/piggy_rest.svg b/build/icons/piggy_rest.svg
new file mode 100644
index 0000000000000000000000000000000000000000..b0bba66aa63e84dd0eccd72f63198a196dd5aa30
--- /dev/null
+++ b/build/icons/piggy_rest.svg
@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?><!-- Generator: Gravit.io --><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="isolation:isolate" viewBox="0 0 500 500" width="500pt" height="500pt"><defs><clipPath id="_clipPath_8u3fJPh3brWU1WvueWxMMKfG0rasHovs"><rect width="500" height="500"/></clipPath></defs><g clip-path="url(#_clipPath_8u3fJPh3brWU1WvueWxMMKfG0rasHovs)"><path d=" M 337.5 175 L 336.797 175.516 C 333.359 175.172 329.219 175 325 175 L 225 175 C 212.109 175 199.609 176.625 187.656 179.688 C 187.578 178.125 187.5 176.578 187.5 175 C 187.5 133.578 220.391 100 262.5 100 C 303.906 100 337.5 133.578 337.5 175 Z M 325 200 C 327.734 200 329.766 200.078 333.125 200.234 C 336.484 200.469 339.766 200.781 342.969 201.25 C 356.719 185.234 377.188 175 400 175 L 425 175 L 410.313 233.672 C 422.734 245.234 432.734 259.297 439.609 275 L 450 275 C 463.828 275 475 286.172 475 300 L 475 375 C 475 388.828 463.828 400 450 400 L 425 400 C 417.891 409.453 409.453 417.891 400 425 L 400 475 C 400 488.828 388.828 500 375 500 L 350 500 C 336.172 500 325 488.828 325 475 L 325 450 L 225 450 L 225 475 C 225 488.828 213.828 500 200 500 L 175 500 C 161.172 500 150 488.828 150 475 L 150 425 C 122.734 404.531 104.141 373.281 100.617 337.5 L 78.125 337.5 C 48.781 337.5 25 313.75 25 284.375 C 25 255 48.781 231.25 78.125 231.25 L 81.25 231.25 C 91.602 231.25 100 239.609 100 250 C 100 260.391 91.602 268.75 81.25 268.75 L 78.125 268.75 C 69.492 268.75 62.5 275.078 62.5 284.375 C 62.5 292.969 69.492 300 78.125 300 L 102.5 300 C 111.953 253.281 147.578 216.016 193.359 204.063 C 203.438 201.406 213.359 200 225 200 L 325 200 Z M 356.25 287.5 C 345.859 287.5 337.5 295.859 337.5 306.25 C 337.5 316.641 345.859 325 356.25 325 C 366.641 325 375 316.641 375 306.25 C 375 295.859 366.641 287.5 356.25 287.5 Z " fill="rgb(46,121,185)"/></g></svg>
\ No newline at end of file