Skip to content
This repository has been archived by the owner on Dec 19, 2024. It is now read-only.

paper-slider only respects [dir=rtl] but not direction: ltr; in CSS nor nested [dir] #190

Open
8 tasks done
danbeam opened this issue May 16, 2017 · 3 comments
Open
8 tasks done
Assignees

Comments

@danbeam
Copy link
Contributor

danbeam commented May 16, 2017

Description

paper-slider added RTL support via :host-context([dir="rtl"]) in #181

This is super, except there are a few ways of changing text direction that it doesn't detect.

For example:

paper-slider {
  direction: rtl;
}

or

<html dir="rtl">
<paper-slider dir="ltr">

Expected outcome

Slider's direction and effective text direction agree.

Actual outcome

In some cases, the slider direction differs from the text direction.

Live Demo

https://jsfiddle.net/7qxd7cjx/

Steps to reproduce

  1. plop <paper-slider style="direction: rtl;"> or <div dir=rtl><paper-slider dir=ltr> onto a page
  2. slide the knob

Browsers Affected

  • Chrome
  • Firefox
  • Safari 9
  • Safari 8
  • Safari 7
  • Edge
  • IE 11
  • IE 10

(Note: I assume this applies to all browsers but haven't actually checked).

/cc @dschuyler @keanulee

@takumif
Copy link

takumif commented Jun 27, 2017

Am I right to assume that @danbeam will no longer be working on this bug? In that case, could someone else take over?
I want to force the sliders to be LTR in the Cast dialog WebUI in Chromium, and can do so with a local CSS workaround like the one below, but I'd be happier if such a workaround wasn't necessary.

:host-context([dir="rtl"]) paper-slider[dir="ltr"] {
  -webkit-transform: scaleX(-1);
  transform: scaleX(-1);
}

@keanulee
Copy link
Contributor

@takumif I added a new CSS rule to paper-slider that should help you with that issue - specifically as long as you have dir="ltr" on paper-slider it should override the other rule.

@takumif
Copy link

takumif commented Jun 27, 2017

Great, thank you!

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests

3 participants