Tizen 2.1 base
[platform/framework/web/web-ui-fw.git] / src / themes / tizen / common / jquery.mobile.tizen.colorpalette.less
1 @import "config.less";
2
3 @todons-selected-color: #d9931a;
4 @todons-selected-color-disabled: #999999;
5
6 @colorpalette-choice-total-width:  54px;
7 @colorpalette-choice-total-height: 54px;
8 @colorpalette-item-border-width:  4px;
9 @colorpalette-item-border-color: #c0c0c0;
10 @colorpalette-preview-total-width:  304px;
11 @colorpalette-preview-total-height: 109px;
12
13 @colorpalette-choice-actual-width:  @colorpalette-choice-total-width  - 2 * @colorpalette-item-border-width;
14 @colorpalette-choice-actual-height: @colorpalette-choice-total-height - 2 * @colorpalette-item-border-width;
15 @colorpalette-preview-actual-width:  @colorpalette-preview-total-width  - 2 * @colorpalette-item-border-width;
16 @colorpalette-preview-actual-height: @colorpalette-preview-total-height - 2 * @colorpalette-item-border-width;
17
18 .todons-colorpalette-disabled {
19     .colorpalette-table {
20         .colorpalette-choice-active {
21             border-color: @todons-selected-color-disabled !important;
22         }
23     }
24 }
25
26 .ui-colorpalette {
27   display: table;
28     padding-left:   24px;
29     padding-right:  24px;
30     padding-top:    15px;
31     padding-bottom: 15px;
32
33   .colorpalette-preview-container {
34         padding-top: 48px;
35         padding-bottom: 39px;
36     display: table;
37     margin: auto;
38
39     .colorpalette-preview {
40       display: table;
41       margin: auto;
42       width:  @colorpalette-preview-actual-width;
43       height: @colorpalette-preview-actual-height;
44       border: @colorpalette-item-border-color @colorpalette-item-border-width solid;
45     }
46   }
47
48   .colorpalette-table {
49     .colorpalette-bottom-row {
50       display: table-row;
51     }
52
53     .colorpalette-normal-row {
54       .colorpalette-bottom-row;
55     }
56
57     .colorpalette-choice-container-left {
58       display: table-cell;
59     }
60
61     .colorpalette-choice-container-rest {
62       .colorpalette-choice-container-left;
63             padding-left: 38px;
64     }
65
66     .colorpalette-normal-row .colorpalette-choice-container-left {
67             padding-bottom: 16px;
68     }
69
70     .colorpalette-choice {
71       width:      @colorpalette-choice-actual-width;
72       height:     @colorpalette-choice-actual-width;
73       border-width: @colorpalette-item-border-width;
74       border-style: solid;
75       border-color: @colorpalette-item-border-color;
76     }
77
78     .colorpalette-choice-active {
79             border-color: @todons-selected-color;
80     }
81   }
82 }
83
84 label.colorpickerbutton_label.ui-input-text {
85         display:block !important;
86 }