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

Feature/add tooltips to product page (#3842)

Browse Source 
* Add tooltips
This commit is contained in:
Thomas Kaul 2024-09-29 19:26:30 +02:00 committed by GitHub
parent 00f06d6aef
commit 04e0bbd4c1
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 96 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

112
apps/client/src/app/pages/resources/personal-finance-tools/product-page.html
View File

@ -128,16 +128,36 @@
</td> </td>
<td class="mat-mdc-cell px-1 py-2"> <td class="mat-mdc-cell px-1 py-2">
@if (product1.isOpenSource) { @if (product1.isOpenSource) {
<ng-container i18n>✅ Yes</ng-container> <span
i18n
i18n-title
title="{{ product1.name }} is Open Source Software"
>✅ Yes</span
>
} @else { } @else {
<ng-container i18n>❌ No</ng-container> <span
i18n
i18n-title
title="{{ product1.name }} is not Open Source Software"
>❌ No</span
>
} }
</td> </td>
<td class="mat-mdc-cell px-1 py-2"> <td class="mat-mdc-cell px-1 py-2">
@if (product2.isOpenSource) { @if (product2.isOpenSource) {
<ng-container i18n>✅ Yes</ng-container> <span
i18n
i18n-title
title="{{ product2.name }} is Open Source Software"
>✅ Yes</span
>
} @else { } @else {
<ng-container i18n>❌ No </ng-container> <span
i18n
i18n-title
title="{{ product2.name }} is not Open Source Software"
>❌ No</span
>
} }
</td> </td>
</tr> </tr>
@ -147,16 +167,36 @@
</td> </td>
<td class="mat-mdc-cell px-1 py-2"> <td class="mat-mdc-cell px-1 py-2">
@if (product1.hasSelfHostingAbility === true) { @if (product1.hasSelfHostingAbility === true) {
<ng-container i18n>✅ Yes</ng-container> <span
i18n
i18n-title
title="{{ product1.name }} can be self-hosted"
>✅ Yes</span
>
} @else if (product1.hasSelfHostingAbility === false) { } @else if (product1.hasSelfHostingAbility === false) {
<ng-container i18n>❌ No</ng-container> <span
i18n
i18n-title
title="{{ product1.name }} cannot be self-hosted"
>❌ No</span
>
} }
</td> </td>
<td class="mat-mdc-cell px-1 py-2"> <td class="mat-mdc-cell px-1 py-2">
@if (product2.hasSelfHostingAbility === true) { @if (product2.hasSelfHostingAbility === true) {
<ng-container i18n>✅ Yes</ng-container> <span
i18n
i18n-title
title="{{ product2.name }} can be self-hosted"
>✅ Yes</span
>
} @else if (product2.hasSelfHostingAbility === false) { } @else if (product2.hasSelfHostingAbility === false) {
<ng-container i18n>❌ No</ng-container> <span
i18n
i18n-title
title="{{ product2.name }} cannot be self-hosted"
>❌ No</span
>
} }
</td> </td>
</tr> </tr>
@ -166,16 +206,36 @@
</td> </td>
<td class="mat-mdc-cell px-1 py-2"> <td class="mat-mdc-cell px-1 py-2">
@if (product1.useAnonymously === true) { @if (product1.useAnonymously === true) {
<ng-container i18n>✅ Yes</ng-container> <span
i18n
i18n-title
title="{{ product1.name }} can be used anonymously"
>✅ Yes</span
>
} @else if (product1.useAnonymously === false) { } @else if (product1.useAnonymously === false) {
<ng-container i18n>❌ No</ng-container> <span
i18n
i18n-title
title="{{ product1.name }} cannot be used anonymously"
>❌ No</span
>
} }
</td> </td>
<td class="mat-mdc-cell px-1 py-2"> <td class="mat-mdc-cell px-1 py-2">
@if (product2.useAnonymously === true) { @if (product2.useAnonymously === true) {
<ng-container i18n>✅ Yes</ng-container> <span
i18n
i18n-title
title="{{ product2.name }} can be used anonymously"
>✅ Yes</span
>
} @else if (product2.useAnonymously === false) { } @else if (product2.useAnonymously === false) {
<ng-container i18n>❌ No</ng-container> <span
i18n
i18n-title
title="{{ product2.name }} cannot be used anonymously"
>❌ No</span
>
} }
</td> </td>
</tr> </tr>
@ -185,16 +245,36 @@
</td> </td>
<td class="mat-mdc-cell px-1 py-2"> <td class="mat-mdc-cell px-1 py-2">
@if (product1.hasFreePlan === true) { @if (product1.hasFreePlan === true) {
<ng-container i18n>✅ Yes</ng-container> <span
i18n
i18n-title
title="{{ product1.name }} offers a free plan"
>✅ Yes</span
>
} @else if (product1.hasFreePlan === false) { } @else if (product1.hasFreePlan === false) {
<ng-container i18n>❌ No</ng-container> <span
i18n
i18n-title
title="{{ product1.name }} does not offer a free plan"
>❌ No</span
>
} }
</td> </td>
<td class="mat-mdc-cell px-1 py-2"> <td class="mat-mdc-cell px-1 py-2">
@if (product2.hasFreePlan === true) { @if (product2.hasFreePlan === true) {
<ng-container i18n>✅ Yes</ng-container> <span
i18n
i18n-title
title="{{ product2.name }} offers a free plan"
>✅ Yes</span
>
} @else if (product2.hasFreePlan === false) { } @else if (product2.hasFreePlan === false) {
<ng-container i18n>❌ No</ng-container> <span
i18n
i18n-title
title="{{ product2.name }} does not offer a free plan"
>❌ No</span
>
} }
</td> </td>
</tr> </tr>