Fix color picker sometimes not visible

This commit is contained in:
Paulus Schoutsen 2016-02-21 20:16:00 -08:00
parent 4a85f5fa63
commit eab7940b4d
2 changed files with 33 additions and 38 deletions

View File

@ -96,8 +96,10 @@ export default new Polymer({
this.mouseMoveIsThrottled = true;
this.canvas = this.children[0];
this.context = this.canvas.getContext('2d');
this.drawGradient();
},
this.debounce('drawGradient', () => {
drawGradient() {
let style;
if (!this.width || !this.height) {
style = getComputedStyle(this);
@ -124,7 +126,5 @@ export default new Polymer({
this.context.fillStyle = bwGradient;
this.context.fillRect(0, 0, width, height);
}, 100);
},
});

View File

@ -6,8 +6,6 @@
<dom-module id='more-info-light'>
<style>
.brightness, .color_temp {
margin-bottom: 8px;
max-height: 0px;
overflow: hidden;
transition: max-height .5s ease-in;
@ -15,20 +13,17 @@
ha-color-picker {
display: block;
max-width: 350px;
height: 200px;
margin: 0 auto;
width: 250px;
max-height: 0px;
overflow: hidden;
transition: max-height .2s ease-in;
}
.has-brightness .brightness {
max-height: 40px;
}
.has-brightness .brightness,
.has-color_temp .color_temp {
margin-bottom: 8px;
max-height: 40px;
}
@ -53,7 +48,7 @@
</paper-slider>
</div>
<ha-color-picker on-colorselected='colorPicked' height='200'>
<ha-color-picker on-colorselected='colorPicked' height='200' width='250'>
</ha-color-picker>
</div>
</template>