MOBILE-3814 style: Use chips on course completion statuses

main
Pau Ferrer Ocaña 2022-01-28 09:16:42 +01:00
parent 5c29cd3a05
commit f7c5f572eb
2 changed files with 19 additions and 12 deletions

View File

@ -3,24 +3,27 @@
<ng-container *ngIf="completion.istrackeduser">
<ng-container *ngFor="let rule of details">
<ion-badge *ngIf="rule.statuscomplete" color="success" role="listitem" [attr.aria-label]="rule.accessibleDescription">
<strong>{{ 'core.course.completion_automatic:done' | translate }}</strong> {{ rule.rulevalue.description }}
</ion-badge>
<ion-chip *ngIf="rule.statuscomplete" color="success" role="listitem" [attr.aria-label]="rule.accessibleDescription">
<ion-label><strong>{{ 'core.course.completion_automatic:done' | translate }}</strong> {{ rule.rulevalue.description }}
</ion-label>
</ion-chip>
<ion-badge *ngIf="rule.statuscompletefail" color="danger" role="listitem" [attr.aria-label]="rule.accessibleDescription">
<strong>{{ 'core.course.completion_automatic:failed' | translate }}</strong> {{ rule.rulevalue.description }}
</ion-badge>
<ion-chip *ngIf="rule.statuscompletefail" color="danger" role="listitem" [attr.aria-label]="rule.accessibleDescription">
<ion-label><strong>{{ 'core.course.completion_automatic:failed' | translate }}</strong> {{ rule.rulevalue.description }}
</ion-label>
</ion-chip>
<ion-badge *ngIf="rule.statusincomplete" color="medium" role="listitem" [attr.aria-label]="rule.accessibleDescription">
<strong>{{ 'core.course.completion_automatic:todo' | translate }}</strong> {{ rule.rulevalue.description }}
</ion-badge>
<ion-chip *ngIf="rule.statusincomplete" color="medium" role="listitem" [attr.aria-label]="rule.accessibleDescription">
<ion-label><strong>{{ 'core.course.completion_automatic:todo' | translate }}</strong> {{ rule.rulevalue.description }}
</ion-label>
</ion-chip>
</ng-container>
</ng-container>
<ng-container *ngIf="!completion.istrackeduser">
<ion-badge *ngFor="let rule of details" color="light" role="listitem">
{{ rule.rulevalue.description }}
</ion-badge>
<ion-chip *ngFor="let rule of details" color="light" role="listitem">
<ion-label>{{ rule.rulevalue.description }}</ion-label>
</ion-chip>
</ng-container>
</div>

View File

@ -842,6 +842,10 @@ ion-select-popover ion-item.core-select-option-title {
}
}
ion-chip {
line-height: 1.1;
}
ion-searchbar {
.searchbar-search-icon.ios {
top: 4px;