PluginProbe
WP Ultimate Post Grid / 1.7.2
WP Ultimate Post Grid v1.7.2
4.1.1 trunk 1.5 1.6 1.7 1.7.1 1.7.2 1.8 1.9 2.0 2.1 2.2 2.3 2.4.0 2.5.0 2.6.0 2.7.0 2.8.0 2.8.2 3.0.0 3.3.0 3.4.0 3.5.0 3.6.0 3.7.0 All 32 releases
wp-ultimate-post-grid / vendor / vafpress / public / css / metabox.css

metabox.css in WP Ultimate Post Grid 1.7.2, at vendor/vafpress/public/css/metabox.css

531 lines 12.9 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 .vp-metabox *,.vp-metabox *:before,.vp-metabox *:after {
2 -webkit-box-sizing: border-box;
3 -moz-box-sizing: border-box;
4 -ms-box-sizing: border-box;
5 box-sizing: border-box;
6 }
7 .vp-metabox .vp-hide {
8 position: absolute !important;
9 border: 0;
10 clip: rect(0 0 0 0);
11 height: 0;
12 margin: -1px;
13 overflow: hidden;
14 padding: 0;
15 width: 0 !important;
16 }
17 .vp-metabox img {
18 max-width: 100%;
19 vertical-align: bottom;
20 }
21 .vp-metabox .vp-button {
22 height: 30px;
23 line-height: 28px;
24 margin: 0;
25 padding: 0 12px;
26 }
27 .vp-metabox-error {
28 background-image: url('../img/vp-sprite.png');
29 background-repeat: no-repeat;
30 background-position: 0px -240px;
31 margin-right: 5px;
32 margin-left: 5px;
33 *display: inline;
34 *zoom: 1;
35 display: inline-block;
36 height: 14px;
37 width: 14px;
38 vertical-align: middle;
39 float: left;
40 }
41 .vp-metabox .vp-field {
42 display: table;
43 table-layout: fixed;
44 width: 100%;
45 }
46 .vp-metabox .vp-field .label {
47 display: table-cell;
48 padding: 10px 20px;
49 vertical-align: top;
50 width: 20%;
51 }
52 #postbox-container-1 .vp-metabox .vp-field,#postbox-container-1 .vp-metabox .vp-field .label,#postbox-container-1 .vp-metabox .vp-field .field {
53 display: block;
54 width: auto;
55 }
56 #postbox-container-1 .vp-metabox .vp-field {
57 margin: 15px 0;
58 }
59 #postbox-container-1 .vp-metabox .vp-field .label {
60 margin-bottom: 3px;
61 }
62 #postbox-container-1 .vp-metabox .vp-field .label,#postbox-container-1 .vp-metabox .vp-field .field {
63 padding: 0 10px;
64 }
65 #postbox-container-1 .vp-metabox .vp-field .label label {
66 margin: 0;
67 }
68 #postbox-container-1 .vp-metabox .vp-wpa-loop {
69 padding: 10px 0;
70 }
71 .vp-metabox .vp-field .label label {
72 cursor: default;
73 font-size: 1em;
74 font-weight: bold;
75 line-height: 1.4em;
76 margin: 6px 0 4px;
77 display: block;
78 }
79 .vp-metabox .vp-field .label .description {
80 font-size: 0.9em;
81 color: #999999;
82 line-height: 1.3em;
83 }
84 .vp-metabox .vp-field .label .description p {
85 margin: 0;
86 }
87 .vp-metabox .vp-field .field {
88 display: table-cell;
89 padding: 10px 20px;
90 width: 80%;
91 position: relative;
92 }
93 .vp-metabox .vp-field .field .validation-msgs ul {
94 margin: 0px;
95 }
96 .vp-metabox .vp-field .field .input img {
97 border-width: 1px;
98 border-style: solid;
99 border-color: #dddddd;
100 border-radius: 3px;
101 padding: 3px;
102 }
103 .vp-metabox .vp-field .field .input {
104 position: relative;
105 }
106 .vp-metabox .vp-field.vp-error {
107 background-color: #fbf1f1;
108 }
109 .vp-metabox .vp-field .validation-msgs {
110 color: #cc0000;
111 font-weight: bold;
112 }
113 .vp-metabox .vp-field .validation-msgs li {
114 margin: 5px 0 0;
115 }
116 .vp-metabox .vp-wpa-loop {
117 border-radius: 3px;
118 padding: 10px; /*margin-top: 10px;
119 */
120 }
121 .vp-metabox .vp-wpa-loop h4 {
122 color: #999999;
123 margin: 10px 0px 10px;
124 padding: 0px 10px;
125 text-transform: uppercase;
126 }
127 .vp-metabox .vp-wpa-loop .vp-wpa-group {
128 background: #ffffff;
129 border: 1px solid #e5e5e5;
130 border-radius: 3px;
131 margin-bottom: 10px;
132 position: relative;
133 overflow: hidden;
134 }
135 .vp-metabox .vp-wpa-loop .vp-wpa-group .vp-controls {
136 padding-top: 10px;
137 display: inline-block;
138 width: 100%;
139 position: relative;
140 }
141 .vp-metabox .vp-wpa-loop .vp-wpa-group .vp-controls .vp-field .label {
142 padding: 12px 10px;
143 }
144 .vp-metabox .vp-wpa-loop .vp-wpa-group .vp-controls .vp-field .field {
145 padding: 10px 10px 10px 20px;
146 }
147 .vp-metabox .vp-wpa-loop .vp-wpa-group .vp-wpa-group-heading .vp-wpa-group-title {
148 display: block;
149 }
150 .vp-metabox .vp-wpa-loop .vp-wpa-group .vp-wpa-group-heading {
151 background-color: #f9f9f9;
152 border-bottom: 1px solid #e5e5e5;
153 font-size: 0.9em;
154 font-weight: bold;
155 line-height: 30px;
156 padding: 0 10px;
157 text-transform: uppercase;
158 margin-bottom: -1px;
159 }
160 .vp-metabox .vp-wpa-loop.vp-repeating-loop .vp-wpa-group .vp-wpa-group-heading {
161 padding-right: 80px;
162 }
163 .vp-metabox .vp-wpa-loop .vp-wpa-group .vp-wpa-group-heading a {
164 text-decoration: none;
165 }
166 .vp-metabox .vp-wpa-loop .vp-wpa-group .vp-wpa-group-remove {
167 position: absolute;
168 top: 0;
169 right: 0;
170 margin: 0 10px;
171 }
172 .vp-metabox .vp-wpa-loop .vp-wpa-group .vp-wpa-group-remove a:hover {
173 color: #990000;
174 }
175 .vp-metabox .vp-wpa-loop .vp-wpa-group-add {
176 margin-bottom: 8px;
177 }
178 .vp-metabox .vp-wpa-loop .vp-wpa-group-add > a {
179 display: block;
180 text-align: center;
181 }
182 .vp-metabox .vp-textbox .field input[type="text"],.vp-metabox .vp-slider .field input[type="text"],.vp-metabox .vp-upload .field input[type="text"],.vp-metabox .vp-date .field input[type="text"],.vp-metabox .vp-textarea .field textarea,.vp-metabox .vp-color .field input[type="text"] {
183 border-color: #cccccc;
184 padding: 6px 10px;
185 margin: 0;
186 border-radius: 3px;
187 }
188 .vp-metabox .vp-textbox .field input[type="text"],.vp-metabox .vp-upload .field input[type="text"],.vp-metabox .vp-textarea .field textarea {
189 width: 100%;
190 }
191 /* CHECKBOX & RADIOBUTTON & TOGGLE */
192 .vp-metabox .vp-checkbox .input label,.vp-metabox .vp-radiobutton .input label {
193 margin-right: 20px;
194 }
195 .vp-metabox .vp-checkbox .input label input,.vp-metabox .vp-radiobutton .input label input {
196 margin-right: 3px;
197 }
198 .vp-metabox .vp-toggle .field .input label,.vp-metabox .vp-checkbox .field .input label,.vp-metabox .vp-radiobutton .field .input label {
199 *display: inline;
200 *zoom: 1;
201 display: inline-block;
202 margin-top: 6px;
203 line-height: 1.4em;
204 }
205 /* UPLOAD */
206 .vp-metabox .vp-upload .input {
207 padding-right: 130px;
208 }
209 .vp-metabox .vp-upload .buttons {
210 position: absolute;
211 top: 0px;
212 right: 0px;
213 }
214 .vp-metabox .vp-upload .image {
215 max-width: 300px;
216 }
217 .vp-metabox .vp-upload .field .image {
218 line-height: 0em;
219 }
220 .vp-metabox .vp-upload .field .image img {
221 margin-top: 10px;
222 }
223 .vp-metabox .vp-upload .field .image img[src=""] {
224 display: none;
225 }
226 /* CHECKIMAGE & RADIOIMAGE */
227 .vp-metabox .vp-checkimage .input label,.vp-metabox .vp-radioimage .input label {
228 *display: inline;
229 *zoom: 1;
230 display: inline-block;
231 margin: 5px;
232 vertical-align: top;
233 }
234 .vp-metabox .vp-checkimage label input,.vp-metabox .vp-radioimage label input {
235 display: none;
236 }
237 /* elt ie8 style */
238 .vp-metabox .vp-checkimage .field input:checked ~ img,.vp-metabox .vp-radioimage .field input:checked ~ img,.vp-metabox .vp-checkimage .field input.checked ~ img,.vp-metabox .vp-radioimage .field input.checked ~ img {
239 border-color: #278ab7;
240 background-color: #278ab7;
241 }
242 /* COLOR */
243 .vp-metabox .vp-color .field input[type="text"] {
244 padding-left: 30px;
245 }
246 .vp-metabox .vp-color .field label {
247 background-image: url('../img/vp-sprite.png');
248 background-position: 0 -140px;
249 display: block;
250 height: 20px;
251 left: 0px;
252 margin: 5px;
253 position: absolute;
254 top: 0px;
255 width: 20px;
256 }
257 .vp-metabox .vp-color .field label span {
258 display: block;
259 height: 100%;
260 width: 100%;
261 }
262 /* SLIDER */
263 .vp-metabox .vp-slider .input {
264 padding: 10px 80px 10px 0;
265 }
266 .vp-metabox .vp-slider .input .slidebar {
267 width: 100%;
268 }
269 .vp-metabox .vp-slider .input .slideinput {
270 position: absolute;
271 top: 0px;
272 right: 0px;
273 width: 60px;
274 margin-top: -5px;
275 }
276 /* SELECT & FONTAWESOME */
277 .vp-metabox .vp-select .field .input a,.vp-metabox .vp-fontawesome .field .input a {
278 height: 30px;
279 border-radius: 3px;
280 border: 1px solid #cccccc;
281 }
282 .vp-metabox .vp-select .field .input a div,.vp-metabox .vp-fontawesome .field .inpu a div {
283 border-left-color: #cccccc;
284 }
285 .vp-metabox .vp-select .field .input .select2-dropdown-open a,.vp-metabox .vp-fontawesome .field .input .select2-dropdown-open a {
286 -webkit-box-shadow: 0 4px 5px rgba(0,0,0,0.15);
287 box-shadow: 0 4px 5px rgba(0,0,0,0.15);
288 }
289 .vp-metabox .vp-select .field .input .select2-dropdown-open.select2-drop-above a,.vp-metabox .vp-fontawesome .field .input .select2-dropdown-open.select2-drop-above a {
290 -webkit-box-shadow: 0 -4px 5px rgba(0,0,0,0.15);
291 box-shadow: 0 -4px 5px rgba(0,0,0,0.15);
292 }
293 /* SORTER & MULTISELECT */
294 .vp-metabox .vp-multiselect .search-field input,.vp-metabox .vp-sorter .search-field input {
295 height: auto;
296 }
297 .vp-metabox .vp-sorter .field .input li {
298 display: block;
299 float: none;
300 margin: 3px 5px;
301 height: 22px;
302 }
303 .vp-metabox .vp-sorter .field .input ul,.vp-metabox .vp-multiselect .field .input ul {
304 border-radius: 3px;
305 border: 1px solid #cccccc;
306 }
307 .vp-metabox .vp-multiselect .field .input .select2-dropdown-open ul,.vp-metabox .vp-sorter .field .input .select2-dropdown-open ul {
308 -webkit-box-shadow: 0 4px 5px rgba(0,0,0,0.15);
309 box-shadow: 0 4px 5px rgba(0,0,0,0.15);
310 }
311 .vp-metabox .vp-multiselect .field .input .select2-dropdown-open.select2-drop-above ul,.vp-metabox .vp-sorter .field .input .select2-dropdown-open.select2-drop-above ul {
312 -webkit-box-shadow: 0 -4px 5px rgba(0,0,0,0.15);
313 box-shadow: 0 -4px 5px rgba(0,0,0,0.15);
314 }
315 /* TEXTAREA */
316 .vp-metabox .vp-textarea textarea {
317 width: 100%;
318 -webkit-resize: vertical;
319 -moz-resize: vertical;
320 resize: vertical;
321 min-height: 100px;
322 max-height: 200px;
323 }
324 /* WP TinyMCE Editor */
325 .vp-metabox .vp-wpeditor .label,.vp-metabox .vp-wpeditor .field {
326 display: block;
327 padding: 0px 10px !important;
328 width: 100%;
329 }
330 .vp-metabox .customEditor {
331 margin: 15px 0px;
332 }
333 .vp-metabox .customEditor textarea {
334 width: 100%;
335 margin: 0;
336 -webkit-border-top-right-radius: 0;
337 -webkit-border-top-left-radius: 0;
338 border-top-left-radius: 0;
339 border-top-right-radius: 0;
340 }
341 .vp-metabox .custom_upload_buttons a {
342 text-decoration: none;
343 }
344 .vp-metabox .wp_themeSkin table.mceLayout {
345 background: white;
346 border-width: 1px;
347 border-style: solid;
348 -webkit-border-top-right-radius: 3px;
349 -webkit-border-top-left-radius: 3px;
350 border-top-right-radius: 3px;
351 border-top-left-radius: 3px;
352 border-color: #CCC #CCC #DFDFDF;
353 }
354 .vp-metabox .mceLayout span {
355 display: inline;
356 }
357 .vp-metabox .customEditor * {
358 -webkit-box-sizing: content-box;
359 -moz-box-sizing: content-box;
360 -ms-box-sizing: content-box;
361 box-sizing: content-box;
362 }
363 .vp-metabox .vp-wpeditor .field .customEditor .mceIcon img {
364 border-width: 0;
365 padding: 0;
366 }
367 /* HTML PREVIEW */
368 .vp-metabox .vp-html .field .input {
369 overflow: auto;
370 }
371 .vp-metabox .vp-html .field .vp-field-loader {
372 position: absolute;
373 width: 100%;
374 height: 100%;
375 background-color: #f9f9f9;
376 text-align: center;
377 top: 0;
378 }
379 .vp-metabox .vp-wpa-loop .vp-html .field .vp-field-loader {
380 background-color: #ffffff;
381 }
382 .vp-metabox .vp-html .field .vp-field-loader img {
383 position: absolute;
384 top: 50%;
385 left: 50%;
386 margin: -5px 0 0 -8px;
387 }
388 /**
389 * Notebox styling
390 * (normal, warning, info, error, success)
391 */
392 .vp-metabox .vp-field.vp-notebox {
393 border-width: 1px;
394 border-style: solid;
395 border-radius: 3px;
396 display: block;
397 padding: 10px 20px 10px 55px;
398 position: relative;
399 margin: 10px 0;
400 min-height: 50px;
401 width: auto;
402 }
403 .vp-metabox .vp-field.vp-notebox > i {
404 display: block;
405 font-size: 30px;
406 line-height: 1em;
407 left: 0;
408 margin: 9px;
409 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
410 filter: alpha(opacity=30);
411 opacity: 0.3;
412 position: absolute;
413 text-align: center;
414 top: 0;
415 width: 30px;
416 }
417 .vp-metabox .vp-field.vp-notebox > .label {
418 display: block;
419 width: auto;
420 padding: 0 !important;
421 font-weight: bold;
422 }
423 .vp-metabox .vp-field.vp-notebox > .description {
424 padding: 0;
425 color: inherit;
426 }
427 .vp-metabox .vp-field.vp-notebox > .description p {
428 margin: 0;
429 }
430 .vp-metabox .vp-field.vp-notebox.note-normal {
431 background-color: #eeeeee;
432 border-color: #cccccc;
433 color: #666666;
434 }
435 .vp-metabox .vp-field.vp-notebox.note-info {
436 background-color: #d1e4f3;
437 border-color: #a8b6c1;
438 color: #5881a1;
439 }
440 .vp-metabox .vp-field.vp-notebox.note-success {
441 background-color: #c4ec94;
442 border-color: #70ad60;
443 color: #4d751c;
444 }
445 .vp-metabox .vp-field.vp-notebox.note-warning {
446 background-color: #fee9a6;
447 border-color: #d9c183;
448 color: #978138;
449 }
450 .vp-metabox .vp-field.vp-notebox.note-error {
451 background-color: #ffa2a3;
452 border-color: #bc515b;
453 color: #9c1825;
454 }
455 .vp-metabox .vp-wpa-group .vp-field.vp-notebox {
456 margin: 10px 10px;
457 }
458 /**
459 * Code Editor styling
460 */
461 .ace_editor {
462 border-width: 1px;
463 border-style: solid;
464 border-color: #dddddd;
465 border-radius: 3px;
466 height: 200px;
467 }
468
469 /* Extension
470 * ==================================================== */
471
472 /* jQuery UI Datepicker bottom div bug */
473 #ui-datepicker-div {
474 display: none;
475 }
476 /* jQuery UI widget overlay glitch */
477 .ui-widget-overlay {
478 background-repeat: repeat;
479 }
480 /* Bootstrap Colorpicker */
481 .dropdown-menu {
482 position: absolute;
483 top: 100%;
484 left: 0;
485 z-index: 1000;
486 display: none;
487 float: left;
488 min-width: 160px;
489 margin: 2px 0 0;
490 list-style: none;
491 background-color: #ffffff;
492 border: 1px solid #cccccc;
493 border: 1px solid rgba(0,0,0,0.2);
494 *border-right-width: 2px;
495 *border-bottom-width: 2px;
496 border-radius: 3px;
497 -webkit-box-shadow: 0 5px 10px rgba(0,0,0,0.2);
498 box-shadow: 0 5px 10px rgba(0,0,0,0.2);
499 -webkit-background-clip: padding-box;
500 -moz-background-clip: padding-box;
501 background-clip: padding-box;
502 }
503 /* fontawesome chooser + select2 width */
504 .select2-container .fontawesome,.select2-result-label .fontawesome {
505 font-size: 12px;
506 vertical-align: middle;
507 }
508 .select2-container .fontawesome i,.select2-result-label .fontawesome i {
509 font-size: 14px;
510 margin-right: 8px;
511 }
512 .select2-container {
513 width: 100%;
514 }
515 .select2-drop {
516 border-color: #cccccc;
517 padding-top: 10px;
518 margin-top: -2px;
519 }
520 .select2-drop.select2-drop-above {
521 margin-top: 4px;
522 padding-top: 0;
523 padding-bottom: 10px;
524 border-top-color: #cccccc;
525 }
526 .select2-drop input {
527 border-color: #cccccc;
528 }
529 .select2-results .select2-highlighted {
530 background: #278ab7;
531 }