MOBILE-3814 styles: Revisit button colors

main
Pau Ferrer Ocaña 2022-03-02 16:24:44 +01:00
parent 42bdc2ae76
commit cfaf7d5b06
42 changed files with 98 additions and 96 deletions

View File

@ -5,7 +5,7 @@
<div slot="end" class="flex-row"> <div slot="end" class="flex-row">
<!-- Download all courses. --> <!-- Download all courses. -->
<div *ngIf="downloadCoursesEnabled && filteredCourses.length > 1" class="core-button-spinner"> <div *ngIf="downloadCoursesEnabled && filteredCourses.length > 1" class="core-button-spinner">
<ion-button *ngIf="!prefetchCoursesData.loading" fill="clear" color="dark" (click)="prefetchCourses()" <ion-button *ngIf="!prefetchCoursesData.loading" fill="clear" (click)="prefetchCourses()"
[attr.aria-label]="prefetchCoursesData.statusTranslatable | translate"> [attr.aria-label]="prefetchCoursesData.statusTranslatable | translate">
<ion-icon [name]="prefetchCoursesData.icon" slot="icon-only" aria-hidden="true"> <ion-icon [name]="prefetchCoursesData.icon" slot="icon-only" aria-hidden="true">
</ion-icon> </ion-icon>

View File

@ -53,7 +53,7 @@
</ion-row> </ion-row>
</ion-col> </ion-col>
<ion-col class="addon-block-timeline-activity-action ion-no-padding" *ngIf="event.action?.actionable"> <ion-col class="addon-block-timeline-activity-action ion-no-padding" *ngIf="event.action?.actionable">
<ion-button fill="outline" color="medium" (click)="action($event, event.action.url)" [title]="event.action.name"> <ion-button fill="outline" (click)="action($event, event.action.url)" [title]="event.action.name">
{{event.action.name}} {{event.action.name}}
<ion-badge slot="end" class="ion-margin-start" *ngIf="event.action.showitemcount"> <ion-badge slot="end" class="ion-margin-start" *ngIf="event.action.showitemcount">
{{event.action.itemcount}} {{event.action.itemcount}}

View File

@ -118,7 +118,7 @@
<ion-label> <ion-label>
<p class="item-heading">{{ 'addon.calendar.reminders' | translate }}</p> <p class="item-heading">{{ 'addon.calendar.reminders' | translate }}</p>
</ion-label> </ion-label>
<ion-button fill="clear" color="dark" (click)="addReminder()" slot="end" <ion-button fill="clear" (click)="addReminder()" slot="end"
[attr.aria-label]="'addon.calendar.setnewreminder' | translate"> [attr.aria-label]="'addon.calendar.setnewreminder' | translate">
<ion-icon name="fas-plus" slot="icon-only" aria-hidden="true"></ion-icon> <ion-icon name="fas-plus" slot="icon-only" aria-hidden="true"></ion-icon>
</ion-button> </ion-button>

View File

@ -120,7 +120,7 @@
</ion-item> </ion-item>
<ion-item *ngIf="moduleUrl"> <ion-item *ngIf="moduleUrl">
<ion-label> <ion-label>
<ion-button expand="block" color="primary" [href]="moduleUrl" core-link capture="true"> <ion-button expand="block" [href]="moduleUrl" core-link capture="true">
{{ 'addon.calendar.gotoactivity' | translate }} {{ 'addon.calendar.gotoactivity' | translate }}
</ion-button> </ion-button>
</ion-label> </ion-label>
@ -148,7 +148,7 @@
<ng-container *ngIf="event.timestart > currentTime"> <ng-container *ngIf="event.timestart > currentTime">
<ion-item> <ion-item>
<ion-label> <ion-label>
<ion-button expand="block" color="primary" (click)="addReminder()"> <ion-button expand="block" (click)="addReminder()">
{{ 'addon.calendar.setnewreminder' | translate }} {{ 'addon.calendar.setnewreminder' | translate }}
</ion-button> </ion-button>
</ion-label> </ion-label>

View File

@ -157,7 +157,7 @@
<ion-button expand="block" class="ion-text-wrap ion-margin-bottom" (click)="confirmContactRequest()"> <ion-button expand="block" class="ion-text-wrap ion-margin-bottom" (click)="confirmContactRequest()">
{{ 'addon.messages.acceptandaddcontact' | translate }} {{ 'addon.messages.acceptandaddcontact' | translate }}
</ion-button> </ion-button>
<ion-button expand="block" class="ion-text-wrap ion-margin-bottom" color="light" (click)="declineContactRequest()"> <ion-button expand="block" class="ion-text-wrap ion-margin-bottom" fill="outline" (click)="declineContactRequest()">
{{ 'addon.messages.decline' | translate }} {{ 'addon.messages.decline' | translate }}
</ion-button> </ion-button>
</div> </div>

View File

@ -103,27 +103,26 @@
<ion-label> <ion-label>
<div *ngIf="!unsupportedEditPlugins.length && !showErrorStatementEdit"> <div *ngIf="!unsupportedEditPlugins.length && !showErrorStatementEdit">
<!-- If has offline data, show edit. --> <!-- If has offline data, show edit. -->
<ion-button expand="block" class="ion-text-wrap" color="primary" *ngIf="hasOffline" (click)="goToEdit()"> <ion-button expand="block" class="ion-text-wrap" *ngIf="hasOffline" (click)="goToEdit()">
{{ 'addon.mod_assign.editsubmission' | translate }} {{ 'addon.mod_assign.editsubmission' | translate }}
</ion-button> </ion-button>
<!-- If no submission or is new, show add submission. --> <!-- If no submission or is new, show add submission. -->
<ion-button expand="block" class="ion-text-wrap" color="primary" *ngIf="!hasOffline && <ion-button expand="block" class="ion-text-wrap" (click)="goToEdit()" *ngIf="!hasOffline &&
(!userSubmission || !userSubmission!.status || userSubmission!.status == statusNew)" (!userSubmission || !userSubmission!.status || userSubmission!.status == statusNew)">
(click)="goToEdit()">
{{ 'addon.mod_assign.addsubmission' | translate }} {{ 'addon.mod_assign.addsubmission' | translate }}
</ion-button> </ion-button>
<!-- If reopened, show addfromprevious and addnewattempt. --> <!-- If reopened, show addfromprevious and addnewattempt. -->
<ng-container *ngIf="!hasOffline && userSubmission?.status == statusReopened"> <ng-container *ngIf="!hasOffline && userSubmission?.status == statusReopened">
<ion-button *ngIf="!isPreviousAttemptEmpty" expand="block" class="ion-text-wrap" color="primary" <ion-button *ngIf="!isPreviousAttemptEmpty" expand="block" class="ion-text-wrap" (click)="copyPrevious()">
(click)="copyPrevious()">
{{ 'addon.mod_assign.addnewattemptfromprevious' | translate }} {{ 'addon.mod_assign.addnewattemptfromprevious' | translate }}
</ion-button> </ion-button>
<ion-button expand="block" class="ion-text-wrap" color="primary" (click)="goToEdit()"> <ion-button expand="block" class="ion-text-wrap" (click)="goToEdit()">
{{ 'addon.mod_assign.addnewattempt' | translate }} {{ 'addon.mod_assign.addnewattempt' | translate }}
</ion-button> </ion-button>
</ng-container> </ng-container>
<!-- Else show editsubmission. --> <!-- Else show editsubmission. -->
<ion-button expand="block" class="ion-text-wrap" color="primary" *ngIf="!hasOffline && userSubmission && userSubmission!.status && <ion-button expand="block" class="ion-text-wrap" *ngIf="!hasOffline &&
userSubmission && userSubmission!.status &&
userSubmission!.status != statusNew && userSubmission!.status != statusNew &&
userSubmission!.status != statusReopened" (click)="goToEdit()"> userSubmission!.status != statusReopened" (click)="goToEdit()">
{{ 'addon.mod_assign.editsubmission' | translate }} {{ 'addon.mod_assign.editsubmission' | translate }}

