|
1 .wp-color-picker { |
|
2 width: 80px; |
|
3 } |
|
4 |
|
5 .wp-picker-container .hidden { |
|
6 display: none; |
|
7 } |
|
8 |
|
9 .wp-color-result { |
|
10 background-color: #f9f9f9; |
|
11 border: 1px solid #bbb; |
|
12 border-radius: 2px; |
|
13 cursor: pointer; |
|
14 display: inline-block; |
|
15 height: 22px; |
|
16 margin: 0 6px 6px 0px; |
|
17 position: relative; |
|
18 top: 1px; |
|
19 user-select: none; |
|
20 -moz-user-select: none; |
|
21 -ms-user-select: none; |
|
22 -webkit-user-select: none; |
|
23 vertical-align: bottom; |
|
24 display: inline-block; |
|
25 padding-left: 30px; |
|
26 } |
|
27 |
|
28 .wp-color-result:after { |
|
29 background: #f3f3f3; |
|
30 background-image: -webkit-gradient(linear, left top, left bottom, from(#fefefe), to(#f4f4f4)); |
|
31 background-image: -webkit-linear-gradient(top, #fefefe, #f4f4f4); |
|
32 background-image: -moz-linear-gradient(top, #fefefe, #f4f4f4); |
|
33 background-image: -o-linear-gradient(top, #fefefe, #f4f4f4); |
|
34 background-image: linear-gradient(to bottom, #fefefe, #f4f4f4); |
|
35 color: #333; |
|
36 text-shadow: 0 1px 0 #fff; |
|
37 border-radius: 0 1px 1px 0; |
|
38 border-left: 1px solid #bbb; |
|
39 content: attr( title ); |
|
40 display: block; |
|
41 font-size: 11px; |
|
42 line-height: 22px; |
|
43 padding: 0 6px; |
|
44 position: relative; |
|
45 right: 0; |
|
46 text-align: center; |
|
47 top: 0; |
|
48 } |
|
49 |
|
50 .wp-color-result:hover { |
|
51 border-color: #aaa; |
|
52 -webkit-box-shadow: 0 1px 2px rgba( 0, 0, 0, 0.2 ); |
|
53 box-shadow: 0 1px 1px rgba( 0, 0, 0, 0.1 ); |
|
54 } |
|
55 |
|
56 .wp-color-result:hover:after { |
|
57 color: #222; |
|
58 border-color: #aaa; |
|
59 border-left: 1px solid #999; |
|
60 } |
|
61 |
|
62 .wp-color-result.wp-picker-open { |
|
63 top: 0; |
|
64 } |
|
65 |
|
66 .wp-color-result.wp-picker-open:after { |
|
67 content: attr( data-current ); |
|
68 } |
|
69 |
|
70 .wp-picker-container, .wp-picker-container:active { |
|
71 display: inline-block; |
|
72 outline: 0; |
|
73 } |
|
74 |
|
75 .wp-color-result:focus { |
|
76 border-color: #888; |
|
77 -webkit-box-shadow: 0 1px 2px rgba( 0, 0, 0, 0.2 ); |
|
78 box-shadow: 0 1px 2px rgba( 0, 0, 0, 0.2 ); |
|
79 } |
|
80 |
|
81 .wp-color-result:focus:after { |
|
82 border-color: #888; |
|
83 } |
|
84 |
|
85 .wp-picker-open + .wp-picker-input-wrap { |
|
86 display: inline-block; |
|
87 vertical-align: top; |
|
88 } |
|
89 |
|
90 .wp-picker-container .button { |
|
91 margin-left: 6px; |
|
92 } |
|
93 |
|
94 .wp-picker-container .iris-square-slider .ui-slider-handle:focus { |
|
95 background-color: #555 |
|
96 } |
|
97 |
|
98 .wp-picker-container .iris-picker { |
|
99 border-color: #dfdfdf; |
|
100 margin-top: 6px; |
|
101 } |
|
102 |
|
103 input[type="text"].iris-error { |
|
104 background-color: #ffebe8; |
|
105 border-color: #c00; |
|
106 color: #000; |
|
107 } |