3 @hsvpicker-clrchannel-masks-width: 300 * @unit_base;
4 @hsvpicker-clrchannel-masks-height: 38 * @unit_base;
5 @hsvpicker-clrchannel-selector-width: 10 * @unit_base;
6 @hsvpicker-clrchannel-selector-height: 50 * @unit_base;
7 @hsvpicker-clrchannel-selector-border-width: 5 * @unit_base;
8 @hsvpicker-clrchannel-masks-container-hpadding: 12 * @unit_base;
9 @hsvpicker-clrchannel-masks-container-vpadding: 16 * @unit_base;
11 @hsvpicker-clrchannel-selector-actual-height: @hsvpicker-clrchannel-selector-height -
12 2 * @hsvpicker-clrchannel-selector-border-width;
14 @hsvpicker-clrchannel-masks-container-actual-hpadding:
15 @hsvpicker-clrchannel-selector-width / 2
16 + @hsvpicker-clrchannel-selector-border-width;
17 @hsvpicker-clrchannel-masks-container-actual-vpadding:
18 (@hsvpicker-clrchannel-selector-actual-height - @hsvpicker-clrchannel-masks-height) / 2
19 + @hsvpicker-clrchannel-selector-border-width;
20 @hsvpicker-clrchannel-masks-container-hmargin:
22 (parseInt("@{hsvpicker-clrchannel-masks-container-hpadding}") -
23 parseInt("@{hsvpicker-clrchannel-masks-container-actual-hpadding}"))) + "px"`;
24 @hsvpicker-clrchannel-masks-container-vmargin:
26 (parseInt("@{hsvpicker-clrchannel-masks-container-vpadding}") -
27 parseInt("@{hsvpicker-clrchannel-masks-container-actual-vpadding}"))) + "px"`;
30 .hsvpicker-clrchannel-container {
32 padding-left: 27 * @unit_base;
33 padding-right: 27 * @unit_base;
35 .hsvpicker-arrow-btn-container {
37 vertical-align: middle;
40 .hsvpicker-arrow-btn {
44 .hsvpicker-clrchannel-masks-container {
47 width: @hsvpicker-clrchannel-masks-width;
48 height: @hsvpicker-clrchannel-masks-height;
50 margin-left: @hsvpicker-clrchannel-masks-container-hmargin;
51 margin-right: @hsvpicker-clrchannel-masks-container-hmargin;
52 margin-top: @hsvpicker-clrchannel-masks-container-vmargin;
53 margin-bottom: @hsvpicker-clrchannel-masks-container-vmargin;
55 padding-left: @hsvpicker-clrchannel-masks-container-actual-hpadding;
56 padding-right: @hsvpicker-clrchannel-masks-container-actual-hpadding;
57 padding-top: @hsvpicker-clrchannel-masks-container-actual-vpadding;
58 padding-bottom: @hsvpicker-clrchannel-masks-container-actual-vpadding;
60 .hsvpicker-clrchannel-mask {
62 width: @hsvpicker-clrchannel-masks-width;
63 height: @hsvpicker-clrchannel-masks-height;
66 .hsvpicker-clrchannel-mask-black {
70 .hsvpicker-clrchannel-mask-white {
74 .hsvpicker-clrchannel-selector {
78 width: @hsvpicker-clrchannel-selector-width;
79 height: @hsvpicker-clrchannel-selector-actual-height;
80 border: @hsvpicker-clrchannel-selector-border-width solid black;
86 .ui-popupwindow .colorpickerbutton-popup-container-style {