View File

@ -10,7 +10,7 @@
</ion-label> </ion-label>
<div slot="end"> <div slot="end">
<div class="ion-text-end"> <div class="ion-text-end">
<ion-button fill="clear" *ngIf="canEdit" (click)="editComment()" color="dark" [attr.aria-label]="'core.edit' | translate"> <ion-button fill="clear" *ngIf="canEdit" (click)="editComment()" [attr.aria-label]="'core.edit' | translate">
<ion-icon name="fas-pen" slot="icon-only" aria-hidden="true"></ion-icon> <ion-icon name="fas-pen" slot="icon-only" aria-hidden="true"></ion-icon>
</ion-button> </ion-button>
</div> </div>

View File

@ -26,7 +26,7 @@
<div collapsible-footer *ngIf="!showLoading" slot="fixed"> <div collapsible-footer *ngIf="!showLoading" slot="fixed">
<div class="list-item-limited-width" *ngIf="chat"> <div class="list-item-limited-width" *ngIf="chat">
<ion-button class="ion-margin ion-text-wrap" expand="block" color="primary" (click)="enterChat()"> <ion-button class="ion-margin ion-text-wrap" expand="block" (click)="enterChat()">
{{ 'addon.mod_chat.enterchat' | translate }} {{ 'addon.mod_chat.enterchat' | translate }}
</ion-button> </ion-button>
</div> </div>

View File

@ -1,24 +1,27 @@
<ion-button *ngIf="action == 'more'" fill="clear" (click)="viewEntry()" [attr.aria-label]="'addon.mod_data.more' | translate"> <ion-button size="small" *ngIf="action == 'more'" fill="clear" (click)="viewEntry()" [attr.aria-label]="'addon.mod_data.more' | translate">
<ion-icon name="fas-search" slot="icon-only" aria-hidden="true"></ion-icon> <ion-icon name="fas-search" slot="icon-only" aria-hidden="true"></ion-icon>
</ion-button> </ion-button>
<ion-button *ngIf="action == 'edit'" fill="clear" (click)="editEntry()" [attr.aria-label]="'core.edit' | translate"> <ion-button size="small" *ngIf="action == 'edit'" fill="clear" (click)="editEntry()" [attr.aria-label]="'core.edit' | translate">
<ion-icon name="fas-cog" slot="icon-only" aria-hidden="true"></ion-icon> <ion-icon name="fas-cog" slot="icon-only" aria-hidden="true"></ion-icon>
</ion-button> </ion-button>
<ion-button *ngIf="action == 'delete' && !entry.deleted" fill="clear" (click)="deleteEntry()" [attr.aria-label]="'core.delete' | translate"> <ion-button size="small" *ngIf="action == 'delete' && !entry.deleted" fill="clear" color="danger" (click)="deleteEntry()"
[attr.aria-label]="'core.delete' | translate">
<ion-icon name="fas-trash" slot="icon-only" aria-hidden="true"></ion-icon> <ion-icon name="fas-trash" slot="icon-only" aria-hidden="true"></ion-icon>
</ion-button> </ion-button>
<ion-button *ngIf="action == 'delete' && entry.deleted" fill="clear" (click)="undoDelete()" [attr.aria-label]="'core.restore' | translate"> <ion-button size="small" *ngIf="action == 'delete' && entry.deleted" fill="clear" color="danger" (click)="undoDelete()"
[attr.aria-label]="'core.restore' | translate">
<ion-icon name="fas-undo-alt" slot="icon-only" aria-hidden="true"></ion-icon> <ion-icon name="fas-undo-alt" slot="icon-only" aria-hidden="true"></ion-icon>
</ion-button> </ion-button>
<ion-button *ngIf="action == 'approve'" fill="clear" (click)="approveEntry()" [attr.aria-label]="'addon.mod_data.approve' | translate"> <ion-button size="small" *ngIf="action == 'approve'" fill="clear" (click)="approveEntry()"
[attr.aria-label]="'addon.mod_data.approve' | translate">
<ion-icon name="fas-thumbs-up" slot="icon-only" aria-hidden="true"></ion-icon> <ion-icon name="fas-thumbs-up" slot="icon-only" aria-hidden="true"></ion-icon>
</ion-button> </ion-button>
<ion-button *ngIf="action == 'disapprove'" fill="clear" (click)="disapproveEntry()" <ion-button size="small" *ngIf="action == 'disapprove'" fill="clear" (click)="disapproveEntry()"
[attr.aria-label]="'addon.mod_data.disapprove' | translate"> [attr.aria-label]="'addon.mod_data.disapprove' | translate">
<ion-icon name="far-thumbs-down" slot="icon-only" aria-hidden="true"></ion-icon> <ion-icon name="far-thumbs-down" slot="icon-only" aria-hidden="true"></ion-icon>
</ion-button> </ion-button>

View File

@ -72,8 +72,8 @@
<!-- Reset search. --> <!-- Reset search. -->
<ng-container *ngIf="search.searching && !isEmpty"> <ng-container *ngIf="search.searching && !isEmpty">
<ion-item (click)="searchReset()" button detail="false"> <ion-item (click)="searchReset()" button detail="false" *ngIf="!foundRecordsTranslationData">
<ion-label color="primary"> <ion-label color="info">
{{ 'addon.mod_data.resetsettings' | translate}} {{ 'addon.mod_data.resetsettings' | translate}}
</ion-label> </ion-label>
</ion-item> </ion-item>

View File

@ -64,7 +64,7 @@
<div collapsible-footer *ngIf="entryLoaded && hasPrevious || hasNext" slot="fixed"> <div collapsible-footer *ngIf="entryLoaded && hasPrevious || hasNext" slot="fixed">
<ion-row class="ion-justify-content-between ion-align-items-center ion-no-padding ion-wrap"> <ion-row class="ion-justify-content-between ion-align-items-center ion-no-padding ion-wrap">
<ion-col class="ion-text-start ion-no-padding core-navigation-arrow" size="auto"> <ion-col class="ion-text-start ion-no-padding core-navigation-arrow" size="auto">
<ion-button [disabled]="!hasPrevious" fill="clear" color="dark" [attr.aria-label]="'core.previous' | translate" <ion-button [disabled]="!hasPrevious" fill="clear" [attr.aria-label]="'core.previous' | translate"
(click)="gotoEntry(offset! -1)"> (click)="gotoEntry(offset! -1)">
<ion-icon name="fas-chevron-left" slot="icon-only" aria-hidden="true"></ion-icon> <ion-icon name="fas-chevron-left" slot="icon-only" aria-hidden="true"></ion-icon>
</ion-button> </ion-button>
@ -72,7 +72,7 @@
<ion-col class="ion-text-center"> <ion-col class="ion-text-center">
</ion-col> </ion-col>
<ion-col class="ion-text-end ion-no-padding core-navigation-arrow" size="auto"> <ion-col class="ion-text-end ion-no-padding core-navigation-arrow" size="auto">
<ion-button [disabled]="!hasNext" fill="clear" color="dark" [attr.aria-label]=" 'core.next' | translate" <ion-button [disabled]="!hasNext" fill="clear" [attr.aria-label]=" 'core.next' | translate"
(click)="gotoEntry(offset! + 1)"> (click)="gotoEntry(offset! + 1)">
<ion-icon name="fas-chevron-right" slot="icon-only" aria-hidden="true"></ion-icon> <ion-icon name="fas-chevron-right" slot="icon-only" aria-hidden="true"></ion-icon>
</ion-button> </ion-button>

