MOBILE-2567 ux: Fix more RTL rules

src/addon/files/pages/list/list.html

@@ -36,7 +36,7 @@
     </core-loading>
 
     <!-- Upload a private file. -->
-    <ion-fab bottom right *ngIf="showUpload && root != 'site' && !path">
+    <ion-fab bottom end *ngIf="showUpload && root != 'site' && !path">
         <button ion-fab (click)="uploadFile()" [attr.aria-label]="'core.fileuploader.uploadafile' | translate">
             <ion-icon name="add"></ion-icon>
         </button>

src/addon/mod/assign/feedback/comments/component/addon-mod-assign-feedback-comments.html

@@ -5,7 +5,7 @@
         <core-format-text [component]="component" [componentId]="assign.cmid" [maxHeight]="80" [fullOnClick]="true" [fullTitle]="plugin.name" [text]="text"></core-format-text>
     </p>
     <div item-end>
-        <div text-right>
+        <div text-end>
             <button ion-button icon-only clear *ngIf="canEdit" (click)="editComment()" color="dark">
                 <ion-icon name="create"></ion-icon>
             </button>

src/addon/mod/book/components/toc-popover/addon-mod-assign-submission-toc-popover.html

@@ -1,5 +1,5 @@
 <ion-list>
     <a ion-item text-wrap *ngFor="let chapter of chapters" (click)="loadChapter(chapter.id)" detail-none>
-        <p [attr.padding-start]="chapter.level == 1 ? true : null">{{chapter.title}}</p>
+        <p [attr.padding-left]="chapter.level == 1 ? true : null">{{chapter.title}}</p>
     </a>
 </ion-list>

src/addon/mod/data/components/index/addon-mod-data-index.html

@@ -92,7 +92,7 @@
 
 </core-loading>
 
-<ion-fab bottom right *ngIf="canAdd">
+<ion-fab bottom end *ngIf="canAdd">
     <button ion-fab (click)="gotoAddEntries($event)" [attr.aria-label]="'addon.mod_data.addentries' | translate">
         <ion-icon name="add"></ion-icon>
     </button>

src/addon/mod/glossary/components/index/addon-mod-glossary-index.html

@@ -61,7 +61,7 @@
             </ion-infinite-scroll>
         </core-loading>
 
-        <ion-fab bottom right *ngIf="canAdd">
+        <ion-fab bottom end *ngIf="canAdd">
             <button ion-fab (click)="openNewEntry()" [attr.aria-label]="'addon.mod_glossary.addentry' | translate">
                 <ion-icon name="add"></ion-icon>
             </button>

src/addon/mod/imscp/components/toc-popover/addon-mod-imscp-toc-popover.html

@@ -1,5 +1,5 @@
 <ion-list>
     <a ion-item *ngFor="let item of items" (click)="loadItem(item.href)" detail-none [class.core-bold]="!item.href">
-        <span padding-start *ngFor="let i of getNumberForPadding(item.level)"></span>{{item.title}}
+        <span padding-left *ngFor="let i of getNumberForPadding(item.level)"></span>{{item.title}}
     </a>
 </ion-list>

src/addon/mod/lesson/pages/player/player.html

@@ -50,7 +50,7 @@
 
                         <!-- Short answer. -->
                         <ng-container *ngSwitchCase="'shortanswer'">
-                            <ion-input padding-start [type]="question.input.type" placeholder="{{ 'addon.mod_lesson.youranswer' | translate }}" [id]="question.input.id" [formControlName]="question.input.name" autocorrect="off" [maxlength]="question.input.maxlength">
+                            <ion-input padding-left [type]="question.input.type" placeholder="{{ 'addon.mod_lesson.youranswer' | translate }}" [id]="question.input.id" [formControlName]="question.input.name" autocorrect="off" [maxlength]="question.input.maxlength">
                             </ion-input>
                         </ng-container>
 

src/addon/mod/lesson/pages/player/player.scss

