diff --git a/src/app/app.scss b/src/app/app.scss index 01f372357..921809f76 100644 --- a/src/app/app.scss +++ b/src/app/app.scss @@ -200,6 +200,14 @@ ion-datetime { position: relative; } +input { + @include rtl() { + text-align: right; + } +} + + + /** Format Text */ core-format-text[maxHeight], core-format-text[ng-reflect-max-height] { @@ -238,11 +246,10 @@ core-format-text[ng-reflect-max-height] { font-size: 14px; display: block; position: absolute; - bottom: 0; - right: 0; + @include position(null, 0, 0, null); z-index: 1001; background-color: $white; - padding-left: 10px; + @include padding(null, null, null, 10px); } &:before { @@ -308,8 +315,7 @@ audio.core-media-adapt-width { .core-image-viewer-icon { position: absolute; - right: 10px; - bottom: 10px; + @include position(null, 10px, 10px, null); color: $black; border-radius: 5px; background: rgba(255, 255, 255, .5); @@ -348,7 +354,7 @@ core-format-text { } ul, ol { list-style-position: inside; - margin-left: 15px; + @include margin(null, null, null, 15px); } } @@ -411,7 +417,7 @@ ion-col ion-select { .core-button-select { ion-icon:last-child { - margin-left: 5px; + @include margin(null, null, null, 5px); } } @@ -423,8 +429,7 @@ ion-col ion-select { input { position: absolute; - top: 0; - right: 0; + @include position(null, 0, 0, null); min-width: 100%; min-height: 100%; opacity: 0; @@ -490,7 +495,7 @@ ion-col ion-select { } .core-question-feedback-padding { - padding: 8px 35px 8px 14px; + @include padding(8px, 35px, 8px, 14px); } .core-question-correct { @@ -579,13 +584,13 @@ ion-col ion-select { /*rtl:begin:ignore*/ .atto_image_button_left { float: left; - margin: 0 0.5em 0 0; + @include margin(0, 0.5em, 0, 0); max-width: calc(100% - 1em); } .atto_image_button_right { float: right; - margin: 0 0 0 0.5em; + @include margin(0, 0, 0, 0.5em); max-width: calc(100% - 1em); } /*rtl:end:ignore*/ @@ -657,8 +662,7 @@ canvas[core-chart] { ion-icon { color: $color-base; position: absolute; - top: 0; - left: 16px; + @include position(0, null, null, 16px) height: 100%; font-size: 24px; display: flex; @@ -716,8 +720,7 @@ canvas[core-chart] { .core-modal-fullscreen { .modal-wrapper { position: absolute; - top: 0 !important; - left: 0 !important; + @include position(0 !important, null, null, 0 !important); display: block; width: 100% !important; height: 100% !important; @@ -759,9 +762,7 @@ canvas[core-chart] { object, video { position: absolute; - top: 0; - bottom: 0; - left: 0; + @include position(0, null, 0, 0); width: 100%; height: 100%; border: 0; @@ -848,6 +849,7 @@ ion-alert.core-inapp-notification { position: absolute; top: -18px; right: -8px; + @include position(-18px, -8px, null, null); color: red; font-size: 16px; } diff --git a/src/lang/ar.json b/src/lang/ar.json index 56072ec04..d623414c0 100755 --- a/src/lang/ar.json +++ b/src/lang/ar.json @@ -128,6 +128,7 @@ "submit": "سلم", "success": "نجاح", "teachers": "معلمون", + "thisdirection": "rtl", "time": "وقت", "timesup": "انتهى الوقت!", "today": "اليوم", diff --git a/src/lang/en.json b/src/lang/en.json index cbb09a371..e7920978d 100644 --- a/src/lang/en.json +++ b/src/lang/en.json @@ -214,6 +214,7 @@ "tablet": "Tablet", "teachers": "Teachers", "thereisdatatosync": "There are offline {{$a}} to be synchronized.", + "thisdirection": "ltr", "time": "Time", "timesup": "Time is up!", "today": "Today", diff --git a/src/lang/fa.json b/src/lang/fa.json index e99bc1e4b..8a690e389 100755 --- a/src/lang/fa.json +++ b/src/lang/fa.json @@ -125,6 +125,7 @@ "submit": "ثبت", "success": "موفق", "teachers": "استاد", + "thisdirection": "rtl", "time": "زمان", "timesup": "وقت تمام شد!", "today": "امروز", diff --git a/src/lang/he.json b/src/lang/he.json index 39a9d265d..1c4ef0e47 100755 --- a/src/lang/he.json +++ b/src/lang/he.json @@ -146,6 +146,7 @@ "success": "הצלחה", "tablet": "טאבלט", "teachers": "מורים", + "thisdirection": "rtl", "time": "זמן", "timesup": "זמנך נגמר!", "today": "היום", diff --git a/src/providers/lang.ts b/src/providers/lang.ts index 7395957f6..95dffb104 100644 --- a/src/providers/lang.ts +++ b/src/providers/lang.ts @@ -44,6 +44,11 @@ export class CoreLangProvider { moment.locale(language); }); }); + + translate.onLangChange.subscribe((event: any) => { + platform.setLang(event.lang, true); + platform.setDir(this.translate.instant('core.thisdirection'), true); + }); } /** diff --git a/src/theme/variables.scss b/src/theme/variables.scss index 0ec8c8555..c5019ea2c 100644 --- a/src/theme/variables.scss +++ b/src/theme/variables.scss @@ -8,7 +8,7 @@ $font-path: "../assets/fonts"; // The app direction is used to include // rtl styles in your app. For more info, please see: // http://ionicframework.com/docs/theming/rtl-support/ -$app-direction: ltr; +$app-direction: multi; @import "ionic.globals";