1 /* Styles for the media library iframe (not used on the Library screen) */ |
1 /*------------------------------------------------------------------------------ |
2 |
2 14.0 - Media Screen |
3 div#media-upload-header { |
3 ------------------------------------------------------------------------------*/ |
4 margin: 0; |
4 |
5 padding: 5px 5px 0; |
5 .media-item .describe { |
6 font-weight: bold; |
6 border-collapse: collapse; |
7 position: relative; |
|
8 border-bottom-width: 1px; |
|
9 border-bottom-style: solid; |
|
10 } |
|
11 |
|
12 body#media-upload ul#sidemenu { |
|
13 font-weight: normal; |
|
14 margin: 0 5px; |
|
15 left: 0; |
|
16 bottom: -1px; |
|
17 float: none; |
|
18 overflow: hidden; |
|
19 } |
|
20 |
|
21 form { |
|
22 margin: 1em; |
|
23 } |
|
24 |
|
25 #search-filter { |
|
26 text-align: right; |
|
27 } |
|
28 |
|
29 th { |
|
30 position: relative; |
|
31 } |
|
32 |
|
33 .media-upload-form label.form-help, td.help { |
|
34 font-family: sans-serif; |
|
35 font-style: italic; |
|
36 font-weight: normal; |
|
37 } |
|
38 |
|
39 .media-upload-form p.help { |
|
40 margin: 0; |
|
41 padding: 0; |
|
42 } |
|
43 |
|
44 .media-upload-form fieldset { |
|
45 width: 100%; |
7 width: 100%; |
46 border: none; |
8 border-top: 1px solid #dfdfdf; |
47 text-align: justify; |
|
48 margin: 0 0 1em 0; |
|
49 padding: 0; |
|
50 } |
|
51 |
|
52 /* specific to the image upload form */ |
|
53 |
|
54 .image-align-none-label { |
|
55 background: url(../images/align-none.png) no-repeat center left; |
|
56 } |
|
57 |
|
58 .image-align-left-label { |
|
59 background: url(../images/align-left.png) no-repeat center left; |
|
60 } |
|
61 |
|
62 .image-align-center-label { |
|
63 background: url(../images/align-center.png) no-repeat center left; |
|
64 } |
|
65 |
|
66 .image-align-right-label { |
|
67 background: url(../images/align-right.png) no-repeat center left; |
|
68 } |
|
69 |
|
70 tr.image-size td { |
|
71 width: 460px; |
|
72 } |
|
73 |
|
74 tr.image-size div.image-size-item { |
|
75 margin: 0 0 5px; |
|
76 } |
|
77 |
|
78 #library-form .progress, |
|
79 #gallery-form .progress, |
|
80 .insert-gallery, |
|
81 .describe.startopen, |
|
82 .describe.startclosed { |
|
83 display: none; |
|
84 } |
|
85 |
|
86 .media-item .thumbnail { |
|
87 max-width: 128px; |
|
88 max-height: 128px; |
|
89 } |
|
90 |
|
91 thead.media-item-info tr { |
|
92 background-color: transparent; |
|
93 } |
|
94 |
|
95 .form-table thead.media-item-info { |
|
96 border: 8px solid #fff; |
|
97 } |
|
98 |
|
99 abbr.required { |
|
100 text-decoration: none; |
|
101 border: none; |
|
102 } |
|
103 |
|
104 .describe label { |
|
105 display: inline; |
|
106 } |
|
107 |
|
108 .describe td.error { |
|
109 padding: 2px 8px; |
|
110 } |
|
111 |
|
112 .describe td.A1 { |
|
113 width: 132px; |
|
114 } |
|
115 |
|
116 .describe input[type="text"], |
|
117 .describe textarea { |
|
118 width: 460px; |
|
119 border-width: 1px; |
|
120 border-style: solid; |
|
121 } |
|
122 |
|
123 /* Specific to Uploader */ |
|
124 |
|
125 #media-upload p.ml-submit { |
|
126 padding: 1em 0; |
|
127 } |
|
128 |
|
129 #media-upload p.help, |
|
130 #media-upload label.help { |
|
131 font-family: sans-serif; |
|
132 font-style: italic; |
|
133 font-weight: normal; |
|
134 } |
|
135 |
|
136 #media-upload .ui-sortable .media-item { |
|
137 cursor: move; |
|
138 } |
|
139 |
|
140 #media-upload tr.image-size { |
|
141 margin-bottom: 1em; |
|
142 height: 3em; |
|
143 } |
|
144 |
|
145 #media-upload #filter { |
|
146 width: 623px; |
|
147 } |
|
148 |
|
149 #media-upload #filter .subsubsub { |
|
150 margin: 8px 0; |
|
151 } |
|
152 |
|
153 #filter .tablenav select { |
|
154 border-style: solid; |
|
155 border-width: 1px; |
|
156 padding: 2px; |
|
157 vertical-align: top; |
|
158 width: auto; |
|
159 } |
|
160 |
|
161 #media-upload .del-attachment { |
|
162 display: none; |
|
163 margin: 5px 0; |
|
164 } |
|
165 |
|
166 .menu_order { |
|
167 float: right; |
|
168 font-size: 11px; |
|
169 margin: 10px 10px 0; |
|
170 } |
|
171 |
|
172 .menu_order_input { |
|
173 border: 1px solid #ddd; |
|
174 font-size: 10px; |
|
175 padding: 1px; |
|
176 width: 23px; |
|
177 } |
|
178 |
|
179 .ui-sortable-helper { |
|
180 background-color: #fff; |
|
181 border: 1px solid #aaa; |
|
182 opacity: 0.6; |
|
183 filter: alpha(opacity=60); |
|
184 } |
|
185 |
|
186 #media-upload th.order-head { |
|
187 width: 20%; |
|
188 text-align: center; |
|
189 } |
|
190 |
|
191 #media-upload th.actions-head { |
|
192 width: 25%; |
|
193 text-align: center; |
|
194 } |
|
195 |
|
196 #media-upload a.wp-post-thumbnail { |
|
197 margin: 0 20px; |
|
198 } |
|
199 |
|
200 #media-upload .widefat { |
|
201 width: 626px; |
|
202 border-style: solid solid none; |
|
203 } |
|
204 |
|
205 .sorthelper { |
|
206 height: 37px; |
|
207 width: 623px; |
|
208 display: block; |
|
209 } |
|
210 |
|
211 #gallery-settings th.label { |
|
212 width: 160px; |
|
213 } |
|
214 |
|
215 #gallery-settings #basic th.label { |
|
216 padding: 5px 5px 5px 0; |
|
217 } |
|
218 |
|
219 #gallery-settings .title { |
|
220 clear: both; |
|
221 padding: 0 0 3px; |
|
222 font-size: 1.6em; |
|
223 border-bottom: 1px solid #DADADA; |
|
224 } |
|
225 |
|
226 h3.media-title { |
|
227 font-size: 1.6em; |
|
228 } |
|
229 |
|
230 h4.media-sub-title { |
|
231 border-bottom: 1px solid #DADADA; |
|
232 font-size: 1.3em; |
|
233 margin: 12px; |
|
234 padding: 0 0 3px; |
|
235 } |
|
236 |
|
237 #gallery-settings .title, |
|
238 h3.media-title, |
|
239 h4.media-sub-title { |
|
240 font-family: Georgia,"Times New Roman",Times,serif; |
|
241 font-weight: normal; |
|
242 color: #5A5A5A; |
|
243 } |
|
244 |
|
245 #gallery-settings .describe td { |
|
246 vertical-align: middle; |
|
247 height: 3em; |
|
248 } |
|
249 |
|
250 #gallery-settings .describe th.label { |
|
251 padding-top: .5em; |
|
252 text-align: left; |
|
253 } |
|
254 |
|
255 #gallery-settings .describe { |
|
256 padding: 5px; |
|
257 width: 615px; |
|
258 clear: both; |
9 clear: both; |
259 cursor: default; |
10 cursor: default; |
260 } |
11 } |
261 |
12 |
262 #gallery-settings .describe select { |
13 .media-item.media-blank .describe { |
263 width: 15em; |
14 border: 0; |
264 } |
15 } |
265 |
16 |
266 #gallery-settings .describe select option, |
17 .media-item .describe th { |
267 #gallery-settings .describe td { |
18 vertical-align: top; |
|
19 text-align: left; |
|
20 padding: 5px 10px 10px; |
|
21 width: 140px; |
|
22 } |
|
23 |
|
24 .media-item .describe .align th { |
|
25 padding-top: 0; |
|
26 } |
|
27 |
|
28 .media-item .media-item-info tr { |
|
29 background-color: transparent; |
|
30 } |
|
31 |
|
32 .media-item .describe td { |
|
33 padding: 0 8px 8px 0; |
|
34 vertical-align: top; |
|
35 } |
|
36 |
|
37 .media-item thead.media-item-info td { |
|
38 padding: 4px 10px 0; |
|
39 } |
|
40 |
|
41 .media-item .media-item-info .A1B1 { |
|
42 padding: 0 0 0 10px; |
|
43 } |
|
44 |
|
45 .media-item td.savesend { |
|
46 padding-bottom: 15px; |
|
47 } |
|
48 |
|
49 .media-item .thumbnail { |
|
50 max-height: 128px; |
|
51 max-width: 128px; |
|
52 } |
|
53 |
|
54 #wpbody-content #async-upload-wrap a { |
|
55 display: none; |
|
56 } |
|
57 |
|
58 .media-upload-form { |
|
59 margin-top: 20px; |
|
60 } |
|
61 |
|
62 .media-upload-form td label { |
|
63 margin-right: 6px; |
|
64 margin-left: 2px; |
|
65 } |
|
66 |
|
67 .media-upload-form .align .field label { |
|
68 display: inline; |
|
69 padding: 0 0 0 23px; |
|
70 margin: 0 1em 0 3px; |
|
71 font-weight: 600; |
|
72 } |
|
73 |
|
74 .media-upload-form tr.image-size label { |
|
75 margin: 0 0 0 5px; |
|
76 font-weight: 600; |
|
77 } |
|
78 |
|
79 .media-upload-form th.label label { |
|
80 font-weight: 600; |
|
81 margin: 0.5em; |
|
82 font-size: 13px; |
|
83 } |
|
84 |
|
85 .media-upload-form th.label label span { |
|
86 padding: 0 5px; |
|
87 } |
|
88 |
|
89 .media-item .describe input[type="text"], |
|
90 .media-item .describe textarea { |
|
91 width: 460px; |
|
92 } |
|
93 |
|
94 .media-item .describe p.help { |
|
95 margin: 0; |
|
96 padding: 0 0 0 5px; |
|
97 } |
|
98 |
|
99 .media-item .edit-attachment, |
|
100 .describe-toggle-on, |
|
101 .describe-toggle-off { |
|
102 display: block; |
|
103 line-height: 36px; |
|
104 float: right; |
|
105 margin-right: 10px; |
|
106 } |
|
107 |
|
108 .media-item .describe-toggle-off, |
|
109 .media-item.open .describe-toggle-on { |
|
110 display: none; |
|
111 } |
|
112 |
|
113 .media-item.open .describe-toggle-off { |
|
114 display: block; |
|
115 } |
|
116 |
|
117 .media-upload-form .media-item { |
|
118 min-height: 36px; |
|
119 margin-bottom: 1px; |
|
120 position: relative; |
|
121 width: 100%; |
|
122 background: #fff; |
|
123 } |
|
124 |
|
125 .media-upload-form .media-item, |
|
126 .media-upload-form .media-item .error { |
|
127 -webkit-box-shadow: 0 1px 0 #dfdfdf; |
|
128 box-shadow: 0 1px 0 #dfdfdf; |
|
129 } |
|
130 |
|
131 #media-items:empty { |
|
132 border: 0 none; |
|
133 } |
|
134 |
|
135 .media-item .filename { |
|
136 line-height: 36px; |
|
137 overflow: hidden; |
|
138 margin-left: 6px; |
|
139 } |
|
140 |
|
141 .media-item .pinkynail { |
|
142 float: left; |
|
143 margin: 2px 10px 0 3px; |
|
144 max-width: 40px; |
|
145 max-height: 32px; |
|
146 } |
|
147 |
|
148 .media-item .startopen, |
|
149 .media-item .startclosed { |
|
150 display: none; |
|
151 } |
|
152 |
|
153 .media-item .original { |
|
154 position: relative; |
|
155 height: 34px; |
|
156 } |
|
157 |
|
158 .media-item .progress { |
|
159 float: right; |
|
160 height: 22px; |
|
161 margin: 7px 6px; |
|
162 width: 200px; |
|
163 line-height: 2em; |
268 padding: 0; |
164 padding: 0; |
269 } |
165 overflow: hidden; |
270 |
166 -webkit-border-radius: 22px; |
271 #gallery-settings label, |
167 border-radius: 22px; |
272 #gallery-settings legend { |
168 background: #ddd; |
|
169 -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,0.1); |
|
170 box-shadow: inset 0 1px 2px rgba(0,0,0,0.1); |
|
171 } |
|
172 |
|
173 .media-item .bar { |
|
174 z-index: 9; |
|
175 width: 0; |
|
176 height: 100%; |
|
177 margin-top: -22px; |
|
178 -webkit-border-radius: 22px; |
|
179 border-radius: 22px; |
|
180 background-color: #0073aa; |
|
181 -webkit-box-shadow: inset 0 0 2px rgba(0,0,0,0.3); |
|
182 box-shadow: inset 0 0 2px rgba(0,0,0,0.3); |
|
183 } |
|
184 |
|
185 .media-item .progress .percent { |
|
186 z-index: 10; |
|
187 position: relative; |
|
188 width: 200px; |
|
189 padding: 0; |
|
190 color: #fff; |
|
191 text-align: center; |
|
192 line-height: 22px; |
|
193 font-weight: 400; |
|
194 text-shadow: 0 1px 2px rgba(0,0,0,0.2); |
|
195 } |
|
196 |
|
197 .upload-php .fixed .column-parent { |
|
198 width: 15%; |
|
199 } |
|
200 |
|
201 .js .html-uploader #plupload-upload-ui { |
|
202 display: none; |
|
203 } |
|
204 |
|
205 .js .html-uploader #html-upload-ui { |
|
206 display: block; |
|
207 } |
|
208 |
|
209 .media-upload-form .media-item.error, |
|
210 .media-upload-form .media-item .error { |
|
211 width: auto; |
|
212 margin: 0 0 1px 0; |
|
213 } |
|
214 |
|
215 .media-upload-form .media-item .error { |
|
216 padding: 10px 0 10px 14px; |
|
217 } |
|
218 |
|
219 .media-item .error-div a.dismiss { |
|
220 display: block; |
|
221 float: right; |
|
222 margin: 0 10px 0 15px; |
|
223 } |
|
224 |
|
225 /*------------------------------------------------------------------------------ |
|
226 14.1 - Media Library |
|
227 ------------------------------------------------------------------------------*/ |
|
228 |
|
229 .find-box { |
|
230 background-color: #fff; |
|
231 -webkit-box-shadow: 0 3px 6px rgba( 0, 0, 0, 0.3 ); |
|
232 box-shadow: 0 3px 6px rgba( 0, 0, 0, 0.3 ); |
|
233 width: 600px; |
|
234 overflow: hidden; |
|
235 margin-left: -300px; |
|
236 position: fixed; |
|
237 top: 30px; |
|
238 bottom: 30px; |
|
239 left: 50%; |
|
240 z-index: 100105; |
|
241 } |
|
242 |
|
243 .find-box-head { |
|
244 background: #fcfcfc; |
|
245 border-bottom: 1px solid #dfdfdf; |
|
246 height: 36px; |
|
247 font-size: 18px; |
|
248 font-weight: 600; |
|
249 line-height: 36px; |
|
250 padding: 0 36px 0 16px; |
|
251 position: absolute; |
|
252 top: 0; |
|
253 left: 0; |
|
254 right: 0; |
|
255 } |
|
256 |
|
257 .find-box-inside { |
|
258 overflow: auto; |
|
259 padding: 16px; |
|
260 background-color: #fff; |
|
261 position: absolute; |
|
262 top: 37px; |
|
263 bottom: 45px; |
|
264 overflow-y: scroll; |
|
265 width: 100%; |
|
266 -webkit-box-sizing: border-box; |
|
267 -moz-box-sizing: border-box; |
|
268 box-sizing: border-box; |
|
269 } |
|
270 |
|
271 .find-box-search { |
|
272 padding-bottom: 16px; |
|
273 } |
|
274 |
|
275 .find-box-search .spinner { |
|
276 float: none; |
|
277 left: 105px; |
|
278 position: absolute; |
|
279 } |
|
280 |
|
281 .find-box-search, |
|
282 #find-posts-response { |
|
283 position: relative; /* RTL fix, #WP28010 */ |
|
284 } |
|
285 |
|
286 #find-posts-input, |
|
287 #find-posts-search { |
|
288 float: left; |
|
289 } |
|
290 |
|
291 #find-posts-input { |
|
292 width: 140px; |
|
293 height: 28px; |
|
294 margin: 0 4px 0 0; |
|
295 } |
|
296 |
|
297 .widefat .found-radio { |
|
298 padding-right: 0; |
|
299 width: 16px; |
|
300 } |
|
301 |
|
302 #find-posts-close { |
|
303 width: 36px; |
|
304 height: 36px; |
|
305 position: absolute; |
|
306 top: 0; |
|
307 right: 0; |
|
308 cursor: pointer; |
|
309 text-align: center; |
|
310 color: #666; |
|
311 } |
|
312 |
|
313 #find-posts-close:hover { |
|
314 color: #00a0d2; |
|
315 } |
|
316 |
|
317 #find-posts-close:before { |
|
318 font: normal 20px/36px 'dashicons'; |
|
319 vertical-align: top; |
|
320 speak: none; |
|
321 -webkit-font-smoothing: antialiased; |
|
322 -moz-osx-font-smoothing: grayscale; |
|
323 content: '\f158'; |
|
324 } |
|
325 |
|
326 .find-box-buttons { |
|
327 padding: 8px 16px; |
|
328 background: #fcfcfc; |
|
329 border-top: 1px solid #dfdfdf; |
|
330 position: absolute; |
|
331 bottom: 0; |
|
332 left: 0; |
|
333 right: 0; |
|
334 } |
|
335 |
|
336 @media screen and ( max-width: 782px ) { |
|
337 .find-box-inside { |
|
338 bottom: 57px; |
|
339 } |
|
340 } |
|
341 |
|
342 @media screen and ( max-width: 660px ) { |
|
343 |
|
344 .find-box { |
|
345 top: 0; |
|
346 bottom: 0; |
|
347 left: 0; |
|
348 right: 0; |
|
349 margin: 0; |
|
350 width: 100%; |
|
351 } |
|
352 |
|
353 } |
|
354 |
|
355 .ui-find-overlay { |
|
356 position: fixed; |
|
357 top: 0; |
|
358 left: 0; |
|
359 right: 0; |
|
360 bottom: 0; |
|
361 background: #000; |
|
362 opacity: 0.7; |
|
363 filter: alpha(opacity=70); |
|
364 z-index: 100100; |
|
365 } |
|
366 |
|
367 ul#dismissed-updates { |
|
368 display: none; |
|
369 } |
|
370 |
|
371 form.upgrade { |
|
372 margin-top: 8px; |
|
373 } |
|
374 |
|
375 form.upgrade .hint { |
|
376 font-style: italic; |
|
377 font-size: 85%; |
|
378 margin: -0.5em 0 2em 0; |
|
379 } |
|
380 |
|
381 #poststuff .inside .the-tagcloud { |
|
382 margin: 5px 0 10px; |
|
383 padding: 8px; |
|
384 border: 1px solid #ddd; |
|
385 line-height: 1.8em; |
|
386 word-spacing: 3px; |
|
387 -webkit-border-radius: 6px; |
|
388 border-radius: 6px; |
|
389 } |
|
390 |
|
391 .drag-drop #drag-drop-area { |
|
392 border: 4px dashed #b4b9be; |
|
393 height: 200px; |
|
394 } |
|
395 |
|
396 .drag-drop .drag-drop-inside { |
|
397 margin: 70px auto 0; |
|
398 width: 250px; |
|
399 } |
|
400 |
|
401 .drag-drop-inside p { |
|
402 color: #a0a5aa; |
|
403 font-size: 14px; |
|
404 margin: 5px 0; |
|
405 display: none; |
|
406 } |
|
407 |
|
408 .drag-drop .drag-drop-inside p { |
|
409 text-align: center; |
|
410 } |
|
411 |
|
412 .drag-drop-inside p.drag-drop-info { |
|
413 font-size: 20px; |
|
414 } |
|
415 |
|
416 .drag-drop .drag-drop-inside p, |
|
417 .drag-drop-inside p.drag-drop-buttons { |
|
418 display: block; |
|
419 } |
|
420 |
|
421 /* |
|
422 #drag-drop-area:-moz-drag-over { |
|
423 border-color: #83b4d8; |
|
424 } |
|
425 border color while dragging a file over the uploader drop area */ |
|
426 .drag-drop.drag-over #drag-drop-area { |
|
427 border-color: #83b4d8; |
|
428 } |
|
429 |
|
430 #plupload-upload-ui { |
|
431 position: relative; |
|
432 } |
|
433 |
|
434 /** |
|
435 * Media Library grid view |
|
436 */ |
|
437 |
|
438 .media-frame.mode-grid, |
|
439 .media-frame.mode-grid .media-frame-content, |
|
440 .media-frame.mode-grid .attachments-browser .attachments, |
|
441 .media-frame.mode-grid .uploader-inline-content { |
|
442 position: static; |
|
443 } |
|
444 |
|
445 /* Regions we don't use at all */ |
|
446 .media-frame.mode-grid .media-frame-title, |
|
447 .media-frame.mode-grid .media-frame-router, |
|
448 .media-frame.mode-grid .media-frame-menu { |
|
449 display: none; |
|
450 } |
|
451 |
|
452 .media-frame.mode-grid .media-frame-content { |
|
453 background-color: transparent; |
|
454 border: none; |
|
455 } |
|
456 |
|
457 .upload-php .mode-grid .media-sidebar { |
|
458 position: relative; |
|
459 width: auto; |
|
460 margin-bottom: 16px; |
|
461 padding: 0 16px; |
|
462 border: 1px solid #c00; |
|
463 background-color: #feebe8; |
|
464 } |
|
465 |
|
466 .upload-php .mode-grid .hide-sidebar .media-sidebar { |
|
467 display: none; |
|
468 } |
|
469 |
|
470 .upload-php .mode-grid .media-sidebar .media-uploader-status { |
|
471 border-bottom: none; |
|
472 padding-bottom: 0; |
|
473 max-width: 100%; |
|
474 } |
|
475 |
|
476 .upload-php .mode-grid .media-sidebar .upload-error { |
|
477 margin: 20px 0; |
|
478 padding: 0; |
|
479 border: none; |
|
480 background: none; |
|
481 } |
|
482 |
|
483 .upload-php .mode-grid .media-sidebar .media-uploader-status .upload-dismiss-errors { |
|
484 font-size: 0; |
|
485 top: -12px; |
|
486 right: -10px; |
|
487 } |
|
488 |
|
489 .upload-php .mode-grid .media-sidebar .media-uploader-status .upload-dismiss-errors:before { |
|
490 content: "\f158"; |
|
491 font: normal 20px/1 dashicons; |
|
492 color: #666; |
|
493 } |
|
494 |
|
495 .upload-php .mode-grid .media-sidebar .media-uploader-status .upload-dismiss-errors:focus:before, |
|
496 .upload-php .mode-grid .media-sidebar .media-uploader-status .upload-dismiss-errors:hover:before { |
|
497 color: #00a0d2; |
|
498 } |
|
499 |
|
500 .upload-php .mode-grid .media-sidebar .media-uploader-status.errors h3 { |
|
501 display: none; |
|
502 } |
|
503 |
|
504 .media-frame.mode-grid .uploader-inline { |
|
505 position: relative; |
|
506 top: auto; |
|
507 right: auto; |
|
508 left: auto; |
|
509 bottom: auto; |
|
510 padding-top: 0; |
|
511 margin-top: 0; |
|
512 border: 4px dashed #b4b9be; |
|
513 } |
|
514 |
|
515 .media-frame.mode-select .attachments-browser.fixed .attachments { |
|
516 position: relative; |
|
517 top: 94px; /* prevent jumping up when the toolbar becomes fixed */ |
|
518 padding-bottom: 94px; /* offset for above so the bottom doesn't get cut off */ |
|
519 } |
|
520 |
|
521 .media-frame.mode-grid .attachment:focus, |
|
522 .media-frame.mode-grid .selected.attachment:focus, |
|
523 .media-frame.mode-grid .attachment.details:focus { |
|
524 -webkit-box-shadow: |
|
525 inset 0 0 2px 3px #f1f1f1, |
|
526 inset 0 0 0 7px #5b9dd9; |
|
527 box-shadow: |
|
528 inset 0 0 2px 3px #f1f1f1, |
|
529 inset 0 0 0 7px #5b9dd9; |
|
530 outline: none; |
|
531 } |
|
532 |
|
533 .media-frame.mode-grid .selected.attachment { |
|
534 -webkit-box-shadow: |
|
535 inset 0 0 0 5px #f1f1f1, |
|
536 inset 0 0 0 7px #ccc; |
|
537 box-shadow: |
|
538 inset 0 0 0 5px #f1f1f1, |
|
539 inset 0 0 0 7px #ccc; |
|
540 } |
|
541 |
|
542 .media-frame.mode-grid .attachment.details { |
|
543 -webkit-box-shadow: |
|
544 inset 0 0 0 3px #f1f1f1, |
|
545 inset 0 0 0 7px #1e8cbe; |
|
546 box-shadow: |
|
547 inset 0 0 0 3px #f1f1f1, |
|
548 inset 0 0 0 7px #1e8cbe; |
|
549 } |
|
550 |
|
551 .media-frame.mode-grid.mode-select .attachment .thumbnail { |
|
552 opacity: 0.65; |
|
553 } |
|
554 |
|
555 .media-frame.mode-select .attachment.selected .thumbnail { |
|
556 opacity: 1; |
|
557 } |
|
558 |
|
559 .media-frame.mode-grid .media-toolbar { |
|
560 margin-bottom: 15px; |
|
561 height: auto; |
|
562 } |
|
563 |
|
564 .media-frame.mode-grid .media-toolbar select { |
|
565 margin: 0 10px 0 0; |
|
566 font-size: 14px; |
|
567 } |
|
568 |
|
569 .media-frame.mode-grid .media-toolbar-secondary > .media-button { |
|
570 margin-top: 10px; |
|
571 margin-bottom: 10px; |
|
572 } |
|
573 |
|
574 .media-frame.mode-grid .attachments-browser .bulk-select { |
|
575 display: inline-block; |
|
576 margin: 0 10px 0 0; |
|
577 } |
|
578 |
|
579 .media-frame.mode-grid .search { |
|
580 margin-top: 0; |
|
581 } |
|
582 |
|
583 .media-frame.mode-grid .spinner { |
|
584 margin-top: 15px; |
|
585 } |
|
586 |
|
587 .attachments-browser .media-toolbar-secondary > .media-button { |
|
588 margin-right: 10px; |
|
589 } |
|
590 |
|
591 .media-frame.mode-select .attachments-browser.fixed .media-toolbar { |
|
592 position: fixed; |
|
593 top: 32px; |
|
594 left: auto; |
|
595 right: 20px; |
|
596 margin-top: 0; |
|
597 } |
|
598 |
|
599 .media-frame.mode-grid .attachments-browser { |
|
600 padding: 0; |
|
601 } |
|
602 |
|
603 .media-frame.mode-grid .attachments-browser .attachments { |
|
604 padding: 2px; |
|
605 } |
|
606 |
|
607 .media-frame.mode-grid .attachments-browser .no-media { |
|
608 color: #999; |
|
609 font-size: 18px; |
|
610 font-style: normal; |
|
611 margin: 0; |
|
612 padding: 100px 0 0; |
|
613 text-align: center; |
|
614 } |
|
615 |
|
616 /** |
|
617 * Attachment details modal |
|
618 */ |
|
619 |
|
620 .edit-attachment-frame { |
|
621 display: block; |
|
622 height: 100%; |
|
623 width: 100%; |
|
624 } |
|
625 |
|
626 .edit-attachment-frame .edit-media-header { |
|
627 overflow: hidden; |
|
628 } |
|
629 |
|
630 .upload-php .media-modal-close .media-modal-icon:before { |
|
631 content: '\f335'; |
|
632 font-size: 22px; |
|
633 } |
|
634 |
|
635 .upload-php .media-modal-close .media-modal-icon { |
|
636 margin: 14px; |
|
637 width: 22px; |
|
638 } |
|
639 |
|
640 .upload-php .media-modal-close, |
|
641 .edit-attachment-frame .edit-media-header .left, |
|
642 .edit-attachment-frame .edit-media-header .right { |
|
643 cursor: pointer; |
|
644 color: #777; |
|
645 background-color: transparent; |
|
646 height: 50px; |
|
647 width: 50px; |
|
648 padding: 0; |
|
649 position: absolute; |
|
650 text-align: center; |
|
651 border: 0; |
|
652 border-left: 1px solid #ddd; |
|
653 -webkit-transition: color .1s ease-in-out, background .1s ease-in-out; |
|
654 transition: color .1s ease-in-out, background .1s ease-in-out; |
|
655 } |
|
656 |
|
657 .upload-php .media-modal-close { |
|
658 top: 0; |
|
659 right: 0; |
|
660 } |
|
661 |
|
662 .edit-attachment-frame .edit-media-header .left { |
|
663 right: 102px; |
|
664 } |
|
665 |
|
666 .edit-attachment-frame .edit-media-header .right { |
|
667 right: 51px; |
|
668 } |
|
669 |
|
670 .edit-attachment-frame .media-frame-title { |
|
671 left: 0; |
|
672 right: 150px; /* leave space for prev/next/close */ |
|
673 } |
|
674 |
|
675 .edit-attachment-frame .edit-media-header .right:before, |
|
676 .edit-attachment-frame .edit-media-header .left:before { |
|
677 font: normal 20px/50px 'dashicons' !important; |
|
678 display: inline; |
|
679 font-weight: 300; |
|
680 } |
|
681 |
|
682 .upload-php .media-modal-close:hover, |
|
683 .upload-php .media-modal-close:focus, |
|
684 .edit-attachment-frame .edit-media-header .left:hover, |
|
685 .edit-attachment-frame .edit-media-header .right:hover, |
|
686 .edit-attachment-frame .edit-media-header .left:focus, |
|
687 .edit-attachment-frame .edit-media-header .right:focus { |
|
688 background: #ddd; |
|
689 border-color: #ccc; |
|
690 color: #000; |
|
691 outline: none; |
|
692 } |
|
693 |
|
694 .upload-php .media-modal-close:focus .media-modal-icon:before, |
|
695 .upload-php .media-modal-close:hover .media-modal-icon:before { |
|
696 color: #000; |
|
697 } |
|
698 |
|
699 .edit-attachment-frame .edit-media-header .left:before, |
|
700 .rtl .edit-attachment-frame .edit-media-header .right:before { |
|
701 content: '\f341'; |
|
702 } |
|
703 |
|
704 .edit-attachment-frame .edit-media-header .right:before, |
|
705 .rtl .edit-attachment-frame .edit-media-header .left:before { |
|
706 content: '\f345'; |
|
707 } |
|
708 |
|
709 .edit-attachment-frame .edit-media-header .left.disabled, |
|
710 .edit-attachment-frame .edit-media-header .right.disabled, |
|
711 .edit-attachment-frame .edit-media-header .left.disabled:hover, |
|
712 .edit-attachment-frame .edit-media-header .right.disabled:hover { |
|
713 color: #ccc; |
|
714 background: inherit; |
|
715 cursor: default; |
|
716 pointer-events: none; |
|
717 } |
|
718 |
|
719 .edit-attachment-frame .media-frame-content, |
|
720 .edit-attachment-frame .media-frame-router { |
|
721 left: 0; |
|
722 } |
|
723 |
|
724 .edit-attachment-frame .media-frame-content { |
|
725 border-bottom: none; |
|
726 bottom: 0; |
|
727 top: 50px; |
|
728 } |
|
729 |
|
730 .edit-attachment-frame .attachment-details { |
|
731 position: absolute; |
|
732 overflow: auto; |
|
733 top: 0; |
|
734 bottom: 0; |
|
735 right: 0; |
|
736 left: 0; |
|
737 -webkit-box-shadow: inset 0px 4px 4px -4px rgba(0, 0, 0, 0.1); |
|
738 box-shadow: inset 0px 4px 4px -4px rgba(0, 0, 0, 0.1); |
|
739 } |
|
740 |
|
741 .edit-attachment-frame .attachment-media-view { |
|
742 float: left; |
|
743 width: 65%; |
|
744 height: 100%; |
|
745 } |
|
746 |
|
747 .edit-attachment-frame .attachment-media-view .thumbnail { |
|
748 -webkit-box-sizing: border-box; |
|
749 -moz-box-sizing: border-box; |
|
750 box-sizing: border-box; |
|
751 padding: 16px; |
|
752 height: 100%; |
|
753 } |
|
754 |
|
755 .edit-attachment-frame .attachment-media-view .details-image { |
|
756 display: block; |
|
757 margin-bottom: 16px; |
|
758 max-width: 100%; |
|
759 max-height: 90%; |
|
760 max-height: -webkit-calc( 100% - 42px ); |
|
761 max-height: calc( 100% - 42px ); /* leave space for actions underneath */ |
|
762 } |
|
763 |
|
764 .edit-attachment-frame .wp-media-wrapper { |
|
765 margin-bottom: 12px; |
|
766 } |
|
767 |
|
768 .edit-attachment-frame input, |
|
769 .edit-attachment-frame textarea { |
|
770 padding: 6px 8px; |
|
771 line-height: 16px; |
|
772 } |
|
773 |
|
774 .edit-attachment-frame .attachment-info { |
|
775 overflow: auto; |
|
776 -webkit-box-sizing: border-box; |
|
777 -moz-box-sizing: border-box; |
|
778 box-sizing: border-box; |
|
779 margin-bottom: 0; |
|
780 padding: 12px 16px 0; |
|
781 width: 35%; |
|
782 height: 100%; |
|
783 -webkit-box-shadow: inset 0px 4px 4px -4px rgba(0, 0, 0, 0.1); |
|
784 box-shadow: inset 0px 4px 4px -4px rgba(0, 0, 0, 0.1); |
|
785 border-bottom: 0; |
|
786 border-left: 1px solid #ddd; |
|
787 background: #f3f3f3; |
|
788 } |
|
789 |
|
790 .edit-attachment-frame .attachment-info .details, |
|
791 .edit-attachment-frame .attachment-info .settings { |
|
792 position: relative; /* RTL fix, #WP29352 */ |
|
793 overflow: hidden; |
|
794 float: none; |
|
795 margin-bottom: 15px; |
|
796 padding-bottom: 15px; |
|
797 border-bottom: 1px solid #ddd; |
|
798 } |
|
799 |
|
800 .edit-attachment-frame .attachment-info .filename { |
|
801 font-weight: normal; |
|
802 color: #666; |
|
803 } |
|
804 |
|
805 .edit-attachment-frame .attachment-info .thumbnail { |
|
806 margin-bottom: 12px; |
|
807 } |
|
808 |
|
809 .attachment-info .actions { |
|
810 margin-bottom: 16px; |
|
811 } |
|
812 |
|
813 .attachment-info .actions a { |
|
814 display: inline; |
|
815 text-decoration: none; |
|
816 } |
|
817 |
|
818 |
|
819 /*------------------------------------------------------------------------------ |
|
820 14.2 - Image Editor |
|
821 ------------------------------------------------------------------------------*/ |
|
822 |
|
823 .wp_attachment_details label[for="content"] { |
273 font-size: 13px; |
824 font-size: 13px; |
274 color: #464646; |
825 line-height: 1.5; |
275 margin-right: 15px; |
826 margin: 1em 0; |
276 } |
827 } |
277 |
828 |
278 #gallery-settings .align .field label { |
829 .wp_attachment_details #attachment_caption { |
279 margin: 0 1em 0 3px; |
830 height: 4em; |
280 } |
831 } |
281 |
832 |
282 #gallery-settings p.ml-submit { |
833 .describe .image-editor { |
283 border-top: 1px solid #dfdfdf; |
834 vertical-align: top; |
284 } |
835 } |
285 |
836 |
286 #gallery-settings select#columns { |
837 .imgedit-wrap { |
287 width: 6em; |
838 position: relative; |
288 } |
839 } |
289 |
840 |
290 #sort-buttons { |
841 .imgedit-settings p { |
291 font-size: 0.8em; |
842 margin: 8px 0 0; |
292 margin: 3px 25px -8px 0; |
843 } |
293 text-align: right; |
844 |
294 max-width: 625px; |
845 .describe .imgedit-wrap .imgedit-settings { |
295 } |
846 padding: 0 5px; |
296 |
847 } |
297 #sort-buttons a { |
848 |
|
849 .wp_attachment_holder div.updated { |
|
850 margin-top: 0; |
|
851 } |
|
852 |
|
853 .wp_attachment_holder .imgedit-wrap > div { |
|
854 height: auto; |
|
855 overflow: hidden; |
|
856 } |
|
857 |
|
858 .wp_attachment_holder .imgedit-wrap .imgedit-panel-content { |
|
859 padding-right: 16px; |
|
860 width: auto; |
|
861 overflow: hidden; |
|
862 } |
|
863 |
|
864 .wp_attachment_holder .imgedit-wrap .imgedit-settings { |
|
865 float: right; |
|
866 width: 250px; |
|
867 } |
|
868 |
|
869 .imgedit-settings input { |
|
870 margin-top: 0; |
|
871 vertical-align: middle; |
|
872 } |
|
873 |
|
874 .imgedit-wait { |
|
875 position: absolute; |
|
876 top: 0; |
|
877 background: #fff url(../images/spinner.gif) no-repeat center; |
|
878 -webkit-background-size: 20px 20px; |
|
879 background-size: 20px 20px; |
|
880 opacity: 0.7; |
|
881 filter: alpha(opacity=70); |
|
882 width: 100%; |
|
883 height: 500px; |
|
884 display: none; |
|
885 } |
|
886 |
|
887 .no-float { |
|
888 float: none; |
|
889 } |
|
890 |
|
891 .media-disabled, |
|
892 .imgedit-settings .disabled { |
|
893 color: grey; |
|
894 } |
|
895 |
|
896 .wp_attachment_image, |
|
897 .A1B1 { |
|
898 overflow: hidden; |
|
899 } |
|
900 |
|
901 .wp_attachment_image .button, |
|
902 .A1B1 .button { |
|
903 float: left; |
|
904 } |
|
905 |
|
906 .no-js .wp_attachment_image .button { |
|
907 display: none; |
|
908 } |
|
909 |
|
910 .wp_attachment_image .spinner, |
|
911 .A1B1 .spinner { |
|
912 float: left; |
|
913 } |
|
914 |
|
915 .imgedit-menu { |
|
916 margin: 0 0 12px; |
|
917 min-width: 300px; |
|
918 } |
|
919 |
|
920 .imgedit-menu div { |
|
921 float: left; |
|
922 width: 32px; |
|
923 border: 1px solid #d5d5d5; |
|
924 background: #f1f1f1; |
|
925 margin: 0 8px 0 0; |
|
926 height: 32px; |
|
927 -webkit-font-smoothing: antialiased; |
|
928 -moz-osx-font-smoothing: grayscale; |
|
929 text-align: center; |
|
930 line-height: 28px; |
|
931 color: #777; |
|
932 cursor: pointer; |
|
933 } |
|
934 |
|
935 .imgedit-menu div:before { |
|
936 font: normal 20px/1 'dashicons'; |
|
937 speak: none; |
|
938 vertical-align: middle; |
|
939 } |
|
940 |
|
941 .imgedit-menu div:hover { |
|
942 border-color: #c1c1c1; |
|
943 background-color: #eaeaea; |
|
944 color: #32373c; |
|
945 } |
|
946 |
|
947 .imgedit-menu div.disabled { |
|
948 border-color: #ccc; |
|
949 background-color: #ddd; |
|
950 color: #777; |
|
951 filter: alpha(opacity=50); |
|
952 opacity: 0.5; |
|
953 cursor: default; |
|
954 } |
|
955 |
|
956 .imgedit-crop:before { |
|
957 content:'\f165'; |
|
958 } |
|
959 |
|
960 .imgedit-rleft:before { |
|
961 content:'\f166'; |
|
962 } |
|
963 |
|
964 .imgedit-rright:before { |
|
965 content:'\f167'; |
|
966 } |
|
967 |
|
968 .imgedit-flipv:before { |
|
969 content:'\f168'; |
|
970 } |
|
971 |
|
972 .imgedit-fliph:before { |
|
973 content:'\f169'; |
|
974 } |
|
975 |
|
976 .imgedit-undo:before { |
|
977 content:'\f171'; |
|
978 } |
|
979 |
|
980 .imgedit-redo:before { |
|
981 content:'\f172'; |
|
982 } |
|
983 |
|
984 .imgedit-crop-wrap { |
|
985 position: relative; |
|
986 } |
|
987 |
|
988 .imgedit-crop { |
|
989 margin: 0 8px 0 0; |
|
990 } |
|
991 |
|
992 .imgedit-rleft { |
|
993 margin: 0 3px; |
|
994 } |
|
995 |
|
996 .imgedit-rright { |
|
997 margin: 0 8px 0 3px; |
|
998 } |
|
999 |
|
1000 .imgedit-flipv { |
|
1001 margin: 0 3px; |
|
1002 } |
|
1003 |
|
1004 .imgedit-fliph { |
|
1005 margin: 0 8px 0 3px; |
|
1006 } |
|
1007 |
|
1008 .imgedit-undo { |
|
1009 margin: 0 3px; |
|
1010 } |
|
1011 |
|
1012 .imgedit-redo { |
|
1013 margin: 0 8px 0 3px; |
|
1014 } |
|
1015 |
|
1016 .imgedit-applyto img { |
|
1017 margin: 0 8px 0 0; |
|
1018 } |
|
1019 |
|
1020 .imgedit-group-top { |
|
1021 margin: 5px 0; |
|
1022 } |
|
1023 |
|
1024 #poststuff .imgedit-group-top h3 { |
|
1025 padding: 0; |
|
1026 } |
|
1027 |
|
1028 .imgedit-group-top h3 a { |
298 text-decoration: none; |
1029 text-decoration: none; |
299 } |
1030 } |
300 |
1031 |
301 #sort-buttons #asc, |
1032 .imgedit-applyto .imgedit-label { |
302 #sort-buttons #showall { |
1033 padding: 2px 0 0; |
303 padding-left: 5px; |
1034 display: block; |
304 } |
1035 } |
305 |
1036 |
306 #sort-buttons span { |
1037 .imgedit-help { |
307 margin-right: 25px; |
|
308 } |
|
309 |
|
310 p.media-types { |
|
311 margin: 1em; |
|
312 } |
|
313 |
|
314 tr.not-image { |
|
315 display: none; |
1038 display: none; |
316 } |
1039 font-style: italic; |
317 |
1040 } |
318 table.not-image tr.not-image { |
1041 |
319 display: table-row; |
1042 a.imgedit-help-toggle { |
320 } |
1043 text-decoration: none; |
321 |
1044 } |
322 table.not-image tr.image-only { |
1045 |
323 display: none; |
1046 .form-table td.imgedit-response { |
324 } |
1047 padding: 0; |
|
1048 } |
|
1049 |
|
1050 .imgedit-submit { |
|
1051 margin: 8px 0; |
|
1052 } |
|
1053 |
|
1054 .imgedit-submit-btn { |
|
1055 margin-left: 20px; |
|
1056 } |
|
1057 |
|
1058 .imgedit-wrap .nowrap { |
|
1059 white-space: nowrap; |
|
1060 } |
|
1061 |
|
1062 span.imgedit-scale-warn { |
|
1063 color: red; |
|
1064 font-size: 20px; |
|
1065 font-style: normal; |
|
1066 visibility: hidden; |
|
1067 vertical-align: middle; |
|
1068 } |
|
1069 |
|
1070 .imgedit-group { |
|
1071 margin-bottom: 8px; |
|
1072 padding: 2px 10px; |
|
1073 } |
|
1074 |
|
1075 audio, video { |
|
1076 display: inline-block; |
|
1077 max-width: 100%; |
|
1078 } |
|
1079 |
|
1080 .mejs-container { |
|
1081 width: 100%; |
|
1082 max-width: 100%; |
|
1083 } |
|
1084 |
|
1085 /* =Media Queries |
|
1086 -------------------------------------------------------------- */ |
325 |
1087 |
326 /** |
1088 /** |
327 * HiDPI Displays |
1089 * HiDPI Displays |
328 */ |
1090 */ |
329 @media print, |
1091 @media print, |
330 (-o-min-device-pixel-ratio: 5/4), |
|
331 (-webkit-min-device-pixel-ratio: 1.25), |
1092 (-webkit-min-device-pixel-ratio: 1.25), |
332 (min-resolution: 120dpi) { |
1093 (min-resolution: 120dpi) { |
333 |
1094 .imgedit-wait { |
334 .image-align-none-label { |
1095 background-image: url(../images/spinner-2x.gif); |
335 background-image: url("../images/align-none-2x.png?ver=20120916"); |
1096 } |
336 background-size: 21px 15px; |
1097 } |
337 } |
1098 |
338 |
1099 @media screen and ( max-width: 782px ) { |
339 .image-align-left-label { |
1100 .wp_attachment_details label[for="content"] { |
340 background-image: url("../images/align-left-2x.png?ver=20120916"); |
1101 font-size: 14px; |
341 background-size: 22px 15px; |
1102 line-height: 1.5em; |
342 } |
1103 } |
343 |
1104 |
344 .image-align-center-label { |
1105 .media-upload-form .media-item.error, |
345 background-image: url("../images/align-center-2x.png?ver=20120916"); |
1106 .media-upload-form .media-item .error { |
346 background-size: 21px 15px; |
1107 font-size: 13px; |
347 } |
1108 line-height: 1.5; |
348 |
1109 } |
349 .image-align-right-label { |
1110 |
350 background-image: url("../images/align-right-2x.png?ver=20120916"); |
1111 .media-upload-form .media-item.error { |
351 background-size: 22px 15px; |
1112 padding: 1px 10px; |
352 } |
1113 } |
353 } |
1114 |
|
1115 .media-upload-form .media-item .error { |
|
1116 padding: 10px 0 10px 12px; |
|
1117 } |
|
1118 } |
|
1119 |
|
1120 /** |
|
1121 * Media queries for media grid. |
|
1122 */ |
|
1123 |
|
1124 @media only screen and (max-width: 1120px) { |
|
1125 /* override for media-views.css */ |
|
1126 #wp-media-grid .wp-filter .attachment-filters { |
|
1127 max-width: 100%; |
|
1128 } |
|
1129 } |
|
1130 |
|
1131 @media only screen and ( max-width: 782px ) { |
|
1132 .media-frame.mode-select .attachments-browser.fixed .media-toolbar { |
|
1133 top: 46px; |
|
1134 right: 10px; |
|
1135 } |
|
1136 } |
|
1137 |
|
1138 @media only screen and (max-width: 600px) { |
|
1139 .media-frame.mode-select .attachments-browser.fixed .media-toolbar { |
|
1140 top: 0; |
|
1141 } |
|
1142 } |
|
1143 |
|
1144 @media only screen and (max-width: 480px) { |
|
1145 .edit-attachment-frame .media-frame-title { |
|
1146 right: 110px; |
|
1147 } |
|
1148 |
|
1149 .upload-php .media-modal-close, |
|
1150 .edit-attachment-frame .edit-media-header .left, |
|
1151 .edit-attachment-frame .edit-media-header .right { |
|
1152 width: 40px; |
|
1153 height: 40px; |
|
1154 } |
|
1155 |
|
1156 .upload-php .media-modal-close .media-modal-icon { |
|
1157 margin: 9px 10px; |
|
1158 } |
|
1159 |
|
1160 .edit-attachment-frame .edit-media-header .right:before, |
|
1161 .edit-attachment-frame .edit-media-header .left:before { |
|
1162 line-height: 40px !important; |
|
1163 } |
|
1164 |
|
1165 .edit-attachment-frame .edit-media-header .left { |
|
1166 right: 82px; |
|
1167 } |
|
1168 |
|
1169 .edit-attachment-frame .edit-media-header .right { |
|
1170 right: 41px; |
|
1171 } |
|
1172 |
|
1173 .edit-attachment-frame .media-frame-content { |
|
1174 top: 40px; |
|
1175 } |
|
1176 |
|
1177 .edit-attachment-frame .attachment-media-view { |
|
1178 float: none; |
|
1179 height: auto; |
|
1180 width: 100%; |
|
1181 } |
|
1182 |
|
1183 .edit-attachment-frame .attachment-info { |
|
1184 height: auto; |
|
1185 width: 100%; |
|
1186 } |
|
1187 } |
|
1188 |
|
1189 @media only screen and (max-width: 640px), screen and (max-height: 400px) { |
|
1190 .upload-php .mode-grid .media-sidebar{ |
|
1191 max-width: 100%; |
|
1192 } |
|
1193 } |