Lea/web-apps
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

Square

Browse source
This commit is contained in:
OVSharova 2021-09-23 00:30:13 +03:00
parent c45f519ca4
commit 8629cf2ad5
2 changed files with 19 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
apps/common/main/lib/component/HSBColorPicker.js
View file

@ -55,7 +55,8 @@ define([
'<% } %>'+ '<% } %>'+
'<div>'+ '<div>'+
'<div class="cnt-hb img-colorpicker">'+ '<div class="cnt-hb img-colorpicker">'+
'<div class="cnt-hb-arrow img-colorpicker"></div>'+ //'<div class="cnt-hb-arrow img-colorpicker"></div>'+
'<div class="cnt-hb-arrow"></div>'+
'</div>'+ '</div>'+
'<% if (this.changeSaturation) { %>'+ '<% if (this.changeSaturation) { %>'+
'<div class="cnt-root">'+ '<div class="cnt-root">'+
@ -106,6 +107,7 @@ define([
refreshUI(); refreshUI();
me.trigger('changecolor', me, me.color); me.trigger('changecolor', me, me.color);
}; };
var refreshUI = function(){ var refreshUI = function(){
@ -128,6 +130,7 @@ define([
arrowSatBrightness.css('left', saturationVal + '%'); arrowSatBrightness.css('left', saturationVal + '%');
arrowSatBrightness.css('top', 100 - brightnessVal + '%'); arrowSatBrightness.css('top', 100 - brightnessVal + '%');
arrowHue.css('top', parseInt(hueVal * 100 / 360.0) + '%'); arrowHue.css('top', parseInt(hueVal * 100 / 360.0) + '%');
arrowSatBrightness.css({'background-color' : me.color});
} }
}; };

18
apps/common/main/resources/less/hsb-colorpicker.less
View file

@ -32,7 +32,7 @@
.cnt-hb { .cnt-hb {
display: inline-block; display: inline-block;
overflow: hidden; //overflow: hidden;
width: 196px; width: 196px;
height: 196px; height: 196px;
position: relative; position: relative;
@ -54,12 +54,24 @@
} }
.cnt-hb-arrow { .cnt-hb-arrow {
display: inline-block;
width: 12px; width: 12px;
height: 12px; height: 12px;
margin: -6px; margin: -6px;
margin-left: calc(-6*@scaled-one-px-value);
position: absolute; position: absolute;
background-position: 0 -196px; border: @scaled-one-px-value-ie solid #000;
border: @scaled-one-px-value solid #000;
&:after{
content: ' ';
position: absolute;
width: 100%;
height: 100%;
border: @scaled-one-px-value-ie solid #fff;
border: @scaled-one-px-value solid #fff;
}
// background-position: 0 -196px;
} }
.cnt-sat-arrow { .cnt-sat-arrow {