View File

@ -57,7 +57,7 @@
[courseId]="courseId"> [courseId]="courseId">
</core-format-text> </core-format-text>
</p> </p>
<ion-button *ngIf="canPin || discussion.canlock || discussion.canfavourite" fill="clear" color="dark" <ion-button *ngIf="canPin || discussion.canlock || discussion.canfavourite" fill="clear"
[attr.aria-label]="('core.displayoptions' | translate)" (click)="showOptionsMenu($event, discussion)"> [attr.aria-label]="('core.displayoptions' | translate)" (click)="showOptionsMenu($event, discussion)">
<ion-icon name="ellipsis-vertical" slot="icon-only" aria-hidden="true"> <ion-icon name="ellipsis-vertical" slot="icon-only" aria-hidden="true">
</ion-icon> </ion-icon>

View File

@ -19,8 +19,8 @@
[attr.aria-label]="'addon.mod_forum.unread' | translate"> [attr.aria-label]="'addon.mod_forum.unread' | translate">
<ion-icon name="fas-circle" color="primary" aria-hidden="true"></ion-icon> <ion-icon name="fas-circle" color="primary" aria-hidden="true"></ion-icon>
</ion-note> </ion-note>
<ion-button *ngIf="optionsMenuEnabled" fill="clear" color="dark" <ion-button *ngIf="optionsMenuEnabled" fill="clear" [attr.aria-label]="('core.displayoptions' | translate)"
[attr.aria-label]="('core.displayoptions' | translate)" (click)="showOptionsMenu($event)"> (click)="showOptionsMenu($event)">
<ion-icon name="ellipsis-vertical" slot="icon-only" aria-hidden="true"> <ion-icon name="ellipsis-vertical" slot="icon-only" aria-hidden="true">
</ion-icon> </ion-icon>
</ion-button> </ion-button>
@ -47,8 +47,8 @@
[attr.aria-label]="'addon.mod_forum.unread' | translate"> [attr.aria-label]="'addon.mod_forum.unread' | translate">
<ion-icon name="fas-circle" color="primary" aria-hidden="true"></ion-icon> <ion-icon name="fas-circle" color="primary" aria-hidden="true"></ion-icon>
</ion-note> </ion-note>
<ion-button *ngIf="optionsMenuEnabled" fill="clear" color="dark" <ion-button *ngIf="optionsMenuEnabled" fill="clear" [attr.aria-label]="('core.displayoptions' | translate)"
[attr.aria-label]="('core.displayoptions' | translate)" (click)="showOptionsMenu($event)"> (click)="showOptionsMenu($event)">
<ion-icon name="ellipsis-vertical" slot="icon-only" aria-hidden="true"></ion-icon> <ion-icon name="ellipsis-vertical" slot="icon-only" aria-hidden="true"></ion-icon>
</ion-button> </ion-button>
</ng-container> </ng-container>

View File

@ -116,7 +116,7 @@
<div collapsible-footer *ngIf="loaded && numPages > 1" slot="fixed"> <div collapsible-footer *ngIf="loaded && numPages > 1" slot="fixed">
<ion-row class="ion-justify-content-between ion-align-items-center ion-no-padding ion-wrap"> <ion-row class="ion-justify-content-between ion-align-items-center ion-no-padding ion-wrap">
<ion-col class="ion-text-start ion-no-padding core-navigation-arrow" size="auto" *ngIf="!showAll"> <ion-col class="ion-text-start ion-no-padding core-navigation-arrow" size="auto" *ngIf="!showAll">
<ion-button [disabled]="previousPage < 0" fill="clear" color="dark" [attr.aria-label]="'core.previous' | translate" <ion-button [disabled]="previousPage < 0" fill="clear" [attr.aria-label]="'core.previous' | translate"
(click)="changePage(previousPage)"> (click)="changePage(previousPage)">
<ion-icon name="fas-chevron-left" slot="icon-only" aria-hidden="true"></ion-icon> <ion-icon name="fas-chevron-left" slot="icon-only" aria-hidden="true"></ion-icon>
</ion-button> </ion-button>
@ -129,7 +129,7 @@
</ion-button> </ion-button>
</ion-col> </ion-col>
<ion-col class="ion-text-end ion-no-padding core-navigation-arrow" size="auto" *ngIf="!showAll"> <ion-col class="ion-text-end ion-no-padding core-navigation-arrow" size="auto" *ngIf="!showAll">
<ion-button [disabled]="nextPage >= numPages" fill="clear" color="dark" [attr.aria-label]="'core.next' | translate" <ion-button [disabled]="nextPage >= numPages" fill="clear" [attr.aria-label]="'core.next' | translate"
(click)="changePage(nextPage)"> (click)="changePage(nextPage)">
<ion-icon name="fas-chevron-right" slot="icon-only" aria-hidden="true"></ion-icon> <ion-icon name="fas-chevron-right" slot="icon-only" aria-hidden="true"></ion-icon>
</ion-button> </ion-button>

View File

@ -19,7 +19,7 @@
<p class="item-heading ion-text-wrap">{{ 'addon.storagemanager.totaldownloads' | translate }}</p> <p class="item-heading ion-text-wrap">{{ 'addon.storagemanager.totaldownloads' | translate }}</p>
<ion-badge color="light">{{ totalSize | coreBytesToSize }}</ion-badge> <ion-badge color="light">{{ totalSize | coreBytesToSize }}</ion-badge>
</ion-label> </ion-label>
<ion-button slot="end" (click)="deleteForCourse()" [disabled]="totalSize == 0" color="danger" fill="outline"> <ion-button slot="end" (click)="deleteForCourse()" [disabled]="totalSize == 0" color="danger" fill="clear">
<ion-icon name="fas-trash" slot="icon-only" [attr.aria-label]="'addon.storagemanager.deletedatafrom' | translate: <ion-icon name="fas-trash" slot="icon-only" [attr.aria-label]="'addon.storagemanager.deletedatafrom' | translate:
{ name: title }"> { name: title }">
</ion-icon> </ion-icon>
@ -48,7 +48,7 @@
</p> </p>
</ion-label> </ion-label>
<div class="storage-buttons" slot="end" *ngIf="section.totalSize > 0 || downloadEnabled"> <div class="storage-buttons" slot="end" *ngIf="section.totalSize > 0 || downloadEnabled">
<ion-button (click)="deleteForSection(section)" *ngIf="section.totalSize > 0" color="danger" fill="outline"> <ion-button (click)="deleteForSection(section)" *ngIf="section.totalSize > 0" color="danger" fill="clear">
<ion-icon name="fas-trash" slot="icon-only" <ion-icon name="fas-trash" slot="icon-only"
[attr.aria-label]="'addon.storagemanager.deletedatafrom' | translate: { name: section.name }"> [attr.aria-label]="'addon.storagemanager.deletedatafrom' | translate: { name: section.name }">
</ion-icon> </ion-icon>

View File

