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

md-slider: Ripple positioned slightly off and Outer circle background color not set #2427

Closed
epelc opened this issue Apr 20, 2015 · 1 comment
Assignees
Milestone

Comments

@epelc
Copy link
Contributor

epelc commented Apr 20, 2015

It seems that md-slider's ripple is positioned slightly off to the top left.

You can see this on the slider demo if you click on one of the slider lines. It's very fast but I managed to get a screenshot. I tried clicking on the slider in multiple places as I thought the ripple origin had to do with my mouse position but it didn't affect it. I think it should either ripple from the center or from the position of the mouse relative to the sliders dot.
image
Note that right now the ripple never reaches the bottom right corner and it appears to be created slightly off center.

It also seems the spec doesn't mention the outer grey circle seen below when you click and drag.
edit - I think it is supposed to be colored the same as the ripple so it can look like the ripple doesnt go away until you release it. But the background color was never set.
image
Slider spec - http://www.google.com/design/spec/components/sliders.html#

@epelc epelc changed the title md-slider: Ripple positioned slightly off and outer circle not to spec md-slider: Ripple positioned slightly off and Outer circle background color not set Apr 20, 2015
@ThomasBurleson ThomasBurleson added this to the 1.0-beta1 milestone Apr 20, 2015
@naomiblack naomiblack modified the milestones: 1.0-beta1, 0.12.0, 0.11.0 Aug 14, 2015
topherfangio added a commit that referenced this issue Aug 19, 2015
Remove grey focus ring in favor of transparent background ring.

fixes #2427
@topherfangio
Copy link
Contributor

There are a few issues design with the slider that we will need to fix. I can't seem to reproduce (or even see) the ripple issue, but I have fixed the grey circle.

Ideally, the focus ring would only appear on focus, not on click too, but that will require quite a bit of code changes to accomplish, and we wanted to get this CSS fix in to 0.11, so we'll try to fix the other issues before 1.0.

kennethcachia pushed a commit to kennethcachia/material that referenced this issue Sep 23, 2015
Remove grey focus ring in favor of transparent background ring.

fixes angular#2427. closes $4241.
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

4 participants