search

enonic / xp

Enonic XP
https://enonic.com
GNU General Public License v3.0
202 stars 34 forks source link

Input type: color picker #5182

Open Bellfalasch opened 7 years ago

Bellfalasch commented 7 years ago

This could easily be stamped with "wait for custom input type and then implement yourself". But this is really something useful (almost all 10+ apps I've built so far), let users control colors using TextLine for inserting hex-values that I later use in code ... not user friendly).

A XP "best-practise" implementation of a color picker (with a color wheel and hex editor as a complement) would be a rather quick implementation using existing front end libraries, and also something a lot of developers would find useful. It will give instant gaines in UX for anyone using Content Studio.

Having each dev implements this themselves when custom input types comes means users will have to wait loooong, they will have different implementations for the same feature (which most CMS has already anyway).

<input type="color" />

Lets set the standard for how a color picker should be in XP, and later with custom input types devs needing something more/different can just brew their own instead.

Two examples on how Wordpress does it. Most other CMSes does something similar.

screen shot 2017-06-23 at 10 24 10

screen shot 2017-06-23 at 10 24 18

Example of one client installation forced into TextLine instead of a proper color selector. screen shot 2017-06-27 at 12 48 54

RF0 commented 7 years ago

It should also support selecting Color from a limited palette. Many web pages have company styleguide that should be followed

aro commented 7 years ago

For a limited palette you can use a CustomSelector. We have a nice example in the Features module, it shows the colors in the dropdown using an SVG icon:

https://github.com/enonic/app-features/blob/master/src/main/resources/services/colorPicker/colorPicker.js

Bellfalasch commented 7 years ago

I'm gonna go with ARO there, a XP implementation should do it full style. Perhaps later down the line you could add some settings, but not important at this stage especially since you have that beautiful custom selector solution.