@ -21,7 +21,7 @@
</ion-label> </ion-label>
<ion-button fill="clear" color="danger" slot="end" (click)="deleteSiteStorage($event)" <ion-button fill="clear" color="danger" slot="end" (click)="deleteSiteStorage($event)"
[hidden]="spaceUsage.spaceUsage! + spaceUsage.cacheEntries! <= 0" [hidden]="spaceUsage.spaceUsage! + spaceUsage.cacheEntries! <= 0"
[attr.aria-label]="'addon.storagemanager.deleteallsitedata' | translate" fill="outline"> [attr.aria-label]="'addon.storagemanager.deleteallsitedata' | translate">
<ion-icon name="fas-trash" slot="icon-only" aria-hidden="true"></ion-icon> <ion-icon name="fas-trash" slot="icon-only" aria-hidden="true"></ion-icon>
</ion-button> </ion-button>
</ion-item> </ion-item>
@ -37,7 +37,7 @@
<ion-badge color="light">{{ totalSize | coreBytesToSize }}</ion-badge> <ion-badge color="light">{{ totalSize | coreBytesToSize }}</ion-badge>
</ion-label> </ion-label>
<ion-button slot="end" (click)="deleteCompletelyDownloadedCourses($event)" <ion-button slot="end" (click)="deleteCompletelyDownloadedCourses($event)"
[disabled]="completelyDownloadedCourses.length === 0" color="danger" fill="outline"> [disabled]="completelyDownloadedCourses.length === 0" color="danger" fill="clear">
<ion-icon name="fas-trash" slot="icon-only" ariaLabel="{{ 'addon.storagemanager.deletecourses' | translate }}"> <ion-icon name="fas-trash" slot="icon-only" ariaLabel="{{ 'addon.storagemanager.deletecourses' | translate }}">
</ion-icon> </ion-icon>
</ion-button> </ion-button>

View File

@ -1,14 +1,13 @@
<ng-container *ngIf="enabled && !loading"> <ng-container *ngIf="enabled && !loading">
<!-- Download button. --> <!-- Download button. -->
<ion-button *ngIf="status == statusNotDownloaded" fill="clear" (click)="download($event, false)" color="dark" @coreShowHideAnimation <ion-button *ngIf="status == statusNotDownloaded" fill="clear" (click)="download($event, false)" @coreShowHideAnimation
[attr.aria-label]="(statusTranslatable || 'core.download') | translate"> [attr.aria-label]="(statusTranslatable || 'core.download') | translate">
<ion-icon slot="icon-only" name="fas-cloud-download-alt" aria-hidden="true"></ion-icon> <ion-icon slot="icon-only" name="fas-cloud-download-alt" aria-hidden="true"></ion-icon>
</ion-button> </ion-button>
<!-- Refresh button. --> <!-- Refresh button. -->
<ion-button *ngIf="status == statusOutdated || (status == statusDownloaded && !canTrustDownload)" fill="clear" <ion-button *ngIf="status == statusOutdated || (status == statusDownloaded && !canTrustDownload)" fill="clear"
(click)="download($event, true)" color="primary" @coreShowHideAnimation (click)="download($event, true)" @coreShowHideAnimation [attr.aria-label]="(statusTranslatable || 'core.refresh') | translate">
[attr.aria-label]="(statusTranslatable || 'core.refresh') | translate">
<ion-icon slot="icon-only" name="fam-cloud-refresh" aria-hidden="true"></ion-icon> <ion-icon slot="icon-only" name="fam-cloud-refresh" aria-hidden="true"></ion-icon>
</ion-button> </ion-button>

View File

@ -12,8 +12,7 @@
(action)="download()"> (action)="download()">
</core-download-refresh> </core-download-refresh>
<ion-button fill="clear" *ngIf="isDownloaded && isIOS" (click)="openFile($event, true)" color="dark" <ion-button fill="clear" *ngIf="isDownloaded && isIOS" (click)="openFile($event, true)" [title]="openButtonLabel | translate">
[title]="openButtonLabel | translate">
<ion-icon slot="icon-only" [name]="openButtonIcon" aria-hidden="true"></ion-icon> <ion-icon slot="icon-only" [name]="openButtonIcon" aria-hidden="true"></ion-icon>
</ion-button> </ion-button>

View File

@ -1,9 +1,9 @@
<ion-button fill="clear" color="dark" (click)="scroll('backward')" [hidden]="scrollPosition === 'hidden'" <ion-button fill="clear" (click)="scroll('backward')" [hidden]="scrollPosition === 'hidden'" [disabled]="scrollPosition === 'start'"
[disabled]="scrollPosition === 'start'" [attr.aria-label]="'core.scrollbackward' | translate" [attr.aria-controls]="targetId"> [attr.aria-label]="'core.scrollbackward' | translate" [attr.aria-controls]="targetId">
<ion-icon name="fas-chevron-left" slot="icon-only" aria-hidden="true"></ion-icon> <ion-icon name="fas-chevron-left" slot="icon-only" aria-hidden="true"></ion-icon>
</ion-button> </ion-button>
<ion-button fill="clear" color="dark" (click)="scroll('forward')" [hidden]="scrollPosition === 'hidden'" <ion-button fill="clear" (click)="scroll('forward')" [hidden]="scrollPosition === 'hidden'" [disabled]="scrollPosition === 'end'"
[disabled]="scrollPosition === 'end'" [attr.aria-label]="'core.scrollforward' | translate" [attr.aria-controls]="targetId"> [attr.aria-label]="'core.scrollforward' | translate" [attr.aria-controls]="targetId">
<ion-icon name="fas-chevron-right" slot="icon-only" aria-hidden="true"></ion-icon> <ion-icon name="fas-chevron-right" slot="icon-only" aria-hidden="true"></ion-icon>
</ion-button> </ion-button>

View File

@ -13,8 +13,8 @@
[src]="safeUrl" [attr.allowfullscreen]="allowFullscreen ? 'allowfullscreen' : null"> [src]="safeUrl" [attr.allowfullscreen]="allowFullscreen ? 'allowfullscreen' : null">
</iframe> </iframe>
<ion-button *ngIf="!loading && displayHelp" color="dark" expand="block" fill="clear" (click)="openIframeHelpModal()" <ion-button *ngIf="!loading && displayHelp" expand="block" fill="clear" (click)="openIframeHelpModal()" aria-haspopup="dialog"
aria-haspopup="dialog" class="core-button-as-link core-iframe-help"> class="core-button-as-link core-iframe-help">
{{ 'core.iframehelp' | translate }} {{ 'core.iframehelp' | translate }}
</ion-button> </ion-button>

View File

@ -24,7 +24,7 @@
<ng-container *ngIf="manage"> <ng-container *ngIf="manage">
<ion-button *ngIf="!editMode" fill="clear" [core-suppress-events] (onClick)="activateEdit($event)" <ion-button *ngIf="!editMode" fill="clear" [core-suppress-events] (onClick)="activateEdit($event)"
[attr.aria-label]="'core.edit' | translate" color="dark"> [attr.aria-label]="'core.edit' | translate">
<ion-icon name="fas-pen" slot="icon-only" aria-hidden="true"></ion-icon> <ion-icon name="fas-pen" slot="icon-only" aria-hidden="true"></ion-icon>
</ion-button> </ion-button>

View File

