1 |
|
2 | div.vis-color-picker {
|
3 | position:absolute;
|
4 | top: 0px;
|
5 | left: 30px;
|
6 | margin-top:-140px;
|
7 | margin-left:30px;
|
8 | width:310px;
|
9 | height:444px;
|
10 | z-index: 1;
|
11 | padding: 10px;
|
12 | border-radius:15px;
|
13 | background-color:#ffffff;
|
14 | display: none;
|
15 | box-shadow: rgba(0,0,0,0.5) 0px 0px 10px 0px;
|
16 | }
|
17 |
|
18 | div.vis-color-picker div.vis-arrow {
|
19 | position: absolute;
|
20 | top:147px;
|
21 | left:5px;
|
22 | }
|
23 |
|
24 | div.vis-color-picker div.vis-arrow::after,
|
25 | div.vis-color-picker div.vis-arrow::before {
|
26 | right: 100%;
|
27 | top: 50%;
|
28 | border: solid transparent;
|
29 | content: " ";
|
30 | height: 0;
|
31 | width: 0;
|
32 | position: absolute;
|
33 | pointer-events: none;
|
34 | }
|
35 |
|
36 | div.vis-color-picker div.vis-arrow:after {
|
37 | border-color: rgba(255, 255, 255, 0);
|
38 | border-right-color: #ffffff;
|
39 | border-width: 30px;
|
40 | margin-top: -30px;
|
41 | }
|
42 |
|
43 | div.vis-color-picker div.vis-color {
|
44 | position:absolute;
|
45 | width: 289px;
|
46 | height: 289px;
|
47 | cursor: pointer;
|
48 | }
|
49 |
|
50 |
|
51 |
|
52 | div.vis-color-picker div.vis-brightness {
|
53 | position: absolute;
|
54 | top:313px;
|
55 | }
|
56 |
|
57 | div.vis-color-picker div.vis-opacity {
|
58 | position:absolute;
|
59 | top:350px;
|
60 | }
|
61 |
|
62 | div.vis-color-picker div.vis-selector {
|
63 | position:absolute;
|
64 | top:137px;
|
65 | left:137px;
|
66 | width:15px;
|
67 | height:15px;
|
68 | border-radius:15px;
|
69 | border:1px solid #ffffff;
|
70 | background: #4c4c4c;
|
71 | background: -moz-linear-gradient(top, #4c4c4c 0%, #595959 12%, #666666 25%, #474747 39%, #2c2c2c 50%, #000000 51%, #111111 60%, #2b2b2b 76%, #1c1c1c 91%, #131313 100%);
|
72 | background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4c4c4c), color-stop(12%,#595959), color-stop(25%,#666666), color-stop(39%,#474747), color-stop(50%,#2c2c2c), color-stop(51%,#000000), color-stop(60%,#111111), color-stop(76%,#2b2b2b), color-stop(91%,#1c1c1c), color-stop(100%,#131313));
|
73 | background: -webkit-linear-gradient(top, #4c4c4c 0%,#595959 12%,#666666 25%,#474747 39%,#2c2c2c 50%,#000000 51%,#111111 60%,#2b2b2b 76%,#1c1c1c 91%,#131313 100%);
|
74 | background: -o-linear-gradient(top, #4c4c4c 0%,#595959 12%,#666666 25%,#474747 39%,#2c2c2c 50%,#000000 51%,#111111 60%,#2b2b2b 76%,#1c1c1c 91%,#131313 100%);
|
75 | background: -ms-linear-gradient(top, #4c4c4c 0%,#595959 12%,#666666 25%,#474747 39%,#2c2c2c 50%,#000000 51%,#111111 60%,#2b2b2b 76%,#1c1c1c 91%,#131313 100%);
|
76 | background: linear-gradient(to bottom, #4c4c4c 0%,#595959 12%,#666666 25%,#474747 39%,#2c2c2c 50%,#000000 51%,#111111 60%,#2b2b2b 76%,#1c1c1c 91%,#131313 100%);
|
77 | filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4c4c4c', endColorstr='#131313',GradientType=0 );
|
78 | }
|
79 |
|
80 |
|
81 |
|
82 | div.vis-color-picker div.vis-new-color {
|
83 | position:absolute;
|
84 | width:140px;
|
85 | height:20px;
|
86 | border:1px solid rgba(0,0,0,0.1);
|
87 | border-radius:5px;
|
88 | top:380px;
|
89 | left:159px;
|
90 | text-align:right;
|
91 | padding-right:2px;
|
92 | font-size:10px;
|
93 | color:rgba(0,0,0,0.4);
|
94 | vertical-align:middle;
|
95 | line-height:20px;
|
96 |
|
97 | }
|
98 |
|
99 | div.vis-color-picker div.vis-initial-color {
|
100 | position:absolute;
|
101 | width:140px;
|
102 | height:20px;
|
103 | border:1px solid rgba(0,0,0,0.1);
|
104 | border-radius:5px;
|
105 | top:380px;
|
106 | left:10px;
|
107 | text-align:left;
|
108 | padding-left:2px;
|
109 | font-size:10px;
|
110 | color:rgba(0,0,0,0.4);
|
111 | vertical-align:middle;
|
112 | line-height:20px;
|
113 | }
|
114 |
|
115 | div.vis-color-picker div.vis-label {
|
116 | position:absolute;
|
117 | width:300px;
|
118 | left:10px;
|
119 | }
|
120 |
|
121 | div.vis-color-picker div.vis-label.vis-brightness {
|
122 | top:300px;
|
123 | }
|
124 |
|
125 | div.vis-color-picker div.vis-label.vis-opacity {
|
126 | top:338px;
|
127 | }
|
128 |
|
129 | div.vis-color-picker div.vis-button {
|
130 | position:absolute;
|
131 | width:68px;
|
132 | height:25px;
|
133 | border-radius:10px;
|
134 | vertical-align: middle;
|
135 | text-align:center;
|
136 | line-height: 25px;
|
137 | top:410px;
|
138 | border:2px solid #d9d9d9;
|
139 | background-color: #f7f7f7;
|
140 | cursor:pointer;
|
141 | }
|
142 |
|
143 | div.vis-color-picker div.vis-button.vis-cancel {
|
144 |
|
145 |
|
146 | left:5px;
|
147 | }
|
148 | div.vis-color-picker div.vis-button.vis-load {
|
149 |
|
150 |
|
151 | left:82px;
|
152 | }
|
153 | div.vis-color-picker div.vis-button.vis-apply {
|
154 |
|
155 |
|
156 | left:159px;
|
157 | }
|
158 | div.vis-color-picker div.vis-button.vis-save {
|
159 |
|
160 |
|
161 | left:236px;
|
162 | }
|
163 |
|
164 |
|
165 | div.vis-color-picker input.vis-range {
|
166 | width: 290px;
|
167 | height:20px;
|
168 | }
|
169 |
|
170 |
|
171 |
|
172 |
|
173 |
|
174 |
|
175 |
|
176 |
|
177 |
|
178 |
|
\ | No newline at end of file |