javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-18 19:21:34 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(range): improved rtl support (#17479)

Browse Source 
* fix(Range): rtl support

* fix(Range): knob position in rtl
This commit is contained in:
Bengt Weiße
2019-02-13 14:17:42 +01:00
committed by Liam DeBeasi
parent 15acb4be37
commit f832de5f4a
1 changed files with 12 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
core/src/components/range/range.tsx
View File

@ -384,25 +384,27 @@ export class Range implements ComponentInterface {
const { min, max, neutralPoint, ratioLower, ratioUpper } = this;
const neutralPointRatio = valueToRatio(neutralPoint, min, max);
const isRTL = document.dir === 'rtl';
const start = isRTL ? 'right' : 'left';
const end = isRTL ? 'left' : 'right';
const style: any = {};
// dual knob handling
let left = `${ratioLower * 100}%`;
let right = `${100 - ratioUpper * 100}%`;
style[start] = `${ratioLower * 100}%`;
style[end] = `${100 - ratioUpper * 100}%`;
// single knob handling
if (!this.dualKnobs) {
if (this.ratioA < neutralPointRatio) {
right = `${neutralPointRatio * 100}%`;
left = `${this.ratioA * 100}%`;
style[end] = `${neutralPointRatio * 100}%`;
style[start] = `${this.ratioA * 100}%`;
} else {
right = `${100 - this.ratioA * 100}%`;
left = `${neutralPointRatio * 100}%`;
style[end] = `${100 - this.ratioA * 100}%`;
style[start] = `${neutralPointRatio * 100}%`;
}
}
return {
left,
right
};
return style;
}
protected isTickActive(stepRatio: number) {
@ -537,7 +539,6 @@ function renderKnob({ knob, value, ratio, min, max, neutralPoint, disabled, pres
const knobStyle = () => {
const style: any = {};
style[start] = `${ratio * 100}%`;
return style;