@ -1,7 +1,6 @@
<ion-row class="ion-justify-content-between ion-align-items-center ion-no-padding ion-wrap" *ngIf="items.length > 1"> <ion-row class="ion-justify-content-between ion-align-items-center ion-no-padding ion-wrap" *ngIf="items.length > 1">
<ion-col class="ion-text-start ion-no-padding core-navigation-arrow" size="auto"> <ion-col class="ion-text-start ion-no-padding core-navigation-arrow" size="auto">
<ion-button [disabled]="previousIndex < 0" fill="clear" color="dark" [attr.aria-label]="previousTitle" <ion-button [disabled]="previousIndex < 0" fill="clear" [attr.aria-label]="previousTitle" (click)="navigate(previousIndex)">
(click)="navigate(previousIndex)">
<ion-icon name="fas-chevron-left" slot="icon-only" aria-hidden="true"></ion-icon> <ion-icon name="fas-chevron-left" slot="icon-only" aria-hidden="true"></ion-icon>
</ion-button> </ion-button>
</ion-col> </ion-col>
@ -10,7 +9,7 @@
</core-progress-bar> </core-progress-bar>
</ion-col> </ion-col>
<ion-col class="ion-text-end ion-no-padding core-navigation-arrow" size="auto"> <ion-col class="ion-text-end ion-no-padding core-navigation-arrow" size="auto">
<ion-button [disabled]="nextIndex < 0" fill="clear" color="dark" [attr.aria-label]="nextTitle" (click)="navigate(nextIndex)"> <ion-button [disabled]="nextIndex < 0" fill="clear" [attr.aria-label]="nextTitle" (click)="navigate(nextIndex)">
<ion-icon name="fas-chevron-right" slot="icon-only" aria-hidden="true"></ion-icon> <ion-icon name="fas-chevron-right" slot="icon-only" aria-hidden="true"></ion-icon>
</ion-button> </ion-button>
</ion-col> </ion-col>

View File

@ -7,6 +7,6 @@
</textarea> </textarea>
<ion-button fill="clear" size="large" type="submit" [disabled]="!message || sendDisabled" [attr.aria-label]="'core.send' | translate" <ion-button fill="clear" size="large" type="submit" [disabled]="!message || sendDisabled" [attr.aria-label]="'core.send' | translate"
[core-suppress-events] (onClick)="submitForm($event)"> [core-suppress-events] (onClick)="submitForm($event)">
<ion-icon name="send" color="dark" slot="icon-only" aria-hidden="true" flip-rtl></ion-icon> <ion-icon name="send" slot="icon-only" aria-hidden="true" flip-rtl></ion-icon>
</ion-button> </ion-button>
</form> </form>

View File

@ -27,13 +27,13 @@
<ion-buttons class="ion-padding core-course-section-nav-buttons safe-area-padding-horizontal list-item-limited-width" <ion-buttons class="ion-padding core-course-section-nav-buttons safe-area-padding-horizontal list-item-limited-width"
*ngIf="displayCourseIndex && (previousSection || nextSection)"> *ngIf="displayCourseIndex && (previousSection || nextSection)">
<ion-button *ngIf="previousSection" (click)="sectionChanged(previousSection)" color="primary" fill="solid" expand="block" <ion-button *ngIf="previousSection" (click)="sectionChanged(previousSection)" fill="solid" expand="block"
[attr.aria-label]="('core.previous' | translate) + ': ' + previousSection.name"> [attr.aria-label]="('core.previous' | translate) + ': ' + previousSection.name">
<ion-icon name="fas-arrow-left" slot="start" aria-hidden="true"></ion-icon> <ion-icon name="fas-arrow-left" slot="start" aria-hidden="true"></ion-icon>
<core-format-text [text]="previousSection.name" contextLevel="course" [contextInstanceId]="course.id"> <core-format-text [text]="previousSection.name" contextLevel="course" [contextInstanceId]="course.id">
</core-format-text> </core-format-text>
</ion-button> </ion-button>
<ion-button *ngIf="nextSection" (click)="sectionChanged(nextSection)" color="primary" fill="solid" expand="block" <ion-button *ngIf="nextSection" (click)="sectionChanged(nextSection)" fill="solid" expand="block"
[attr.aria-label]="('core.next' | translate) + ': ' + nextSection.name"> [attr.aria-label]="('core.next' | translate) + ': ' + nextSection.name">
<core-format-text [text]="nextSection.name" contextLevel="course" [contextInstanceId]="course.id"> <core-format-text [text]="nextSection.name" contextLevel="course" [contextInstanceId]="course.id">
</core-format-text> </core-format-text>
@ -49,7 +49,7 @@
<!-- Course Index button. --> <!-- Course Index button. -->
<ion-fab slot="fixed" core-fab vertical="bottom" horizontal="end" *ngIf="loaded && displayCourseIndex"> <ion-fab slot="fixed" core-fab vertical="bottom" horizontal="end" *ngIf="loaded && displayCourseIndex">
<ion-fab-button (click)="openCourseIndex()" [attr.aria-label]="'core.course.courseindex' | translate"> <ion-fab-button (click)="openCourseIndex()" [attr.aria-label]="'core.course.courseindex' | translate" color="secondary">
<ion-icon name="fas-list-ul" aria-hidden="true"></ion-icon> <ion-icon name="fas-list-ul" aria-hidden="true"></ion-icon>
<span class="sr-only">{{'core.course.courseindex' | translate }}</span> <span class="sr-only">{{'core.course.courseindex' | translate }}</span>
</ion-fab-button> </ion-fab-button>

View File

@ -7,8 +7,8 @@
<ion-icon *ngIf="completion?.offline" name="fas-sync" [attr.aria-label]="'core.course.manualcompletionnotsynced' | translate" <ion-icon *ngIf="completion?.offline" name="fas-sync" [attr.aria-label]="'core.course.manualcompletionnotsynced' | translate"
slot="end"></ion-icon> slot="end"></ion-icon>
</ion-button> </ion-button>
<ion-button *ngIf="!completion.state" color="dark" fill="outline" [attr.aria-label]="accessibleDescription" <ion-button *ngIf="!completion.state" fill="outline" [attr.aria-label]="accessibleDescription" (click)="completionClicked($event)"
(click)="completionClicked($event)" class="ion-text-wrap" [class.chip]="mode == 'basic'"> class="ion-text-wrap" [class.chip]="mode == 'basic'">
{{ 'core.course.completion_manual:markdone' | translate }} {{ 'core.course.completion_manual:markdone' | translate }}
<ion-icon *ngIf="completion?.offline" name="fas-sync" [attr.aria-label]="'core.course.manualcompletionnotsynced' | translate" <ion-icon *ngIf="completion?.offline" name="fas-sync" [attr.aria-label]="'core.course.manualcompletionnotsynced' | translate"
slot="end"></ion-icon> slot="end"></ion-icon>
@ -16,7 +16,7 @@
</ng-container> </ng-container>
<ng-container *ngIf="!completion.istrackeduser"> <ng-container *ngIf="!completion.istrackeduser">
<ion-button disabled="true" color="dark" fill="outline" class="ion-text-wrap" [class.chip]="mode == 'basic'"> <ion-button disabled="true" fill="outline" class="ion-text-wrap" [class.chip]="mode == 'basic'">
{{ 'core.course.completion_manual:markdone' | translate }} {{ 'core.course.completion_manual:markdone' | translate }}
</ion-button> </ion-button>
</ng-container> </ng-container>

View File

