diff --git a/src/frontend/src/app/consent-management/consent-history/consent-history.component.html b/src/frontend/src/app/consent-management/consent-history/consent-history.component.html index 3202e562c2c68b3538408f877d2609225a674e0d..aede9290cb1ebd9ceb8b13907f65d7c0bb081a3d 100644 --- a/src/frontend/src/app/consent-management/consent-history/consent-history.component.html +++ b/src/frontend/src/app/consent-management/consent-history/consent-history.component.html @@ -58,6 +58,11 @@ <h2>Deine Einwilligungen</h2> +<div *ngIf="!consentHistory.length" class="no-consent-content"> + <img src="assets/not_found.svg" width="400" /> + <h1 class="no-consent-text">Du hast bisher keine Einwilligungen erteilt.</h1> +</div> + <nz-collapse class="collaps-consent" *ngFor="let group_data of consentHistory" @@ -137,16 +142,22 @@ <nz-list-item-meta [nzAvatar]="consent.consented ? itemAvatarChecked : itemAvatarUnChecked"> <ng-template #itemAvatarChecked> - <fa-icon class="consent-icon" [icon]="faCheckCircle"></fa-icon - > <span class="consent-list">{{ - consent.verb.description - }}</span> + <fa-icon + [ngClass]="consent.consented ? 'consent-icon' : 'consent-icon-revoke'" + [icon]="faCheckCircle"></fa-icon + > <span + [ngClass]="consent.consented ? 'consent-list' : 'consent-list-revoke'" + >{{ consent.verb.description }}</span + > </ng-template> <ng-template #itemAvatarUnChecked> - <fa-icon class="consent-icon" [icon]="faTimesCircle"></fa-icon - > <span class="consent-list">{{ - consent.verb.description - }}</span> + <fa-icon + [ngClass]="consent.consented ? 'consent-icon' : 'consent-icon-revoke'" + [icon]="faTimesCircle"></fa-icon + > <span + [ngClass]="consent.consented ? 'consent-list' : 'consent-list-revoke'" + >{{ consent.verb.description }}</span + > </ng-template> </nz-list-item-meta> </nz-list-item> diff --git a/src/frontend/src/app/consent-management/consent-history/consent-history.component.scss b/src/frontend/src/app/consent-management/consent-history/consent-history.component.scss index 3eaddb313a1fd72c5e6764e4734832bc5ded46af..2910a58b4fcc6028e824e87305b3884d5d8367ae 100644 --- a/src/frontend/src/app/consent-management/consent-history/consent-history.component.scss +++ b/src/frontend/src/app/consent-management/consent-history/consent-history.component.scss @@ -94,7 +94,31 @@ font-weight: 600; font-size: 16px; } +.consent-list-revoke { + font-weight: 600; + font-size: 16px; + color: #5a6e7f; +} .consent-icon { font-size: 15px; } + +.consent-icon-revoke { + font-size: 15px; + color: #5a6e7f; +} + +.no-consent-content { + padding-top: 50px; + padding-bottom: 50px; + display: flex; + justify-content: center; + flex-direction: column; + align-items: center; + gap: 20px; +} + +.no-consent-text { + color: #5a6e7f; +}