@@ -7,11 +7,6 @@ ion-app.app-root page-addon-mod-lesson-player {
 
     ion-input[padding-left] input[padding-left] {
         // Applying padding-left to the ion-input applies it twice since it's replicated in the inner input.
-        padding-left: 0;
-    }
-
-    ion-input[padding-start] input[padding-start] {
-        // Applying padding-start to the ion-input applies it twice since it's replicated in the inner input.
         @include padding(null, null, null, 0);
     }
 

src/addon/mod/quiz/pages/review/review.html

@@ -88,12 +88,12 @@
 <!-- Arrows to go to next/previous. -->
 <ng-template #navArrows>
     <ion-row align-items-center>
-        <ion-col>
+        <ion-col text-start>
             <a ion-button icon-only color="light" *ngIf="previousPage >= 0" (click)="changePage(previousPage)" [title]="'core.previous' | translate">
                 <ion-icon name="arrow-back" md="ios-arrow-back"></ion-icon>
             </a>
         </ion-col>
-        <ion-col text-right>
+        <ion-col text-end>
             <a ion-button icon-only color="light" *ngIf="nextPage >= -1" (click)="changePage(nextPage)" [title]="'core.next' | translate">
                 <ion-icon name="arrow-forward" md="ios-arrow-forward"></ion-icon>
             </a>

src/addon/mod/wiki/components/index/addon-mod-wiki-index.html

@@ -73,7 +73,7 @@
 
 </core-loading>
 
-<ion-fab bottom right *ngIf="canEdit">
+<ion-fab bottom end *ngIf="canEdit">
     <button ion-fab (click)="goToNewPage()" [attr.aria-label]="'addon.mod_wiki.createpage' | translate">
         <ion-icon name="add"></ion-icon>
     </button>

src/addon/notifications/pages/list/list.html

@@ -20,7 +20,7 @@
                     <img [src]="notification.profileimageurlfrom || 'assets/img/user-avatar.png'" core-external-content [alt]="'core.pictureof' | translate:{$a: notification.userfromfullname}" role="presentation">
                 </ion-avatar>
                 <h2>{{notification.userfromfullname}}</h2>
-                <div item-end *ngIf="!notification.timeread"><ion-icon name="record" color="primary"></ion-icon></div>
+                <div item-end *ngIf="!notification.timeread"><core-icon name="fa-circle" color="primary"></core-icon></div>
                 <p>{{notification.timecreated | coreDateDayOrTime}}</p>
             </ion-item>
             <ion-item text-wrap>

src/addon/qtype/calculated/component/addon-qtype-calculated.html

@@ -18,7 +18,7 @@
 
                 <!-- Input to enter the answer. -->
                 <ion-col>
-                    <ion-input padding-start type="text" placeholder="{{ 'core.question.answer' | translate }}" [attr.name]="question.input.name" [value]="question.input.value" [disabled]="question.input.readOnly" [ngClass]="[question.input.correctClass]" autocorrect="off">
+                    <ion-input padding-left type="text" placeholder="{{ 'core.question.answer' | translate }}" [attr.name]="question.input.name" [value]="question.input.value" [disabled]="question.input.readOnly" [ngClass]="[question.input.correctClass]" autocorrect="off">
                     </ion-input>
                 </ion-col>
 

src/addon/qtype/shortanswer/component/addon-qtype-shortanswer.html

@@ -2,6 +2,6 @@
     <ion-item text-wrap>
         <p><core-format-text [component]="component" [componentId]="componentId" [text]="question.text"></core-format-text></p>
     </ion-item>
-    <ion-input padding-start type="text" placeholder="{{ 'core.question.answer' | translate }}" [attr.name]="question.input.name" [value]="question.input.value" autocorrect="off" [disabled]="question.input.readOnly" [ngClass]="[question.input.correctClass]">
+    <ion-input padding-left type="text" placeholder="{{ 'core.question.answer' | translate }}" [attr.name]="question.input.name" [value]="question.input.value" autocorrect="off" [disabled]="question.input.readOnly" [ngClass]="[question.input.correctClass]">
     </ion-input>
 </section>

src/components/timer/core-timer.html

@@ -1,4 +1,4 @@
-<ion-item #container class="core-timer" [attr.text-center]="align == 'center' ? true : null" [attr.text-right]="align == 'right' ? true : null">
+<ion-item #container class="core-timer" [attr.text-center]="align == 'center' ? true : null" [attr.text-end]="align == 'right' ? true : null">
     <ion-icon name="timer" item-start></ion-icon>
     <label *ngIf="timeLeft > 0 && timerText">{{ timerText }}</label>
     <span *ngIf="timeLeft > 0">{{ timeLeft | coreSecondsToHMS }}</span>

src/core/courses/components/overview-events/core-courses-overview-events.html

@@ -1,11 +1,11 @@
 <ng-template #eventTemplate let-event="event">
-    <a ion-item core-link text-wrap detail-none capture="true" class="core-course-module-handler item-media" [href]="event.url" [title]="event.name" [class.item-badge-right-phone]="event.action && event.action.showitemcount">
+    <a ion-item core-link text-wrap detail-none capture="true" class="core-course-module-handler item-media" [href]="event.url" [title]="event.name">
         <img item-start [src]="event.iconUrl" core-external-content alt="" role="presentation" *ngIf="event.iconUrl" class="core-module-icon">
         <h2><core-format-text [text]="event.name"></core-format-text></h2>
         <p>{{event.timesort * 1000 | coreFormatDate:"dfmediumdate" }} <core-format-text *ngIf="showCourse" [text]="event.course.fullnamedisplay"></core-format-text></p>
         <button ion-button clear item-end class="hidden-phone" (click)="action($event, event.action.url)" [title]="event.action.name" [disabled]="!event.action.actionable" *ngIf="event.action">
             {{event.action.name}}
-            <ion-badge item-end margin-end *ngIf="event.action.showitemcount">{{event.action.itemcount}}</ion-badge>
+            <ion-badge item-end margin-start *ngIf="event.action.showitemcount">{{event.action.itemcount}}</ion-badge>
         </button>
         <ion-badge class="hidden-tablet" item-end *ngIf="event.action.showitemcount">{{event.action.itemcount}}</ion-badge>
     </a>

src/core/emulator/pages/capture-media/capture-media.html

@@ -47,7 +47,7 @@
                 <ion-icon name="trash"></ion-icon>
             </button>
         </ion-col>
-        <ion-col padding text-right class="chrono-container">
+        <ion-col padding text-end class="chrono-container">
             <core-chrono *ngIf="!isImage" [hidden]="hasCaptured" [running]="isCapturing" [reset]="resetChrono" [endTime]="maxTime" (onEnd)="stopCapturing()"></core-chrono>
         </ion-col>
     </ion-row>

src/core/login/pages/sites/sites.html

@@ -24,7 +24,7 @@
             </button>
         </a>
     </ion-list>
-    <ion-fab bottom right>
+    <ion-fab bottom end>
         <button ion-fab (click)="add()" [attr.aria-label]="'core.add' | translate">
             <ion-icon name="add"></ion-icon>
         </button>