@ -2,13 +2,13 @@
<ion-row class="ion-justify-content-between ion-align-items-center ion-no-padding ion-wrap" *ngIf="previousModule || nextModule"> <ion-row class="ion-justify-content-between ion-align-items-center ion-no-padding ion-wrap" *ngIf="previousModule || nextModule">
<ion-col size="auto" class="ion-no-padding core-course-module-navigation-arrow"> <ion-col size="auto" class="ion-no-padding core-course-module-navigation-arrow">
<ion-button fill="clear" class="core-course-previous-module" [disabled]="!previousModule" (click)="goToActivity(false)" <ion-button fill="clear" class="core-course-previous-module" [disabled]="!previousModule" (click)="goToActivity(false)"
[attr.aria-label]="'core.course.gotopreviousactivity' | translate" color="dark"> [attr.aria-label]="'core.course.gotopreviousactivity' | translate">
<ion-icon name="fas-arrow-left" slot="icon-only" aria-hidden="true"></ion-icon> <ion-icon name="fas-arrow-left" slot="icon-only" aria-hidden="true"></ion-icon>
</ion-button> </ion-button>
</ion-col> </ion-col>
<ion-col size="auto" class="ion-no-padding core-course-module-navigation-arrow"> <ion-col size="auto" class="ion-no-padding core-course-module-navigation-arrow">
<ion-button fill="clear" class="core-course-next-module" [disabled]="!nextModule" (click)="goToActivity(true)" <ion-button fill="clear" class="core-course-next-module" [disabled]="!nextModule" (click)="goToActivity(true)"
[attr.aria-label]="'core.course.gotonextactivity' | translate" color="dark"> [attr.aria-label]="'core.course.gotonextactivity' | translate">
<ion-icon name="fas-arrow-right" slot="icon-only" aria-hidden="true"></ion-icon> <ion-icon name="fas-arrow-right" slot="icon-only" aria-hidden="true"></ion-icon>
</ion-button> </ion-button>
</ion-col> </ion-col>

View File

@ -25,7 +25,7 @@
</h1> </h1>
</ion-label> </ion-label>
<ion-button fill="clear" *ngIf="displayOptions.displayOpenInBrowser" [href]="externalUrl" core-link [showBrowserWarning]="false" <ion-button fill="clear" *ngIf="displayOptions.displayOpenInBrowser" [href]="externalUrl" core-link [showBrowserWarning]="false"
color="dark" [attr.aria-label]="'core.openinbrowser' | translate" slot="end"> [attr.aria-label]="'core.openinbrowser' | translate" slot="end">
<ion-icon name="fas-external-link-alt" slot="icon-only" aria-hidden="true"></ion-icon> <ion-icon name="fas-external-link-alt" slot="icon-only" aria-hidden="true"></ion-icon>
</ion-button> </ion-button>
</ion-item> </ion-item>
@ -80,7 +80,7 @@
</ion-label> </ion-label>
</ion-item> </ion-item>
<ion-button fill="outline" expand="block" *ngIf="canPrefetch && displayOptions.displayPrefetch" class="ion-text-wrap" <ion-button fill="outline" expand="block" *ngIf="canPrefetch && displayOptions.displayPrefetch" class="ion-text-wrap"
(click)="prefetch()" color="primary" [disabled]="prefetchDisabled"> (click)="prefetch()" [disabled]="prefetchDisabled">
<ion-icon *ngIf="!prefetchLoading" name="fas-cloud-download-alt" slot="start" aria-hidden="true"></ion-icon> <ion-icon *ngIf="!prefetchLoading" name="fas-cloud-download-alt" slot="start" aria-hidden="true"></ion-icon>
<ion-spinner *ngIf="prefetchLoading" slot="start" aria-hidden="true"></ion-spinner> <ion-spinner *ngIf="prefetchLoading" slot="start" aria-hidden="true"></ion-spinner>
<ion-label> <ion-label>
@ -197,14 +197,14 @@
</core-loading> </core-loading>
</ion-content> </ion-content>
<ion-footer *ngIf="loaded && isOnline && displayOptions.displayRefresh"> <ion-footer *ngIf="loaded && isOnline && displayOptions.displayRefresh">
<ion-button class="ion-margin" *ngIf="!hasOffline" (click)="refresh()" expand="block"> <ion-button class="ion-margin" *ngIf="!hasOffline" (click)="refresh()" expand="block" fill="outline">
<ion-icon name="fas-redo-alt" slot="start" aria-hidden="true"></ion-icon> <ion-icon name="fas-redo-alt" slot="start" aria-hidden="true"></ion-icon>
<ion-label> <ion-label>
{{ 'core.refresh' | translate }} {{ 'core.refresh' | translate }}
</ion-label> </ion-label>
</ion-button> </ion-button>
<ion-button class="ion-margin" *ngIf="hasOffline" (click)="sync()" expand="block"> <ion-button class="ion-margin" *ngIf="hasOffline" (click)="sync()" expand="block" fill="outline">
<ion-icon name="fas-sync-alt" slot="start" aria-hidden="true"></ion-icon> <ion-icon name="fas-sync-alt" slot="start" aria-hidden="true"></ion-icon>
<ion-label> <ion-label>
{{ 'core.settings.synchronizenow' | translate }} {{ 'core.settings.synchronizenow' | translate }}

View File

@ -53,7 +53,7 @@
<div class="core-module-buttons-more"> <div class="core-module-buttons-more">
<!-- Buttons defined by the module handler. --> <!-- Buttons defined by the module handler. -->
<ion-button fill="clear" *ngFor="let button of module.handlerData.buttons" color="dark" <ion-button fill="clear" *ngFor="let button of module.handlerData.buttons"
[hidden]="button.hidden || module.handlerData.spinner" class="core-animate-show-hide" [hidden]="button.hidden || module.handlerData.spinner" class="core-animate-show-hide"
(click)="buttonClicked($event, button)" [attr.aria-label]="button.label | translate:{$a: module.handlerData.title}"> (click)="buttonClicked($event, button)" [attr.aria-label]="button.label | translate:{$a: module.handlerData.title}">
<ion-icon [name]="button.icon" slot="icon-only" aria-hidden="true"></ion-icon> <ion-icon [name]="button.icon" slot="icon-only" aria-hidden="true"></ion-icon>

View File

@ -36,7 +36,7 @@
<core-format-text [text]="course.fullname" contextLevel="course" [contextInstanceId]="course.id"> <core-format-text [text]="course.fullname" contextLevel="course" [contextInstanceId]="course.id">
</core-format-text> </core-format-text>
</h2> </h2>
<ion-chip color="brand" *ngIf="course.categoryname" class="core-course-category ion-text-nowrap"> <ion-chip color="primary" *ngIf="course.categoryname" class="core-course-category ion-text-nowrap">
<span class="sr-only">{{ 'core.courses.aria:coursecategory' | translate }}</span> <span class="sr-only">{{ 'core.courses.aria:coursecategory' | translate }}</span>
<ion-label> <ion-label>
<core-format-text [text]="course.categoryname" contextLevel="coursecat" [contextInstanceId]="course.categoryid"> <core-format-text [text]="course.categoryname" contextLevel="coursecat" [contextInstanceId]="course.categoryid">
@ -61,7 +61,7 @@
</p> </p>
</div> </div>
</ion-label> </ion-label>
<ion-button fill="clear" [href]="courseUrl" core-link [showBrowserWarning]="false" color="dark" <ion-button fill="clear" [href]="courseUrl" core-link [showBrowserWarning]="false"
[attr.aria-label]="'core.openinbrowser' | translate" slot="end"> [attr.aria-label]="'core.openinbrowser' | translate" slot="end">
<ion-icon name="fas-external-link-alt" slot="icon-only" aria-hidden="true"></ion-icon> <ion-icon name="fas-external-link-alt" slot="icon-only" aria-hidden="true"></ion-icon>
</ion-button> </ion-button>

View File

