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

[Feature Request] v-color-picker new prop to hide sliders / show swatches only ? #11138

Closed
laurent-brisbois opened this issue Apr 16, 2020 · 10 comments · Fixed by #12618
Closed
Labels
Milestone

Comments

@laurent-brisbois
Copy link

Problem to solve

In my use case, I'd like to enable the user to only pick a color among a predefined set of colors (aka. swatches) But there is no prop to remove these sliders :
image

Would it be possible to add this feature ?

From now on I did this :

<v-color-picker
  flat
  hide-canvas
  hide-inputs
  show-swatches/>

which result in this :

image

Proposed solution

Add a prop hide-sliders (or whatever the name) so that it can be hidden.

Then it would be possible to have a colorpicker that looks like this (if :swatches is defined of course or it displays the full list) :

image

@ryo-gk
Copy link
Contributor

ryo-gk commented Jul 8, 2020

About design spec,
where is it good to place the color-preview?
I have now 2 ideas, and I want to hear your opinions.

Case1. just hide sliders.
image

Case2. arrange next to mode(rgba, hsla, hexa)
image

@laurent-brisbois
Copy link
Author

@ryo-gk
Is it mandatory to have a color preview ? I mean check the last image of my original post. there is a v and a border on the chosen color in the swatches.

@ryo-gk
Copy link
Contributor

ryo-gk commented Jul 9, 2020

@laurent-brisbois
Thank you for your quick reply.
You mean like below images if hide-sliders is true, is my understand right?
image

@laurent-brisbois
Copy link
Author

@ryo-gk
Yes. And if you hide the rgba too only the swatches remain.

@ryo-gk
Copy link
Contributor

ryo-gk commented Jul 9, 2020

Thanks, I'll take this one.

@tylermmorton
Copy link

Great suggestion, I'll be watching this closely :) Let me know if I can help with the PR

@laurent-brisbois
Copy link
Author

@ryo-gk Are you still on it ? :)

@mattStayner
Copy link

I would like this too, only I would like to just show the swatches and the transparency slider.

@GTaylorRabbit
Copy link

GTaylorRabbit commented Nov 12, 2020

Would love the prop: hide-sliders as well.
I am currently using the disabled prop, as it only seems to disable the sliders of the color picker. The sliders still show, but they are greyed out:
image

@Mikilll94
Copy link
Contributor

It seems that @ryo-gk PR is abondoned. That's why I have created a new PR #12618 with almost the same changes as @ryo-gk did.

@KaelWD KaelWD linked a pull request Nov 17, 2020 that will close this issue
8 tasks
@KaelWD KaelWD added this to the v2.4.0 milestone Nov 17, 2020
KaelWD pushed a commit that referenced this issue Nov 17, 2020
Added the ability to hide sliders in VColorPicker.

resolves #11138
@KaelWD KaelWD closed this as completed Nov 17, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging a pull request may close this issue.

8 participants