1/*! This file is auto-generated */
2/* rtl:ignore */
3.wp-color-picker {
4 width: 80px;
5 direction: ltr;
6}
7
8.wp-picker-container .hidden {
9 display: none;
10}
11
12/* Needs higher specificity to override `.wp-core-ui .button`. */
13.wp-picker-container .wp-color-result.button {
14 min-height: 30px;
15 margin: 0 0 6px 6px;
16 padding: 0 30px 0 0;
17 font-size: 11px;
18}
19
20.wp-color-result-text {
21 background: #f6f7f7;
22 border-radius: 2px 0 0 2px;
23 border-right: 1px solid #c3c4c7;
24 color: #50575e;
25 display: block;
26 line-height: 2.54545455; /* 28px */
27 padding: 0 6px;
28 text-align: center;
29}
30
31.wp-color-result:hover,
32.wp-color-result:focus {
33 background: #f6f7f7;
34 border-color: #8c8f94;
35 color: #1d2327;
36}
37
38.wp-color-result:hover:after,
39.wp-color-result:focus:after {
40 color: #1d2327;
41 border-color: #a7aaad;
42 border-right: 1px solid #8c8f94;
43}
44
45.wp-picker-container {
46 display: inline-block;
47}
48
49.wp-color-result:focus {
50 border-color: #4f94d4;
51 box-shadow: 0 0 3px rgba(34, 113, 177, 0.8);
52}
53
54.wp-color-result:active {
55 /* See Trac ticket #39662 */
56 transform: none !important;
57}
58
59.wp-picker-open + .wp-picker-input-wrap {
60 display: inline-block;
61 vertical-align: top;
62}
63
64.wp-picker-input-wrap label {
65 display: inline-block;
66 vertical-align: top;
67}
68
69/* For the old `custom-background` page, to override the inline-block and margins from `.form-table td fieldset label`. */
70.form-table .wp-picker-input-wrap label {
71 margin: 0 !important;
72}
73
74.wp-picker-input-wrap .button.wp-picker-default,
75.wp-picker-input-wrap .button.wp-picker-clear,
76.wp-customizer .wp-picker-input-wrap .button.wp-picker-default,
77.wp-customizer .wp-picker-input-wrap .button.wp-picker-clear {
78 margin-right: 6px;
79 padding: 0 8px;
80 line-height: 2.54545455; /* 28px */
81 min-height: 30px;
82}
83
84.wp-picker-container .iris-square-slider .ui-slider-handle:focus {
85 background-color: #50575e
86}
87
88.wp-picker-container .iris-picker {
89 border-radius: 0;
90 border-color: #dcdcde;
91 margin-top: 6px;
92}
93
94.wp-picker-container input[type="text"].wp-color-picker {
95 width: 4rem;
96 font-size: 12px;
97 font-family: monospace;
98 line-height: 2.33333333; /* 28px */
99 margin: 0;
100 padding: 0 5px;
101 vertical-align: top;
102 min-height: 30px;
103}
104
105.wp-color-picker::-webkit-input-placeholder {
106 color: #646970;
107}
108
109.wp-color-picker::-moz-placeholder {
110 color: #646970;
111}
112
113.wp-picker-container input[type="text"].iris-error {
114 background-color: #fcf0f1;
115 border-color: #d63638;
116 color: #000;
117}
118
119.iris-picker .ui-square-handle:focus,
120.iris-picker .iris-strip .ui-slider-handle:focus {
121 border-color: #3582c4;
122 border-style: solid;
123 box-shadow: 0 0 0 1px #3582c4;
124 outline: 2px solid transparent;
125}
126
127.iris-picker .iris-palette:focus {
128 box-shadow: 0 0 0 2px #3582c4;
129}
130
131@media screen and (max-width: 782px) {
132 .wp-picker-container input[type="text"].wp-color-picker {
133 width: 5rem;
134 font-size: 16px;
135 line-height: 1.875; /* 30px */
136 min-height: 32px;
137 }
138
139 .wp-customizer .wp-picker-container input[type="text"].wp-color-picker {
140 padding: 0 5px;
141 }
142
143 .wp-picker-input-wrap .button.wp-picker-default,
144 .wp-picker-input-wrap .button.wp-picker-clear {
145 padding: 0 8px;
146 line-height: 2.14285714; /* 30px */
147 min-height: 32px;
148 }
149
150 .wp-customizer .wp-picker-input-wrap .button.wp-picker-default,
151 .wp-customizer .wp-picker-input-wrap .button.wp-picker-clear {
152 padding: 0 8px;
153 font-size: 14px;
154 line-height: 2.14285714; /* 30px */
155 min-height: 32px;
156 }
157
158 .wp-picker-container .wp-color-result.button {
159 padding: 0 40px 0 0;
160 font-size: 14px;
161 line-height: 2.14285714; /* 30px */
162 }
163
164 .wp-customizer .wp-picker-container .wp-color-result.button {
165 font-size: 14px;
166 line-height: 2.14285714; /* 30px */
167 }
168
169 .wp-picker-container .wp-color-result-text {
170 padding: 0 14px;
171 font-size: inherit;
172 line-height: inherit;
173 }
174
175 .wp-customizer .wp-picker-container .wp-color-result-text {
176 padding: 0 10px;
177 }
178}
179