@ -12,7 +12,7 @@
<ion-buttons slot="end"> <ion-buttons slot="end">
<ion-button fill="clear" *ngIf="module.url && module.uservisible && !unsupported" [href]="module.url" core-link <ion-button fill="clear" *ngIf="module.url && module.uservisible && !unsupported" [href]="module.url" core-link
[showBrowserWarning]="false" color="dark" [attr.aria-label]="'core.openinbrowser' | translate"> [showBrowserWarning]="false" [attr.aria-label]="'core.openinbrowser' | translate">
<ion-icon name="fas-external-link-alt" slot="icon-only" aria-hidden="true"></ion-icon> <ion-icon name="fas-external-link-alt" slot="icon-only" aria-hidden="true"></ion-icon>
</ion-button> </ion-button>
</ion-buttons> </ion-buttons>

View File

@ -17,7 +17,7 @@
<div class="core-button-spinner" *ngIf="courseOptionMenuEnabled"> <div class="core-button-spinner" *ngIf="courseOptionMenuEnabled">
<!-- Options menu. --> <!-- Options menu. -->
<ion-button fill="clear" color="dark" (click)="showCourseOptionsMenu($event)" *ngIf="!showSpinner" <ion-button fill="clear" (click)="showCourseOptionsMenu($event)" *ngIf="!showSpinner"
[attr.aria-label]="('core.displayoptions' | translate)"> [attr.aria-label]="('core.displayoptions' | translate)">
<ion-icon name="ellipsis-vertical" slot="icon-only" aria-hidden="true"></ion-icon> <ion-icon name="ellipsis-vertical" slot="icon-only" aria-hidden="true"></ion-icon>
</ion-button> </ion-button>
@ -66,7 +66,7 @@
color="success" role="status" [attr.aria-label]="'core.downloaded' | translate"></ion-icon> color="success" role="status" [attr.aria-label]="'core.downloaded' | translate"></ion-icon>
</p> </p>
<ion-chip color="brand" *ngIf="course.categoryname" <ion-chip color="primary" *ngIf="course.categoryname"
class="core-course-category core-course-additional-info ion-text-nowrap"> class="core-course-category core-course-additional-info ion-text-nowrap">
<span class="sr-only">{{ 'core.courses.aria:coursecategory' | translate }}</span> <span class="sr-only">{{ 'core.courses.aria:coursecategory' | translate }}</span>
<ion-label> <ion-label>

View File

@ -47,7 +47,7 @@
name="fam-cloud-done" color="success" role="status" [attr.aria-label]="'core.downloaded' | translate"></ion-icon> name="fam-cloud-done" color="success" role="status" [attr.aria-label]="'core.downloaded' | translate"></ion-icon>
<!-- Options menu. --> <!-- Options menu. -->
<ion-button fill="clear" color="dark" (click)="showCourseOptionsMenu($event)" *ngIf="!showSpinner" <ion-button fill="clear" (click)="showCourseOptionsMenu($event)" *ngIf="!showSpinner"
[attr.aria-label]="('core.displayoptions' | translate)"> [attr.aria-label]="('core.displayoptions' | translate)">
<ion-icon name="ellipsis-vertical" slot="icon-only" aria-hidden="true"></ion-icon> <ion-icon name="ellipsis-vertical" slot="icon-only" aria-hidden="true"></ion-icon>
</ion-button> </ion-button>

View File

@ -31,7 +31,7 @@
<!-- Download all courses. --> <!-- Download all courses. -->
<div *ngIf="downloadCoursesEnabled && myOverviewBlock && myOverviewBlock.filteredCourses.length > 1" <div *ngIf="downloadCoursesEnabled && myOverviewBlock && myOverviewBlock.filteredCourses.length > 1"
class="core-button-spinner"> class="core-button-spinner">
<ion-button *ngIf="!myOverviewBlock.prefetchCoursesData.loading" fill="clear" color="dark" <ion-button *ngIf="!myOverviewBlock.prefetchCoursesData.loading" fill="clear"
(click)="myOverviewBlock.prefetchCourses()" (click)="myOverviewBlock.prefetchCourses()"
[attr.aria-label]="myOverviewBlock.prefetchCoursesData.statusTranslatable | translate"> [attr.aria-label]="myOverviewBlock.prefetchCoursesData.statusTranslatable | translate">
<ion-icon [name]="myOverviewBlock.prefetchCoursesData.icon" slot="icon-only" aria-hidden="true"> <ion-icon [name]="myOverviewBlock.prefetchCoursesData.icon" slot="icon-only" aria-hidden="true">

View File

@ -62,7 +62,7 @@
</form> </form>
<!-- Forgotten password option. --> <!-- Forgotten password option. -->
<ion-button *ngIf="showForgottenPassword" expand="block" fill="clear" color="dark" <ion-button *ngIf="showForgottenPassword" expand="block" fill="clear"
class="core-login-forgotten-password core-button-as-link ion-text-wrap" (click)="forgottenPassword()"> class="core-login-forgotten-password core-button-as-link ion-text-wrap" (click)="forgottenPassword()">
{{ 'core.login.forgotten' | translate }} {{ 'core.login.forgotten' | translate }}
</ion-button> </ion-button>

View File

@ -76,7 +76,7 @@
</form> </form>
<!-- Forgotten password option. --> <!-- Forgotten password option. -->
<ion-button *ngIf="showForgottenPassword && !isOAuth" expand="block" fill="clear" color="dark" <ion-button *ngIf="showForgottenPassword && !isOAuth" expand="block" fill="clear"
class="core-login-forgotten-password core-button-as-link ion-text-wrap" (click)="forgottenPassword()"> class="core-login-forgotten-password core-button-as-link ion-text-wrap" (click)="forgottenPassword()">
{{ 'core.login.forgotten' | translate }} {{ 'core.login.forgotten' | translate }}
</ion-button> </ion-button>

View File

@ -110,7 +110,7 @@
<!-- Help. --> <!-- Help. -->
<ion-button class="ion-margin-top core-login-need-help core-button-as-link ion-text-wrap" (click)="showHelp()" <ion-button class="ion-margin-top core-login-need-help core-button-as-link ion-text-wrap" (click)="showHelp()"
aria-haspopup="dialog" expand="block" fill="clear" color="dark"> aria-haspopup="dialog" expand="block" fill="clear">
{{ 'core.needhelp' | translate }} {{ 'core.needhelp' | translate }}
</ion-button> </ion-button>
</div> </div>

View File

@ -17,7 +17,7 @@
<ion-item class="ion-text-center core-user-profile-maininfo ion-text-wrap" lines="full"> <ion-item class="ion-text-center core-user-profile-maininfo ion-text-wrap" lines="full">
<core-user-avatar [user]="user" [userId]="user.id" [linkProfile]="false" [checkOnline]="!canChangeProfilePicture"> <core-user-avatar [user]="user" [userId]="user.id" [linkProfile]="false" [checkOnline]="!canChangeProfilePicture">
<ion-button class="edit-avatar" *ngIf="canChangeProfilePicture" (click)="changeProfilePicture()" <ion-button class="edit-avatar" *ngIf="canChangeProfilePicture" (click)="changeProfilePicture()"
[attr.aria-label]="'core.user.newpicture' | translate" fill="clear" color="dark"> [attr.aria-label]="'core.user.newpicture' | translate" fill="clear">
<ion-icon slot="icon-only" name="fas-pen" aria-hidden="true"></ion-icon> <ion-icon slot="icon-only" name="fas-pen" aria-hidden="true"></ion-icon>
</ion-button> </ion-button>
</core-user-avatar> </core-user-avatar>
@ -94,7 +94,7 @@
</a></p> </a></p>
</ion-label> </ion-label>
</ion-item> </ion-item>
<ion-item class="ion-text-wrap" *ngIf="interests" class="core-user-profile-interests"> <ion-item class="ion-text-wrap core-user-profile-interests" *ngIf="interests">
<ion-label> <ion-label>
<h2>{{ 'core.user.interests' | translate}}</h2> <h2>{{ 'core.user.interests' | translate}}</h2>
<ion-badge *ngFor="let interest of interests" role="link" (click)="openInterest(interest)"> <ion-badge *ngFor="let interest of interests" role="link" (click)="openInterest(interest)">

