From 51d530f7b59339675439b70bb90108e66f363191 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Pau=20Ferrer=20Oca=C3=B1a?= <crazyserver@gmail.com>
Date: Fri, 9 Nov 2018 11:25:23 +0100
Subject: [PATCH 1/2] MOBILE-2716 rtl: Fix RTL text alignment

---
 src/addon/qtype/ddmarker/component/ddmarker.scss |  2 +-
 src/app/app.scss                                 | 11 ++++++-----
 src/core/grades/components/course/course.scss    |  2 +-
 3 files changed, 8 insertions(+), 7 deletions(-)

diff --git a/src/addon/qtype/ddmarker/component/ddmarker.scss b/src/addon/qtype/ddmarker/component/ddmarker.scss
index 7502a91a6..7e716c470 100644
--- a/src/addon/qtype/ddmarker/component/ddmarker.scss
+++ b/src/addon/qtype/ddmarker/component/ddmarker.scss
@@ -45,7 +45,7 @@ addon-qtype-ddmarker {
     div.ddarea .markertexts {
         min-height: 80px;
         position: absolute;
-        text-align: left;
+        @include text-align('start');
     }
     .dropbackground {
         margin: 0 auto;
diff --git a/src/app/app.scss b/src/app/app.scss
index 145f1165f..9087be361 100644
--- a/src/app/app.scss
+++ b/src/app/app.scss
@@ -205,6 +205,7 @@ ion-app.app-root {
   }
 
   input {
+    @include text-align('end');
     @include rtl() {
       text-align: right;
     }
@@ -248,7 +249,7 @@ ion-app.app-root {
 
         .core-show-more {
           color: color($colors, dark);
-          text-align: right;
+          @include text-align('end');
           font-size: 14px;
           display: block;
           position: absolute;
@@ -423,7 +424,7 @@ ion-app.app-root {
       width: 100%;
       .select-text {
         white-space: normal;
-        text-align: right;
+        @include text-align('end');
       }
   }
 
@@ -481,7 +482,7 @@ ion-app.app-root {
 
     ion-icon:last-child {
       @include margin(null, null, null, 5px);
-      text-align: right;
+      @include text-align('end');
       flex-grow: 2;
     }
   }
@@ -891,7 +892,7 @@ ion-app.app-root {
 
     .alert-head {
       padding: 5px 10px;
-      text-align: left;
+      @include text-align('start');
       h2 {
         font-size: 14px;
       }
@@ -899,7 +900,7 @@ ion-app.app-root {
 
     .alert-message {
       padding: 5px 10px;
-      text-align: left;
+      @include text-align('start');
       p {
         font-size: 14px;
         margin-top: 5px;
diff --git a/src/core/grades/components/course/course.scss b/src/core/grades/components/course/course.scss
index 2b8ea0be2..8c0ee2091 100644
--- a/src/core/grades/components/course/course.scss
+++ b/src/core/grades/components/course/course.scss
@@ -13,7 +13,7 @@ ion-app.app-root core-grades-course {
       @include padding(10px, 10px, 10px, null);
       vertical-align: top;
       white-space: normal;
-      text-align: left;
+      @include text-align('start');
     }
     thead th {
       vertical-align: bottom;

From c584b9ae1367efceb9a4544907336bfbb597b8d2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Pau=20Ferrer=20Oca=C3=B1a?= <crazyserver@gmail.com>
Date: Fri, 9 Nov 2018 11:28:01 +0100
Subject: [PATCH 2/2] MOBILE-2716 course: Fix section selector lenght

---
 src/app/app.scss                                          | 1 +
 src/core/course/components/format/core-course-format.html | 4 ++--
 src/core/course/components/format/format.scss             | 7 +++++++
 3 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/src/app/app.scss b/src/app/app.scss
index 9087be361..48cb44c71 100644
--- a/src/app/app.scss
+++ b/src/app/app.scss
@@ -449,6 +449,7 @@ ion-app.app-root {
     white-space: normal;
     align-self: start;
     max-width: none;
+    @include text-align('start');
 
     &.select-md,
     &.button-md {
diff --git a/src/core/course/components/format/core-course-format.html b/src/core/course/components/format/core-course-format.html
index de9a9ad44..8ecd177d8 100644
--- a/src/core/course/components/format/core-course-format.html
+++ b/src/core/course/components/format/core-course-format.html
@@ -20,9 +20,9 @@
         <!-- Section selector. -->
         <core-dynamic-component [component]="sectionSelectorComponent" [data]="data">
             <div text-wrap *ngIf="displaySectionSelector && sections && sections.length" padding class="clearfix" ion-row justify-content-between>
-                <button float-start ion-button icon-start (click)="showSectionSelector($event)" color="light" class="core-button-select button-no-uppercase" ion-col>
+                <button float-start ion-button icon-start icon-end (click)="showSectionSelector($event)" color="light" class="core-button-select button-no-uppercase" ion-col>
                     <core-icon name="fa-folder"></core-icon>
-                    {{selectedSection && (selectedSection.formattedName || selectedSection.name) || 'core.course.sections' | translate }}
+                    <span class="core-section-selector-text">{{selectedSection && (selectedSection.formattedName || selectedSection.name) || 'core.course.sections' | translate }}</span>
                     <ion-icon name="arrow-dropdown" ios="md-arrow-dropdown"></ion-icon>
                 </button>
                 <!-- Section download. -->
diff --git a/src/core/course/components/format/format.scss b/src/core/course/components/format/format.scss
index 16737be20..3639d394c 100644
--- a/src/core/course/components/format/format.scss
+++ b/src/core/course/components/format/format.scss
@@ -6,6 +6,13 @@ ion-app.app-root ion-badge.core-course-download-section-progress {
 
 ion-app.app-root core-course-format {
 
+    button.core-button-select .core-section-selector-text {
+        overflow: hidden;
+        text-overflow: ellipsis;
+        line-height: 2em;
+        white-space: nowrap;
+    }
+
     .core-format-progress-list {
         margin-bottom: 0;