MOBILE-3745 a11y: Minor improvements on dividers
parent
833f65c628
commit
6e94f0b3ab
|
@ -126,8 +126,8 @@
|
|||
<ion-icon *ngIf="!advanced" name="fas-caret-right" slot="start" aria-hidden="true"></ion-icon>
|
||||
<ion-icon *ngIf="advanced" name="fas-caret-down" slot="start" aria-hidden="true"></ion-icon>
|
||||
<ion-label>
|
||||
<span *ngIf="!advanced">{{ 'core.showmore' | translate }}</span>
|
||||
<span *ngIf="advanced">{{ 'core.showless' | translate }}</span>
|
||||
<h2 *ngIf="!advanced">{{ 'core.showmore' | translate }}</h2>
|
||||
<h2 *ngIf="advanced">{{ 'core.showless' | translate }}</h2>
|
||||
</ion-label>
|
||||
</ion-item-divider>
|
||||
|
||||
|
|
|
@ -40,7 +40,7 @@
|
|||
<ion-list *ngIf="filteredEvents && filteredEvents.length" class="ion-no-margin">
|
||||
<ng-container *ngFor="let event of filteredEvents">
|
||||
<ion-item-divider *ngIf="event.showDate">
|
||||
<ion-label>{{ event.timestart * 1000 | coreFormatDate: "strftimedayshort" }}</ion-label>
|
||||
<ion-label><h2>{{ event.timestart * 1000 | coreFormatDate: "strftimedayshort" }}</h2></ion-label>
|
||||
</ion-item-divider>
|
||||
<ion-item class="addon-calendar-event ion-text-wrap" [attr.aria-label]="event.name" (click)="gotoEvent(event.id)"
|
||||
[attr.aria-current]="event.id == eventId ? 'page' : 'false'"
|
||||
|
|
|
@ -28,7 +28,7 @@
|
|||
</ion-card>
|
||||
<ion-card *ngIf="completion && tracked">
|
||||
<ion-item-divider>
|
||||
<ion-label>{{ 'addon.coursecompletion.requiredcriteria' | translate }}</ion-label>
|
||||
<ion-label><h2>{{ 'addon.coursecompletion.requiredcriteria' | translate }}</h2></ion-label>
|
||||
</ion-item-divider>
|
||||
<ion-item class="ion-hide-md-up ion-text-wrap" *ngFor="let criteria of completion.completions">
|
||||
<ion-label>
|
||||
|
@ -71,7 +71,7 @@
|
|||
</ion-card>
|
||||
<ion-card *ngIf="showSelfComplete && tracked">
|
||||
<ion-item-divider>
|
||||
<ion-label>{{ 'addon.coursecompletion.manualselfcompletion' | translate }}</ion-label>
|
||||
<ion-label><h2>{{ 'addon.coursecompletion.manualselfcompletion' | translate }}</h2></ion-label>
|
||||
</ion-item-divider>
|
||||
<ion-item>
|
||||
<ion-label>
|
||||
|
|
|
@ -93,7 +93,8 @@
|
|||
[@coreSlideInOut]="message.useridfrom == currentUserId ? '' : 'fromLeft'">
|
||||
<ion-label>
|
||||
<!-- User data. -->
|
||||
<h2 class="addon-message-user">
|
||||
<h2 class="addon-message-user" [attr.aria-label]="message.useridfrom == currentUserId ?
|
||||
('addon.messages.you' | translate) : members[message.useridfrom].fullname">
|
||||
<core-user-avatar slot="start" [user]="members[message.useridfrom]" [linkProfile]="false"
|
||||
*ngIf="message.showUserData"></core-user-avatar>
|
||||
|
||||
|
@ -101,7 +102,7 @@
|
|||
|
||||
<ion-note *ngIf="!message.pending">{{ message.timecreated | coreFormatDate: "strftimetime" }}</ion-note>
|
||||
<ion-note *ngIf="message.pending">
|
||||
<ion-icon name="fas-clock" [attr.aria-label]="'core.notsent' | translate "></ion-icon>
|
||||
<ion-icon name="fas-clock" [attr.aria-label]="'core.notsent' | translate" role="status"></ion-icon>
|
||||
</ion-note>
|
||||
</h2>
|
||||
|
||||
|
|
|
@ -37,7 +37,7 @@
|
|||
[attr.aria-expanded]="favourites.expanded" role="heading button">
|
||||
<ion-icon *ngIf="!favourites.expanded" name="fas-caret-right" slot="start" aria-hidden="true"></ion-icon>
|
||||
<ion-icon *ngIf="favourites.expanded" name="fas-caret-down" slot="start" aria-hidden="true"></ion-icon>
|
||||
<ion-label>{{ 'core.favourites' | translate }} ({{ favourites.count }})</ion-label>
|
||||
<ion-label><h2>{{ 'core.favourites' | translate }} ({{ favourites.count }})</h2></ion-label>
|
||||
<ion-badge slot="end" *ngIf="favourites.unread">{{ favourites.unread }}</ion-badge>
|
||||
</ion-item-divider>
|
||||
<div [hidden]="!favourites.conversations || !favourites.expanded || favourites.loading" #favlist>
|
||||
|
@ -60,7 +60,7 @@
|
|||
[attr.aria-expanded]="group.expanded" role="heading button">
|
||||
<ion-icon *ngIf="!group.expanded" name="fas-caret-right" slot="start" aria-hidden="true"></ion-icon>
|
||||
<ion-icon *ngIf="group.expanded" name="fas-caret-down" slot="start" aria-hidden="true"></ion-icon>
|
||||
<ion-label>{{ 'addon.messages.groupconversations' | translate }} ({{ group.count }})</ion-label>
|
||||
<ion-label><h2>{{ 'addon.messages.groupconversations' | translate }} ({{ group.count }})</h2></ion-label>
|
||||
<ion-badge slot="end" *ngIf="group.unread">{{ group.unread }}</ion-badge>
|
||||
</ion-item-divider>
|
||||
<div [hidden]="!group.conversations || !group.expanded || group.loading" #grouplist>
|
||||
|
@ -82,7 +82,9 @@
|
|||
[attr.aria-expanded]="individual.expanded" role="heading button">
|
||||
<ion-icon *ngIf="!individual.expanded" name="fas-caret-right" slot="start" aria-hidden="true"></ion-icon>
|
||||
<ion-icon *ngIf="individual.expanded" name="fas-caret-down" slot="start" aria-hidden="true"></ion-icon>
|
||||
<ion-label>{{ 'addon.messages.individualconversations' | translate }} ({{ individual.count }})</ion-label>
|
||||
<ion-label>
|
||||
<h2>{{ 'addon.messages.individualconversations' | translate }} ({{ individual.count }})</h2>
|
||||
</ion-label>
|
||||
<ion-badge slot="end" *ngIf="individual.unread">{{ individual.unread }}</ion-badge>
|
||||
</ion-item-divider>
|
||||
<div [hidden]="!individual.conversations || !individual.expanded || individual.loading" #indlist>
|
||||
|
|
|
@ -38,7 +38,7 @@
|
|||
<ng-template #resultsTemplate let-item="item">
|
||||
<ng-container *ngIf="item.results.length > 0">
|
||||
<ion-item-divider class="ion-text-wrap">
|
||||
<ion-label>{{ item.titleString | translate }}</ion-label>
|
||||
<ion-label><h2>{{ item.titleString | translate }}</h2></ion-label>
|
||||
</ion-item-divider>
|
||||
|
||||
<!-- List of results -->
|
||||
|
|
|
@ -26,7 +26,7 @@
|
|||
</ion-item>
|
||||
|
||||
<ion-item-divider>
|
||||
<ion-label>{{ 'addon.mod_feedback.non_respondents_students' | translate : {$a: total } }}</ion-label>
|
||||
<ion-label><h2>{{ 'addon.mod_feedback.non_respondents_students' | translate : {$a: total } }}</h2></ion-label>
|
||||
</ion-item-divider>
|
||||
<ng-container *ngIf="total > 0">
|
||||
<ion-item *ngFor="let user of users" class="ion-text-wrap">
|
||||
|
|
|
@ -29,7 +29,7 @@
|
|||
<ng-container *ngIf="responses.responses.total > 0">
|
||||
<ion-item-divider>
|
||||
<ion-label>
|
||||
{{ 'addon.mod_feedback.non_anonymous_entries' | translate : {$a: responses.responses.total } }}
|
||||
<h2>{{ 'addon.mod_feedback.non_anonymous_entries' | translate : {$a: responses.responses.total } }}</h2>
|
||||
</ion-label>
|
||||
</ion-item-divider>
|
||||
<ion-item *ngFor="let attempt of responses.responses.attempts" class="ion-text-wrap" button detail="true"
|
||||
|
@ -54,7 +54,7 @@
|
|||
<ng-container *ngIf="responses.anonResponses.total > 0">
|
||||
<ion-item-divider>
|
||||
<ion-label>
|
||||
{{ 'addon.mod_feedback.anonymous_entries' |translate : {$a: responses.anonResponses.total } }}
|
||||
<h2>{{ 'addon.mod_feedback.anonymous_entries' |translate : {$a: responses.anonResponses.total } }}</h2>
|
||||
</ion-label>
|
||||
</ion-item-divider>
|
||||
<ion-item *ngFor="let attempt of responses.anonResponses.attempts" class="ion-text-wrap" button detail="true"
|
||||
|
|
|
@ -29,7 +29,7 @@
|
|||
[attr.aria-expanded]="advanced" [attr.aria-label]="(advanced ? 'core.hideadvanced' : 'core.showadvanced') | translate">
|
||||
<ion-icon *ngIf="!advanced" name="fa-caret-right" slot="start" aria-hidden="true"></ion-icon>
|
||||
<ion-icon *ngIf="advanced" name="fa-caret-down" slot="start" aria-hidden="true"></ion-icon>
|
||||
<ion-label>{{ 'addon.mod_forum.advanced' | translate }}</ion-label>
|
||||
<ion-label><h2>{{ 'addon.mod_forum.advanced' | translate }}</h2></ion-label>
|
||||
</ion-item-divider>
|
||||
<ng-container *ngIf="advanced">
|
||||
<core-attachments *ngIf="forum.id && forum.maxattachments > 0"
|
||||
|
|
|
@ -127,7 +127,7 @@
|
|||
<ion-label>
|
||||
<ion-icon *ngIf="!advanced" name="fa-caret-right" slot="start" aria-hidden="true"></ion-icon>
|
||||
<ion-icon *ngIf="advanced" name="fa-caret-down" slot="start" aria-hidden="true"></ion-icon>
|
||||
{{ 'addon.mod_forum.advanced' | translate }}
|
||||
<h2>{{ 'addon.mod_forum.advanced' | translate }}</h2>
|
||||
</ion-label>
|
||||
</ion-item-divider>
|
||||
<ng-container *ngIf="advanced">
|
||||
|
|
|
@ -35,7 +35,7 @@
|
|||
[attr.aria-label]="(advanced ? 'core.hideadvanced' : 'core.showadvanced') |translate" role="heading button">
|
||||
<ion-icon *ngIf="!advanced" name="fa-caret-right" slot="start" aria-hidden="true"></ion-icon>
|
||||
<ion-icon *ngIf="advanced" name="fa-caret-down" slot="start" aria-hidden="true"></ion-icon>
|
||||
<ion-label>{{ 'addon.mod_forum.advanced' | translate }}</ion-label>
|
||||
<ion-label><h2>{{ 'addon.mod_forum.advanced' | translate }}</h2></ion-label>
|
||||
</ion-item-divider>
|
||||
<ng-container *ngIf="advanced">
|
||||
<ion-item *ngIf="showGroups && groupIds.length > 1 && accessInfo.cancanposttomygroups">
|
||||
|
|
|
@ -64,7 +64,7 @@
|
|||
|
||||
<ion-list *ngIf="!isSearch && entries.offlineEntries.length > 0">
|
||||
<ion-item-divider>
|
||||
<ion-label>{{ 'addon.mod_glossary.entriestobesynced' | translate }}</ion-label>
|
||||
<ion-label><h2>{{ 'addon.mod_glossary.entriestobesynced' | translate }}</h2></ion-label>
|
||||
</ion-item-divider>
|
||||
<ion-item *ngFor="let entry of entries.offlineEntries" (click)="entries.select(entry)" detail="false" button
|
||||
[attr.aria-current]="entries.getItemAriaCurrent(entry)">
|
||||
|
@ -79,7 +79,7 @@
|
|||
<ion-list *ngIf="entries.onlineEntries.length > 0">
|
||||
<ng-container *ngFor="let entry of entries.onlineEntries; let index = index">
|
||||
<ion-item-divider *ngIf="getDivider && showDivider(entry, entries.onlineEntries[index - 1])">
|
||||
{{ getDivider!(entry) }}
|
||||
<ion-label><h2>{{ getDivider!(entry) }}</h2></ion-label>
|
||||
</ion-item-divider>
|
||||
|
||||
<ion-item button (click)="entries.select(entry)" [attr.aria-current]="entries.getItemAriaCurrent(entry)"
|
||||
|
|
|
@ -46,14 +46,14 @@
|
|||
</ion-textarea>
|
||||
</ion-item>
|
||||
<ion-item-divider>
|
||||
<ion-label>{{ 'addon.mod_glossary.attachment' | translate }}</ion-label>
|
||||
<ion-label><h2>{{ 'addon.mod_glossary.attachment' | translate }}</h2></ion-label>
|
||||
</ion-item-divider>
|
||||
<core-attachments [files]="attachments" [component]="component" [componentId]="glossary.coursemodule"
|
||||
[allowOffline]="true">
|
||||
</core-attachments>
|
||||
<ng-container *ngIf="glossary.usedynalink">
|
||||
<ion-item-divider>
|
||||
<ion-label>{{ 'addon.mod_glossary.linking' | translate }}</ion-label>
|
||||
<ion-label><h2>{{ 'addon.mod_glossary.linking' | translate }}</h2></ion-label>
|
||||
</ion-item-divider>
|
||||
<ion-item class="ion-text-wrap">
|
||||
<ion-label>{{ 'addon.mod_glossary.entryusedynalink' | translate }}</ion-label>
|
||||
|
|
|
@ -57,9 +57,13 @@
|
|||
(ngSubmit)="submitQuestion($event)">
|
||||
|
||||
<ion-item-divider class="ion-text-wrap" *ngIf="pageContent">
|
||||
<ion-label>
|
||||
<h2>
|
||||
<core-format-text [component]="component" [componentId]="lesson?.coursemodule" [text]="pageContent"
|
||||
contextLevel="module" [contextInstanceId]="lesson.coursemodule" [courseId]="courseId">
|
||||
</core-format-text>
|
||||
</h2>
|
||||
</ion-label>
|
||||
</ion-item-divider>
|
||||
|
||||
<!-- Render a different input depending on the type of the question. -->
|
||||
|
|
|
@ -18,7 +18,7 @@
|
|||
</ion-item>
|
||||
<ng-container *ngFor="let letter of map">
|
||||
<ion-item-divider *ngIf="letter.label">
|
||||
<ion-label>{{ letter.label }}</ion-label>
|
||||
<ion-label><h2>{{ letter.label }}</h2></ion-label>
|
||||
</ion-item-divider>
|
||||
<ion-item class="ion-text-wrap" *ngFor="let page of letter.pages" (click)="goToPage(page)"
|
||||
[attr.aria-current]="selectedTitle == page.title ? 'page' : 'false'" button>
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<ion-list>
|
||||
<ng-container *ngFor="let group of subwikis">
|
||||
<ion-item-divider *ngIf="group.label">
|
||||
<ion-label><strong>{{ group.label }}</strong></ion-label>
|
||||
<ion-label><h2>{{ group.label }}</h2></ion-label>
|
||||
</ion-item-divider>
|
||||
<ion-item class="ion-text-wrap" *ngFor="let subwiki of group.subwikis" (click)="openSubwiki(subwiki)"
|
||||
[attr.disabled]="!subwiki.canedit && subwiki.id <= 0"
|
||||
|
|
|
@ -118,7 +118,10 @@
|
|||
[class.core-section-download]="downloadEnabled"
|
||||
[class.item-dimmed]="section.visible === 0 || section.uservisible === false">
|
||||
<ion-label>
|
||||
<core-format-text [text]="section.name" contextLevel="course" [contextInstanceId]="course?.id"></core-format-text>
|
||||
<h2>
|
||||
<core-format-text [text]="section.name" contextLevel="course" [contextInstanceId]="course?.id">
|
||||
</core-format-text>
|
||||
</h2>
|
||||
<!-- Section download. -->
|
||||
<ng-container *ngTemplateOutlet="sectionDownloadTemplate; context: {section: section}"></ng-container>
|
||||
<p *ngIf="section.visible === 0 || section.availabilityinfo">
|
||||
|
|
|
@ -90,7 +90,7 @@
|
|||
|
||||
<!-- Username and password. -->
|
||||
<ion-item-divider class="ion-text-wrap">
|
||||
<ion-label>{{ 'core.login.createuserandpass' | translate }}</ion-label>
|
||||
<ion-label><h3>{{ 'core.login.createuserandpass' | translate }}</h3></ion-label>
|
||||
</ion-item-divider>
|
||||
<ion-item class="ion-text-wrap">
|
||||
<ion-label position="stacked">
|
||||
|
@ -119,7 +119,7 @@
|
|||
<!-- More details. -->
|
||||
<ion-item-divider class="ion-text-wrap">
|
||||
<ion-label>
|
||||
{{ 'core.login.supplyinfo' | translate }}
|
||||
<h3>{{ 'core.login.supplyinfo' | translate }}</h3>
|
||||
</ion-label>
|
||||
</ion-item-divider>
|
||||
<ion-item class="ion-text-wrap">
|
||||
|
@ -169,7 +169,7 @@
|
|||
<!-- Other categories. -->
|
||||
<ng-container *ngFor="let category of categories">
|
||||
<ion-item-divider class="ion-text-wrap">
|
||||
<ion-label>{{ category.name }}</ion-label>
|
||||
<ion-label><h3>{{ category.name }}</h3></ion-label>
|
||||
</ion-item-divider>
|
||||
<core-user-profile-field *ngFor="let field of category.fields" [field]="field" [edit]="true" [signup]="true"
|
||||
registerAuth="email" [form]="signupForm"></core-user-profile-field>
|
||||
|
@ -179,7 +179,7 @@
|
|||
<ng-container *ngIf="settings.recaptchapublickey">
|
||||
<ion-item-divider class="ion-text-wrap">
|
||||
<ion-label>
|
||||
<span [core-mark-required]="true">{{ 'core.login.security_question' | translate }}</span>
|
||||
<h3><span [core-mark-required]="true">{{ 'core.login.security_question' | translate }}</span></h3>
|
||||
</ion-label>
|
||||
</ion-item-divider>
|
||||
<core-recaptcha [publicKey]="settings.recaptchapublickey" [model]="captcha" [siteUrl]="siteUrl"></core-recaptcha>
|
||||
|
@ -188,7 +188,7 @@
|
|||
<!-- Site policy (if any). -->
|
||||
<ng-container *ngIf="settings.sitepolicy">
|
||||
<ion-item-divider class="ion-text-wrap">
|
||||
<ion-label>{{ 'core.login.policyagreement' | translate }}</ion-label>
|
||||
<ion-label><h3>{{ 'core.login.policyagreement' | translate }}</h3></ion-label>
|
||||
</ion-item-divider>
|
||||
<ion-item class="ion-text-wrap">
|
||||
<ion-label>
|
||||
|
@ -217,9 +217,9 @@
|
|||
<ion-list *ngIf="allRequiredSupported && isMinor">
|
||||
<ion-item-divider class="ion-text-wrap">
|
||||
<ion-label>
|
||||
<p *ngIf="siteName" class="item-heading ion-padding">
|
||||
<h3 *ngIf="siteName" class="item-heading ion-padding">
|
||||
<core-format-text [text]="siteName" [filter]="false"></core-format-text>
|
||||
</p>
|
||||
</h3>
|
||||
</ion-label>
|
||||
</ion-item-divider>
|
||||
<ion-item class="ion-text-wrap" lines="none">
|
||||
|
|
|
@ -16,7 +16,7 @@
|
|||
<ion-card>
|
||||
<form [formGroup]="myForm" (ngSubmit)="resetPassword($event)" #resetPasswordForm>
|
||||
<ion-item-divider class="ion-text-wrap">
|
||||
<ion-label>{{ 'core.login.searchby' | translate }}</ion-label>
|
||||
<ion-label><h2>{{ 'core.login.searchby' | translate }}</h2></ion-label>
|
||||
</ion-item-divider>
|
||||
<ion-radio-group formControlName="field">
|
||||
<ion-item>
|
||||
|
|
|
@ -31,7 +31,9 @@
|
|||
|
||||
<!-- Site home items: news, categories, courses, etc. -->
|
||||
<ng-container *ngIf="items.length > 0">
|
||||
<ion-item-divider *ngIf="section && section!.hasContent"></ion-item-divider>
|
||||
<ion-item-divider *ngIf="section && section!.hasContent">
|
||||
<ion-label></ion-label>
|
||||
</ion-item-divider>
|
||||
<ng-container *ngFor="let item of items">
|
||||
<ng-container [ngSwitch]="item">
|
||||
<ng-container *ngSwitchCase="'LIST_OF_COURSE'">
|
||||
|
|
|
@ -13,7 +13,7 @@
|
|||
<core-loading [hideUntil]="userLoaded">
|
||||
<ion-list *ngIf="user">
|
||||
<ion-item-group *ngIf="hasContact">
|
||||
<ion-item-divider><ion-label>{{ 'core.user.contact' | translate}}</ion-label></ion-item-divider>
|
||||
<ion-item-divider><ion-label><h2>{{ 'core.user.contact' | translate}}</h2></ion-label></ion-item-divider>
|
||||
<ion-item class="ion-text-wrap" *ngIf="user.email">
|
||||
<ion-label>
|
||||
<h2>{{ 'core.user.email' | translate }}</h2>
|
||||
|
@ -60,7 +60,7 @@
|
|||
</ion-item>
|
||||
</ion-item-group>
|
||||
<ion-item-group *ngIf="hasDetails">
|
||||
<ion-item-divider><ion-label>{{ 'core.userdetails' | translate}}</ion-label></ion-item-divider>
|
||||
<ion-item-divider><ion-label><h2>{{ 'core.userdetails' | translate}}</h2></ion-label></ion-item-divider>
|
||||
<ion-item class="ion-text-wrap" *ngIf="user.url">
|
||||
<ion-label>
|
||||
<h2>{{ 'core.user.webpage' | translate}}</h2>
|
||||
|
@ -80,7 +80,7 @@
|
|||
</core-user-profile-field>
|
||||
</ion-item-group>
|
||||
<ion-item-group *ngIf="user.description">
|
||||
<ion-item-divider><ion-label>{{ 'core.user.description' | translate}}</ion-label></ion-item-divider>
|
||||
<ion-item-divider><ion-label><h2>{{ 'core.user.description' | translate}}</h2></ion-label></ion-item-divider>
|
||||
<ion-item class="ion-text-wrap">
|
||||
<ion-label>
|
||||
<p><core-format-text [text]="user.description" contextLevel="user" [contextInstanceId]="user.id">
|
||||
|
|
Loading…
Reference in New Issue