Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

reduce gaps between marks #49

Merged
merged 1 commit into from
Nov 23, 2015
Merged

reduce gaps between marks #49

merged 1 commit into from
Nov 23, 2015

Conversation

just-boris
Copy link
Contributor

Now even short enough labels can't fit into one string.

I have this in my app:
screen shot 2015-11-23 at 00 19 46

With my fix, it would be better. Borders are especially have been added to show mark constraints:

screen shot 2015-11-23 at 00 34 56

@benjycui
Copy link
Member

👍

benjycui added a commit that referenced this pull request Nov 23, 2015
style: reduce gaps between marks
@benjycui benjycui merged commit 37d32ae into react-component:master Nov 23, 2015
@benjycui
Copy link
Member

IMO, this is just a temporal patch. It is still a problem in this use case:

image

What we should do is optimize the implementation of Slider.Marks.

@just-boris
Copy link
Contributor Author

Well, this case is more difficult. I see two options here:

  1. Do not rely on marks count, use step value to find the appropriate mark width. For your case the minimal step is 10, so mark width would be 10/(100 - (-10)) * 100 = 9%
  2. Make some more flexible layout, where marks may not be centered, just fill free space on any side near the dot

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

Successfully merging this pull request may close these issues.

None yet

2 participants