sudacode/ghostfolio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Releases Activity

Feature/improve allocations by ETF holding for mobile (#3469)

Browse Source
This commit is contained in:
Thomas Kaul
2024-06-08 17:20:38 +02:00
committed by GitHub
parent d3bfdf78c3
commit 87501e094d
13 changed files with 437 additions and 430 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
libs/ui/src/lib/activities-table/activities-table.component.html
View File

@@ -70,7 +70,7 @@
</div>
}
<div class="activities">
<div class="overflow-x-auto">
<table
class="gf-table w-100"
mat-table

4
libs/ui/src/lib/activities-table/activities-table.component.scss
View File

@@ -1,7 +1,3 @@
:host {
display: block;
.activities {
overflow-x: auto;
}
}

2
libs/ui/src/lib/holdings-table/holdings-table.component.html
View File

@@ -1,4 +1,4 @@
<div class="holdings">
<div class="overflow-x-auto">
<table
class="gf-table w-100"
mat-table

14
libs/ui/src/lib/holdings-table/holdings-table.component.scss
View File

@@ -1,15 +1,11 @@
:host {
display: block;
.holdings {
overflow-x: auto;
.gf-table {
th {
::ng-deep {
.mat-sort-header-container {
justify-content: inherit;
}
.gf-table {
th {
::ng-deep {
.mat-sort-header-container {
justify-content: inherit;
}
}
}

118
libs/ui/src/lib/top-holdings/top-holdings.component.html
View File

@@ -1,64 +1,66 @@
<table
class="gf-table w-100"
mat-table
matSort
matSortActive="allocationInPercentage"
matSortDirection="desc"
[dataSource]="dataSource"
>
<ng-container matColumnDef="name">
<th *matHeaderCellDef class="px-2" mat-header-cell mat-sort-header>
<ng-container i18n>Name</ng-container>
</th>
<td *matCellDef="let element" class="px-2" mat-cell>
{{ element?.name | titlecase }}
</td>
</ng-container>
<div class="overflow-x-auto">
<table
class="gf-table w-100"
mat-table
matSort
matSortActive="allocationInPercentage"
matSortDirection="desc"
[dataSource]="dataSource"
>
<ng-container matColumnDef="name">
<th *matHeaderCellDef class="px-2" mat-header-cell mat-sort-header>
<ng-container i18n>Name</ng-container>
</th>
<td *matCellDef="let element" class="px-2" mat-cell>
<div class="text-truncate">{{ element?.name | titlecase }}</div>
</td>
</ng-container>
<ng-container matColumnDef="valueInBaseCurrency">
<th
*matHeaderCellDef
class="justify-content-end px-2"
mat-header-cell
mat-sort-header
>
<ng-container i18n>Value</ng-container>
</th>
<td *matCellDef="let element" class="px-2" mat-cell>
<div class="d-flex justify-content-end">
<gf-value
[isCurrency]="true"
[locale]="locale"
[value]="element?.valueInBaseCurrency"
/>
</div>
</td>
</ng-container>
<ng-container matColumnDef="valueInBaseCurrency">
<th
*matHeaderCellDef
class="justify-content-end px-2"
mat-header-cell
mat-sort-header
>
<ng-container i18n>Value</ng-container>
</th>
<td *matCellDef="let element" class="px-2" mat-cell>
<div class="d-flex justify-content-end">
<gf-value
[isCurrency]="true"
[locale]="locale"
[value]="element?.valueInBaseCurrency"
/>
</div>
</td>
</ng-container>
<ng-container matColumnDef="allocationInPercentage">
<th
*matHeaderCellDef
class="justify-content-end px-2"
mat-header-cell
mat-sort-header
>
<span class="d-none d-sm-block" i18n>Allocation</span>
<span class="d-block d-sm-none" title="Allocation">%</span>
</th>
<td *matCellDef="let element" class="px-2" mat-cell>
<div class="d-flex justify-content-end">
<gf-value
[isPercent]="true"
[locale]="locale"
[value]="element?.allocationInPercentage"
/>
</div>
</td>
</ng-container>
<ng-container matColumnDef="allocationInPercentage" stickyEnd>
<th
*matHeaderCellDef
class="justify-content-end px-2"
mat-header-cell
mat-sort-header
>
<span class="d-none d-sm-block" i18n>Allocation</span>
<span class="d-block d-sm-none" title="Allocation">%</span>
</th>
<td *matCellDef="let element" class="px-2" mat-cell>
<div class="d-flex justify-content-end">
<gf-value
[isPercent]="true"
[locale]="locale"
[value]="element?.allocationInPercentage"
/>
</div>
</td>
</ng-container>
<tr *matHeaderRowDef="displayedColumns" mat-header-row></tr>
<tr *matRowDef="let row; columns: displayedColumns" mat-row></tr>
</table>
<tr *matHeaderRowDef="displayedColumns" mat-header-row></tr>
<tr *matRowDef="let row; columns: displayedColumns" mat-row></tr>
</table>
</div>
<mat-paginator class="d-none" [pageSize]="pageSize" />