diff --git a/src/app/accounts/account-details/account-details.component.css b/src/app/accounts/account-details/account-details.component.css index e69de29..dafccd5 100644 --- a/src/app/accounts/account-details/account-details.component.css +++ b/src/app/accounts/account-details/account-details.component.css @@ -0,0 +1,68 @@ +.dashboard { + color: #F1F1F1; + display: flex; + flex-wrap: wrap; + justify-content: center; + padding: 1em; + } + + .dashboard > div { + background: #212121; + display: inline-block; + margin: 1em; + padding: 1em; + max-width: 500px; + position: relative; + width: 100%; + } + + .dashboard .dashboard-primary { + padding: 5em 1em; + text-align: center; + } + + .dashboard-primary > * { + display: block; + } + + .dashboard div h2, .dashboard div h3 { + margin: 0; + } + + .dashboard p, .dashboard a { + color: #F1F1F1; + text-align: center; + text-decoration: none; + } + + .dashboard-primary div { + bottom: 0.5em; + display: flex; + justify-content: flex-end; + left: 0.5em; + right: 0.5em; + position: absolute; + } + + .dashboard .no-categories { + padding: 1em; + text-align: center; + } + + .dashboard .no-categories a { + display: inline-block; + border: 1px dashed #F1F1F1; + padding: 1em; + } + + .dashboard .no-categories p { + line-height: normal; + white-space: normal; + } + + a.view-all { + position: absolute; + right: 0.5em; + top: 0.5em; + } + \ No newline at end of file diff --git a/src/app/accounts/account-details/account-details.component.html b/src/app/accounts/account-details/account-details.component.html index d44e3c1..eb8020c 100644 --- a/src/app/accounts/account-details/account-details.component.html +++ b/src/app/accounts/account-details/account-details.component.html @@ -1,3 +1,26 @@ -
- account-details works! -
+To begin tracking your finances, login or create an account!
+{{ account.name }} @@ -14,3 +18,6 @@
Add accounts to begin tracking your budget.
+ +
{{ category.name }}
diff --git a/src/app/categories/category-list/category-list.component.ts b/src/app/categories/category-list/category-list.component.ts
index c541afe..7110fe2 100644
--- a/src/app/categories/category-list/category-list.component.ts
+++ b/src/app/categories/category-list/category-list.component.ts
@@ -1,5 +1,6 @@
import { Component, OnInit, Input } from '@angular/core';
import { Category } from '../category';
+import { Account } from 'src/app/accounts/account';
@Component({
selector: 'app-category-list',
@@ -8,6 +9,7 @@ import { Category } from '../category';
})
export class CategoryListComponent implements OnInit {
+ @Input() accountId: string;
@Input() categories: Category[];
@Input() categoryBalances: Map To begin tracking your finances, login or create an account! Select a transaction from the list to view details about it or edit it. {{transaction.title}}
@@ -9,6 +9,6 @@
{{ transaction.date | date }}Get started
-
- Current Balance:
-
-
- 0, 'expense': getBalance() < 0}">{{ getBalance() / 100 | currency }}
-