bit101/quicksettings

Chrome Color Picker

devalladares opened this issue · 4 comments

Chrome updated their color picker, which seemed to break the gui. Found a solution here:
https://support.google.com/chrome/thread/49563888?hl=en

@devalladares Thanks for the solution!
Any update on whether support for chromes new color picker will be added? If not, this library renders extremely broken for my use :/

I had this issue too, and I found the solution.

The new color picker in chrome follows the <input type="color"> element wherever it goes, in contrast to for example Firefox's color picker which opens in its own separate window. The problem arises because the <input type="color"> is styled to be pushed way off screen so that it cannot be seen, which also takes the new color picker off screen.

This is the styling that causes it:

.qs_color { 
  position: absolute;
  left: -999999px
}

Here is the fix, which hides the input element but still shows the color picker:

.qs_color {
  position: absolute;
  left: 5px; 
  visibility: hidden; 
}

Incredible!!! Thank you so much :))