View File

@ -25,7 +25,6 @@ interface ColorComponents {
* Ionic color names. * Ionic color names.
*/ */
export enum CoreIonicColorNames { export enum CoreIonicColorNames {
BRAND = 'brand',
PRIMARY = 'primary', PRIMARY = 'primary',
SECONDARY = 'secondary', SECONDARY = 'secondary',
SUCCESS = 'success', SUCCESS = 'success',

View File

@ -17,7 +17,7 @@ $gray-900: #1d2125 !default; // Copy text
$black: #000000 !default; // Avoid usage $black: #000000 !default; // Avoid usage
$blue: #0f6cbf !default; $blue: #0f6cbf !default;
$cyan: #008196 !default; $cyan: #008196 !default; // Not used.
$green: #357a32 !default; $green: #357a32 !default;
$red: #ca3120 !default; $red: #ca3120 !default;
$yellow: #f0ad4e !default; $yellow: #f0ad4e !default;
@ -39,19 +39,19 @@ $ion-item-background-rgb: color-to-rgb-list($ion-item-background) !default;
$ion-item-background-dark: $gray-900 !default; $ion-item-background-dark: $gray-900 !default;
$ion-item-background-dark-rgb: color-to-rgb-list($ion-item-background-dark) !default; $ion-item-background-dark-rgb: color-to-rgb-list($ion-item-background-dark) !default;
$primary: $blue !default; $primary: $brand-color !default;
$secondary: $gray-400 !default; $secondary: $gray-300 !default;
$danger: $red !default; $danger: $red !default;
$warning: $yellow !default; $warning: $yellow !default;
$success: $green !default; $success: $green !default;
$info: $cyan !default; $info: $blue !default;
$light: $gray-100 !default; $light: $gray-100 !default;
$medium: $gray-600 !default; $medium: $gray-600 !default;
$dark: $gray-800 !default; $dark: $gray-800 !default;
$colors: ( $colors: (
primary: (light: $primary), primary: (light: $primary, dark: $primary),
secondary: (light: $secondary), secondary: (light: $secondary, dark: $gray-700),
success: (light: $success), success: (light: $success),
warning: (light: $warning), warning: (light: $warning),
danger: (light: $danger), danger: (light: $danger),
@ -59,7 +59,6 @@ $colors: (
light: (light: $light, dark: $dark), light: (light: $light, dark: $dark),
medium: (light: $medium, dark: $gray-200), medium: (light: $medium, dark: $gray-200),
dark: (light: $dark, dark: $light), dark: (light: $dark, dark: $light),
brand: (light: $brand-color, dark: $brand-color),
) !default; ) !default;
/** /**

View File

@ -370,6 +370,10 @@ ion-button.button.button-clear.button-has-icon-only {
--border-radius: var(--huge-radius); --border-radius: var(--huge-radius);
} }
ion-button.button.button-clear {
--color: var(--dark);
}
ion-button.button.button-solid, ion-button.button.button-solid,
ion-button.button.button-outline { ion-button.button.button-outline {
--border-radius: var(--core-input-radius); --border-radius: var(--core-input-radius);

View File

@ -65,7 +65,7 @@
} }
} }
--core-link-color: var(--primary-tint); --core-link-color: var(--info-tint);
--core-header-toolbar-background: var(--gray-900); --core-header-toolbar-background: var(--gray-900);
--core-header-toolbar-color: var(--white); --core-header-toolbar-color: var(--white);

View File

@ -47,7 +47,8 @@
@include generate-color($color-name, $colors); @include generate-color($color-name, $colors);
} }
--brand-color: var(--brand); --brand-color: var(--primary);
--brand-contrast: var(--primary-contrast);
// Accessibility vars. // Accessibility vars.
--a11y-min-target-size: 44px; --a11y-min-target-size: 44px;
@ -112,9 +113,9 @@
--core-bottom-tabs-background: var(--white); --core-bottom-tabs-background: var(--white);
--core-bottom-tabs-color: var(--gray-700); --core-bottom-tabs-color: var(--gray-700);
--core-bottom-tabs-color-selected: var(--brand); --core-bottom-tabs-color-selected: var(--brand-color);
--core-bottom-tabs-background-selected: transparent; --core-bottom-tabs-background-selected: transparent;
--core-bottom-tabs-badge-color: var(--brand); --core-bottom-tabs-badge-color: var(--brand-color);
--core-bottom-tabs-badge-text-color: var(--brand-contrast); --core-bottom-tabs-badge-text-color: var(--brand-contrast);
--bottom-tabs-size: 48px; --bottom-tabs-size: 48px;
--side-tabs-size: 56px; --side-tabs-size: 56px;
@ -125,7 +126,7 @@
--background-selected: var(--core-bottom-tabs-background-selected); --background-selected: var(--core-bottom-tabs-background-selected);
} }
--core-link-color: var(--primary); --core-link-color: var(--info);
a { a {
color: var(--core-link-color); color: var(--core-link-color);
} }
@ -202,7 +203,7 @@
ion-action-sheet { ion-action-sheet {
--button-color: var(--ion-text-color); --button-color: var(--ion-text-color);
--button-color-selected: var(--ion-text-color); --button-color-selected: var(--ion-text-color);
--title-border-color: var(--brand); --title-border-color: var(--brand-color);
.action-sheet-title { .action-sheet-title {
--color: var(--ion-text-color); --color: var(--ion-text-color);
@ -224,7 +225,7 @@
--core-tab-color: var(--subdued-text-color); --core-tab-color: var(--subdued-text-color);
--core-tab-border-color: var(--stroke); --core-tab-border-color: var(--stroke);
--core-tab-color-active: var(--dark); --core-tab-color-active: var(--dark);
--core-tab-border-color-active: var(--brand); --core-tab-border-color-active: var(--brand-color);
--core-tab-font-weight-active: normal; --core-tab-font-weight-active: normal;
--core-tabs-height: 48px; --core-tabs-height: 48px;
core-tabs, core-tabs-outlet { core-tabs, core-tabs-outlet {
@ -238,7 +239,7 @@
} }
} }
--core-loading-spinner: var(--brand); --core-loading-spinner: var(--brand-color);
ion-loading { ion-loading {
--spinner-color: var(--core-loading-spinner); --spinner-color: var(--core-loading-spinner);
} }
@ -249,7 +250,7 @@
} }
--core-progressbar-height: 8px; --core-progressbar-height: 8px;
--core-progressbar-color: var(--brand); --core-progressbar-color: var(--brand-color);
--core-progressbar-text-color: var(--medium); --core-progressbar-text-color: var(--medium);
--core-progressbar-background: var(--brand-tint); --core-progressbar-background: var(--brand-tint);
@ -303,7 +304,7 @@
--core-login-input-background: var(--white); --core-login-input-background: var(--white);
--core-login-input-color: var(--gray-900); --core-login-input-color: var(--gray-900);
--core-star-color: var(--brand); --core-star-color: var(--brand-color);
--core-large-avatar-size: 90px; --core-large-avatar-size: 90px;
--core-avatar-size: var(--a11y-min-target-size); --core-avatar-size: var(--a11y-min-target-size);