PluginProbe ʕ •ᴥ•ʔ
Widget Options – Advanced Conditional Visibility for Gutenberg Blocks & Classic Widgets / 3.8
Widget Options – Advanced Conditional Visibility for Gutenberg Blocks & Classic Widgets v3.8
4.2.5 4.2.4 trunk 3.7.10 3.7.11 3.7.12 3.7.13 3.7.14 3.7.2 3.7.5 3.7.6 3.7.7 3.7.8 3.7.9 3.8 3.8.1 3.8.10 3.8.2 3.8.3 3.8.4 3.8.5 3.8.6 3.8.7 3.8.8 3.8.9 3.8.9.1 3.9.0 3.9.1 3.9.2 3.9.3 3.9.4 3.9.5 3.9.6 4.0.0 4.0.1 4.0.2 4.0.3 4.0.4 4.0.5 4.0.5.1 4.0.6 4.0.6.1 4.0.7 4.0.8 4.0.9 4.1.0 4.1.1 4.1.2 4.1.3 4.2.0 4.2.1 4.2.2 4.2.3
widget-options / assets / css / admin.css
widget-options / assets / css Last commit date
jqueryui 9 years ago admin.css 4 years ago animate.min.css 9 years ago beaver-widgetopts.css 8 years ago select2.min.css 8 years ago welcome.css 9 years ago widget-options.css 4 years ago
admin.css
983 lines
1 .extended-widget-opts-form{
2 margin-left: -15px;
3 margin-right: -15px;
4 clear: both;
5 }
6 .widgetopts-subtitle{
7 display: block;
8 text-align: center;
9 font-weight: bold;
10 border-top: 1px solid #ddd;
11 border-bottom: 1px solid #ddd;
12 background: #fafafa;
13 padding: 10px 0px;
14 margin: 5px 0px 10px;
15 }
16 .opts-label-small{
17 font-size: 13px;
18 }
19 .widget-opts-animation label{
20 font-weight: bold;
21 }
22 .so-content.panel-dialog .extended-widget-opts-form{
23 /*display: none;*/
24 }
25 .extended-widget-opts-form .alright{
26 text-align:right;
27 }
28 .extended-widget-opts-form.extended-widget-opts-form-large .ui-tabs-nav .dashicons{
29 display: none;
30 }
31 .extended-widget-opts-form.extended-widget-opts-form-small .ui-tabs-nav .dashicons{
32 display: inline-block;
33 }
34 .extended-widget-opts-form.extended-widget-opts-form-small .tabtitle{
35 display: none;
36 }
37 .extended-widget-opts-tabs.ui-widget, .extended-widget-opts-inside-tabs.ui-widget{
38 border: 0px !important;
39 background: transparent !important;
40 border-radius: 0px !important;
41 font-family: "Open Sans",sans-serif;
42 }
43 .extended-widget-opts-tabs .ui-tabs-nav{
44 border: 0px !important;
45 border-bottom: 1px solid #e5e5e5 !important;
46 background: transparent !important;
47 border-radius: 0px !important;
48 padding: 0px !important;
49 }
50 .extended-widget-opts-tabs .ui-tabs-nav li{
51 float: left !important;
52 margin-left: 1px !important;
53 margin-bottom: 0px !important;
54 margin-right: 2px !important;
55
56 border: 0px !important;
57 background: transparent !important;
58 border-radius: 0px !important;
59 }
60 .extended-widget-opts-tabs .ui-tabs-nav li:first-child{
61 margin-left: 5px !important;
62 }
63 .extended-widget-opts-tabs .ui-tabs-nav li:last-child{
64 margin-right: 0px !important;
65 }
66 .extended-widget-opts-tabs .ui-tabs-nav li:last-of-type{
67 margin-right: 0px !important;
68 }
69 .extended-widget-opts-tabs .ui-tabs-nav li.ui-tabs-active{
70 margin-bottom: -1px !important;
71 }
72 .extended-widget-opts-tabs .ui-tabs-nav li a{
73 display: block !important;
74 padding: 7px 4px 8px !important;
75 font-size: 12px !important;
76 background: #fafafa !important;
77 color: #444 !important;
78 text-decoration: none !important;
79 border: 1px solid #e5e5e5 !important;
80 border-bottom: 0px !important;
81 border-top-left-radius: 2px !important;
82 border-top-right-radius: 2px !important;
83 font-weight: normal !important;
84 }
85 .extended-widget-opts-form-large .extended-widget-opts-tabs .ui-tabs-nav li a{
86 padding: 7px 8px 8px !important;
87 }
88 .extended-widget-opts-tabs .ui-tabs-nav li.ui-tabs-active a{
89 margin-bottom: -1px !important;
90 padding-bottom: 9px !important;
91 box-shadow: none !important;
92 background: #fff !important;
93 }
94 .extended-widget-opts-tabs .ui-tabs-nav li .dashicons{
95 height: 15px !important;
96 font-size: 15px !important;
97 }
98 .extended-widget-opts-tabcontent{
99 padding: 0px 15px 15px 15px;
100 }
101 .extended-widget-opts-form .form-table td{
102 padding: 5px;
103 /*text-align: center;*/
104 }
105 .extended-widget-opts-inner-lists, .extended-widget-opts-class-lists, .extended-widget-opts-inner-roles{
106 display: block;
107 width: 100%;
108 height: 230px !important;
109 padding: 5px 8px !important;
110 overflow: auto;
111 border: 1px solid #dfdfdf;
112 margin-bottom: 5px;
113 box-sizing: border-box;
114 }
115 .extended-widget-opts-class-lists, .extended-widget-opts-inner-roles{
116 height: auto !important;
117 max-height: 230px !important;
118 }
119 .extended-widget-opts-inner-lists h4, .extended-widget-opts-inner-lists h4:hover{
120 cursor: pointer;
121 }
122 .extended-widget-opts-inner-lists small{
123 opacity: 0.5;
124 font-weight: normal;
125 font-size: 11px;
126 }
127 .extended-widget-opts-clearfix{
128 clear: both;
129 }
130 .extended-widget-opts-tabcontent.extended-widget-opts-inside-tabcontent{
131 padding: 10px 5px !important;
132 }
133 .extended-widget-opts-inside-tabcontent .extended-widget-opts-inner-tabcontent{
134 border: 1px solid #dddddd !important;
135 border-top: 0px !important;
136 padding: 10px !important;
137 }
138 .extended-widget-opts-inside-tabcontent .extended-widget-opts-styling-tabcontent tr td:last-child{
139 min-width: 117px;
140 }
141 .extended-widget-opts-inside-tabcontent .extended-widget-opts-styling-tabcontent p{
142 text-align: center;
143 }
144 .extended-widget-opts-inner-tabcontent.extended-widget-opts-visibility-tabcontent{
145 text-align: left;
146 }
147 .extended-widget-opts-inside-tabs .ui-tabs-nav li:first-child{
148 margin-left: 0px !important;
149 }
150 .extended-widget-opts-inside-tabs .ui-tabs-nav li a{
151 padding: 8px !important;
152 }
153 .widget-opts-toggle-note{
154 display: none;
155 }
156 .widget-opts-toggler-note{
157 font-size: 11px;
158 color: #0073aa !important;
159 }
160 .widgetops-sc-opts{
161 font-size: 12px;
162 }
163 .widgetops-sc-opts code{
164 font-size: 11px;
165 }
166
167 .widget-opts-learnmore{
168 text-decoration: none;
169 }
170
171 .extended-widget-opts-tabs .ui-tabs-nav li.ui-tabs-active.extended-widget-gopro-tab-alignment a{
172 background-color: #FFF1B8 !important;
173 }
174 .extended-widget-opts-tabcontent-gopro{
175 background-color: #FFF1B8 !important;
176 color: #444;
177 margin-bottom: 15px;
178 }
179 .extended-widget-opts-tabcontent-gopro li{
180 font-size: 12px;
181 line-height: 24px;
182 }
183 body .extended-widget-opts-tabs .extended-widget-gopro-tab-alignment a{
184 font-weight: bold !important;
185 padding-left: 9px !important;
186 padding-right: 9px !important;
187 }
188 .widgetopts-unlock-features{
189 text-align: center;
190 font-size: 16px;
191 font-weight: bold;
192 line-height: 28px;
193 }
194 .widgetopts-unlock-features .dashicons{
195 font-size: 23px;
196 margin-right: 10px;
197 }
198
199 /* customizer fix */
200 #customize-theme-controls .ui-tabs .ui-tabs-panel.extended-widget-opts-tabcontent{
201 min-width: 100%;
202 -webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;
203 }
204 #customize-theme-controls .extended-widget-opts-form .ui-tabs-nav .dashicons{
205 display: inline-block;
206 }
207 #customize-theme-controls .extended-widget-opts-form .tabtitle{
208 display: none;
209 }
210 #customize-theme-controls .extended-widget-opts-form .ui-tabs .ui-tabs-nav li a{
211 line-height: 16px !important;
212 }
213 #customize-theme-controls .extended-widget-opts-form .extended-widget-opts-tabcontent-styling .inputsize5{
214 max-width: 50px;
215 }
216 #customize-theme-controls .widget-inside .widget-control-actions .widgetopts-control{
217 display: none !important;
218 }
219
220 /** Settings Page **/
221 .widgetopts-settings-desc{
222 margin: 20px 200px 20px 0;
223 min-height: 50px;
224 color: #555d66;
225 font-size: 15px;
226 line-height: 22px;
227 }
228 .widgetopts-mascot{
229 display: block;
230 text-align: center;
231 height: 150px;
232 width: 150px;
233 background: url('../images/logo-mascot.png');
234 -webkit-background-size: cover;
235 -moz-background-size: cover;
236 -o-background-size: cover;
237 background-size: cover;
238 }
239 .widgetopts-badge-settings{
240 position: absolute;
241 top: 10px;
242 right: 10px;
243 }
244 .opts-classes-setting-table tr strong{
245 display: inline-block;
246 min-width: 150px;
247 }
248 .opts-hidden-placeholder{
249 display: none;
250 }
251 .opts-add-class-btn .dashicons{
252 text-decoration: none !important;
253 line-height: 29px;
254 height: 29px;
255 }
256 .opts-remove-class-btn .dashicons{
257 text-decoration: none !important;
258 line-height: 18px;
259 height: 18px;
260 color: #b20820;
261 }
262 #opts-predefined-classes{
263 padding: 0px 10px;
264 }
265 #opts-predefined-classes .opts-li-value{
266 display: inline-block;
267 margin-right: 10px;
268 }
269 .widgetopts-sidebar-widget .email{
270 border: 1px solid #ddd;
271 }
272
273 #widgetopts-sidebar-widget-more_plugins table td{
274 width: 50%;
275 vertical-align: top;
276 text-align: center;
277 }
278 #widgetopts-sidebar-widget-more_plugins .dashicons{
279 font-size: 30px;
280 height: 30px;
281 width: 30px;
282 margin-bottom: 5px;
283 }
284 #widgetopts-sidebar-widget-more_plugins td a{
285 text-decoration: none;
286 color: #444;
287 background: #f3f3f3;
288 display: block;
289 padding: 8px 5px;
290 border-radius: 3px;
291 font-size: 13px;
292 }
293 #widgetopts-sidebar-widget-more_plugins td a:hover{
294 background: #ddd;
295 }
296
297 /** Modular Settings Page **/
298 .widgetopts-poststuff #post-body #postbox-container-1, .widgetopts-poststuff #post-body #postbox-container-2{
299 border-top: 1px solid #ddd;
300 padding-top: 20px;
301 }
302 .widgetopts-poststuff #post-body #postbox-container-2{
303 border-right: 1px solid #ddd;
304 box-sizing: border-box;
305 padding-right: 20px;
306 }
307 .widgetopts-poststuff #post-body #postbox-container-1{
308 box-sizing: border-box;
309 margin-right: -300px;
310 padding-left: 20px;
311 width: 300px;
312 }
313 .widgetopts-module-section-heading{
314 display: block;
315 margin: 0 0 1em 0;
316 overflow: hidden;
317 }
318 .widgetopts-settings-view-toggle{
319 float: left;
320 margin-right: 1em;
321 padding: .35em 0;
322 }
323 .widgetopts-settings-view-toggle a{
324 text-decoration: none;
325 color: #b4b9be;
326 }
327 .widgetopts-settings-view-toggle a.widgetopts-selected{
328 color: #0073aa;
329 }
330 .widgetopts-module-cards-container {
331 clear: both;
332 box-sizing: border-box;
333 }
334 .widgetopts-module-cards{
335 text-align: justify;
336 font-size: 0.1px;
337 }
338 .widgetopts-module-cards:after{
339 content: '';
340 display: inline-block;
341 width: 100%;
342 }
343 .widgetopts-module-card{
344 font-size: 16px;
345 display: inline-block;
346 width: 100%;
347 max-width: 32%;
348 text-align: left;
349 margin-bottom: 12px;
350 vertical-align: top;
351 }
352 .widgetopts-module-card-content{
353 font-size: 16px;
354 position: relative;
355 background: #fff;
356 border: 1px solid #ddd;
357 /*box-shadow: 1px 1px 0px rgba(0, 0, 0, .1);*/
358 padding: 1em;
359 }
360 .widgetopts-module-type-enabled .widgetopts-module-card-content{
361 background: #f7fcfe;
362 border-color: rgba( 0, 115, 179, 0.85 );
363 /*box-shadow: 1px 1px 0px rgba(0,0,0,.1);*/
364 }
365 .widgetopts-module-type-disabled .widgetopts-settings-section,
366 .widgetopts-module-type-disabled .widgetopts-module-settings-save,
367 .widgetopts-module-card.widgetopts-module-card-no-settings .widgetopts-module-settings-save{
368 display: none;
369 }
370 #poststuff .widgetopts-module-card h2{
371 font-size: 16px;
372 margin: 0;
373 padding: 0;
374 }
375 .widgetopts-modal-background{
376 display: none;
377 position: fixed;
378 top: 0;
379 right: 0;
380 bottom: 0;
381 left: 0;
382 background: rgba(0,0,0,0.2);
383 z-index: 500;
384 cursor: pointer;
385 }
386 .grid .widgetopts-module-settings-container{
387 display: none;
388 position: fixed;
389 top: 52px;
390 right: 20px;
391 bottom: 20px;
392 left: 20px;
393 margin-left: 160px;
394 background: #fff;
395 box-shadow: 0 0 20px rgba(0,0,0,0.2);
396 z-index: 510;
397 }
398 .widgetopts-modal-navigation{
399 position: absolute;
400 top: 0;
401 left: 0;
402 right: 0;
403 height: 40px;
404 border-bottom: 1px solid #ddd;
405 }
406 .widgetopts-modal-navigation button{
407 width: 40px;
408 height: 40px;
409 float: right;
410 background: #fff;
411 border: none;
412 outline: none;
413 border-left: 1px solid #ddd;
414 font-family: dashicons;
415 font-size: 20px;
416 }
417 .widgetopts-modal-navigation button:hover{
418 cursor: pointer;
419 background: #eee;
420 }
421 .widgetopts-modal-navigation button.widgetopts-close-modal:before{
422 content: '\f335';
423 }
424 .widgetopts-modal-content-footer{
425 position: absolute;
426 bottom: 0;
427 left: 0;
428 right: 0;
429 border-top: 1px solid #ddd;
430 padding: 15px;
431 background: #efefef;
432 box-shadow: 0 -5px 15px rgba(0,0,0,0.1);
433 }
434 .widgetopts-modal-content-footer .align-right{
435 float: right;
436 }
437 .grid .widgetopts-module-settings-content-container{
438 position: absolute;
439 top: 40px;
440 right: 0;
441 bottom: 60px;
442 left: 0;
443 overflow: auto;
444 padding: 25px 50px;
445 }
446 .widgetopts-module-settings-content{
447 width: 100%;
448 max-width: 700px;
449 margin: 0 auto;
450 }
451 .widgetopts-settings-section label{
452 font-weight: bold;
453 }
454 p.widgetopts-settings-section{
455 font-style: italic;
456 color: #999;
457 }
458 #widgetopts-settings-messages-container {
459 position: fixed;
460 padding: 2em;
461 top: -100px;
462 left: 0;
463 right: 0;
464 max-width: 300px;
465 width: 100%;
466 margin: auto;
467 z-index: 500;
468 -webkit-transition: all .3s ease-in-out;
469 transition: all .3s ease-in-out;
470 opacity: 0;
471 border-radius: 3px;
472 background: #fff;
473 box-shadow: 0px 0px 25px rgba( 0,0,0,0.4 );
474 }
475 #widgetopts-settings-messages-container div, .widgetopts-module-messages-container div{
476 background: #f1f1f1;
477 }
478 #widgetopts-settings-messages-container.visible:not(.no-module) {
479 top: 52px;
480 opacity: 1;
481 }
482 #widgetopts-settings-messages-container div:first-child {
483 margin-top: 0;
484 }
485 #widgetopts-settings-messages-container div:last-child{
486 margin-bottom: 0px;
487 }
488 .widgetopts-dashicons{
489 font-size: 180px;
490 position: absolute;
491 left: -27px;
492 top: -45px;
493 opacity: 0.1;
494 }
495 .widgetopts-no-top{
496 top: 0px;
497 }
498 .widgetopts-module-type-pro{
499 opacity: .5;
500 }
501 .widgetopts-pro-upsell{
502 display: block;
503 height: 100%;
504 left: 0;
505 position: absolute;
506 top: 0;
507 width: 100%;
508 text-decoration: none;
509 }
510 .widgetopts-pro-label{
511 padding: 2px 0px;
512 position: absolute;
513 right: 6px;
514 top: 5px;
515 opacity: 0.6;
516
517 background: #ffb310;
518 /*box-shadow: 1px 1px 1px rgba(0,0,0,0.2);*/
519 font-size: 11px;
520 color: #5e5018;
521 text-transform: uppercase;
522 }
523 .widgetopts-pro-label .dashicons{
524 font-size: 18px;
525 }
526 .grid .widgetopts-list-content-footer, .grid #widgetopts-save {
527 display: none;
528 }
529
530 /** list module view **/
531 .list .widgetopts-module-card{
532 max-width: 100%;
533 padding: 0;
534 float: none;
535 margin-bottom: 1px;
536 }
537 .list .widgetopts-module-card:hover .widgetopts-module-card-content{
538 background: #fafafa;
539 }
540 .list .widgetopts-module-card-content{
541 cursor: pointer;
542 padding: .5em .5em .5em .75em;
543 }
544 .list .widgetopts-module-card-content:after{
545 content: "";
546 display: table;
547 clear: both;
548 }
549 .list .widgetopts-module-desc{
550 display: none;
551 }
552 #poststuff .list .widgetopts-module-card h2{
553 float: left;
554 line-height: 1.8;
555 font-size: 14px;
556 }
557 .list .widgetopts-module-card-content .widgetopts-module-actions{
558 float: right;
559 margin-top: 0;
560 }
561 .list .widgetopts-module-settings-container{
562 clear: both;
563 background: #fff;
564 padding: 2em 2em 4em 2em;
565 -moz-box-shadow: inset 0 8px 8px -8px #ddd, inset 0 -8px 8px -8px #ddd;
566 -webkit-box-shadow: inset 0 8px 8px -8px #ddd, inset 0 -8px 8px -8px #ddd;
567 box-shadow: inset 0 8px 8px -8px #ddd, inset 0 -8px 8px -8px #ddd;
568 }
569 .list .widgetopts-modal-navigation, .list .widgetopts-modal-content-footer, .list .widgetopts-dashicons, .list .widgetopts-modal-header{
570 display: none;
571 }
572 .list .widgetopts-pro-label{
573 display: inline;
574 float: left;
575 font-size: 10px;
576 margin: 0em 0 0 10px;
577 padding: 0px 3px;
578 position: relative;
579 }
580
581 /** License form **/
582 table.widgetopts-settings-license td{
583 padding: 0px !important;
584 }
585 .widgetopts-settings-license .td-right{
586 text-align: right;
587 }
588 .widgetopts-settings-license .widgetopts-even td{
589 padding-top: 5px !important;
590 }
591 .widgetopts-settings-license .td-left{
592 font-size: 10px;
593 }
594 @media ( max-width: 1400px ) {
595 .widgetopts-module-card {
596 max-width: 49%;
597 }
598 }
599 @media ( max-width: 782px ) {
600 .grid .widgetopts-module-settings-container {
601 margin-left: 0px;
602 top: 0px;
603 left: 0;
604 right: 0;
605 bottom: 0;
606 z-index: 100000; /* to get above wp admin bar */
607 }
608 .grid .widgetopts-module-settings-content-container {
609 padding: 15px 30px;
610 }
611 .widgetopts-module-settings-content .widgetopts-dashicons{
612 display: none;
613 }
614 }
615 @media (max-width: 500px){
616 .widgetopts-module-card {
617 max-width: 100%;
618 padding-right: 0;
619 padding-bottom: 10px;
620 }
621 .widgetopts-settings-desc{
622 margin-right: 70px;
623 }
624 .widgetopts-badge-settings{
625 top: 115px;
626 }
627 .widgetopts-mascot{
628 height: 69px;
629 width: 69px;
630 }
631 .widgetopts-poststuff #post-body #postbox-container-2{
632 padding-right: 0px;
633 border-right: 0px;
634 }
635 .widgetopts-poststuff #post-body #postbox-container-1{
636 padding-left: 0px;
637 }
638 .grid .widgetopts-module-settings-container{
639 margin-left: 0px;
640 }
641 }
642
643 /** SO **/
644 .so-content .widgetops-sc-opts{
645 display: none;
646 }
647 .so-content .extended-widget-opts-tab-visibility,
648 .so-content .extended-widget-opts-tabcontent-visibility,
649 .so-content .widgetopts_id_fld{
650 display: none;
651 }
652
653 .widgetopts-license-status{
654 display: block;
655 width: 100%;
656 font-size: 12px;
657 font-style: italic;
658 padding-top: 8px;
659 }
660 .widgetopts-license-inactive{
661 color: #dc3232;
662 font-weight: bold;
663 }
664 span.widgetopts-license-active{
665 color: #46b450;
666 font-weight: bold;
667 }
668 .widgetopts-license-status{
669 display: none;
670 }
671 .widgetopts-license-expired{
672 display: block;
673 width: 100%;
674 padding: 5px;
675 color: #a94442;
676 background-color: #f2dede;
677 border:1px solid #ebccd1;
678 box-sizing: border-box;
679 border-radius: 4px;
680 margin-top: 8px;
681 }
682
683 /** Search **/
684 #widgetopts-widgets-filter{
685 width: 100%;
686 max-width: 250px;
687 position: relative;
688 display: block;
689 padding: 12px 0px 1px;
690 clear: both;
691 }
692 input#widgetopts-widgets-search{
693 width: 100%;
694 height: 30px;
695 padding: 6px 30px;
696 }
697 .widgetopts-search-icon{
698 display: block;
699 position: absolute;
700 top: 13px;
701 left: 2px;
702 width: 30px;
703 height: 30px;
704 line-height: 28px;
705 text-align: center;
706 color: #72777c;
707 }
708 .widgetopts-search-icon:after{
709 content: "\f179";
710 font: 400 20px/1 dashicons;
711 vertical-align: middle;
712 -webkit-font-smoothing: antialiased;
713 -moz-osx-font-smoothing: grayscale;
714 }
715 .widgetopts-clear-results{
716 position: absolute;
717 top: 13px;
718 right: 2px;
719 width: 30px;
720 height: 30px;
721 padding: 0;
722 border: 0;
723 cursor: pointer;
724 background: 0 0;
725 color: #a00;
726 text-decoration: none;
727 outline: 0;
728 display: none;
729 }
730 .widgetopts-clear-results:before{
731 content: "\f335";
732 font: 400 20px/1 dashicons;
733 vertical-align: middle;
734 -webkit-font-smoothing: antialiased;
735 -moz-osx-font-smoothing: grayscale;
736 }
737 .widgetopts-is-visible{
738 display: block !important;
739 }
740 .widgetopts-is-hidden{
741 display: none !important;
742 }
743
744 /** Search **/
745 #widgetopts-widgets-filter{
746 width: 100%;
747 max-width: 250px;
748 position: relative;
749 display: block;
750 padding: 12px 0px 1px;
751 clear: both;
752 }
753 input#widgetopts-widgets-search{
754 width: 100%;
755 height: 30px;
756 padding: 6px 30px;
757 }
758 .widgetopts-search-icon{
759 display: block;
760 position: absolute;
761 top: 13px;
762 left: 2px;
763 width: 30px;
764 height: 30px;
765 line-height: 28px;
766 text-align: center;
767 color: #72777c;
768 }
769 .widgetopts-search-icon:after{
770 content: "\f179";
771 font: 400 20px/1 dashicons;
772 vertical-align: middle;
773 -webkit-font-smoothing: antialiased;
774 -moz-osx-font-smoothing: grayscale;
775 }
776 .widgetopts-clear-results{
777 position: absolute;
778 top: 13px;
779 right: 2px;
780 width: 30px;
781 height: 30px;
782 padding: 0;
783 border: 0;
784 cursor: pointer;
785 background: 0 0;
786 color: #a00;
787 text-decoration: none;
788 outline: 0;
789 display: none;
790 }
791 .widgetopts-clear-results:before{
792 content: "\f335";
793 font: 400 20px/1 dashicons;
794 vertical-align: middle;
795 -webkit-font-smoothing: antialiased;
796 -moz-osx-font-smoothing: grayscale;
797 }
798 .widgetopts-is-visible{
799 display: block !important;
800 }
801 .widgetopts-is-hidden{
802 display: none !important;
803 }
804
805
806 /** Widgets Chooser **/
807 #widgetopts-widgets-chooser{
808 position: relative;
809 width: 100%;
810 }
811 input.widgetopts-widgets-search{
812 width: 100%;
813 margin: 1px 0px;
814 height: 30px;
815 padding: 6px 30px;
816 }
817 #widgetopts-widgets-chooser .widgetopts-search-icon,
818 #widgetopts-widgets-chooser .widgetopts-clear-results{
819 top: 1px;
820 }
821
822 .widgetsopts-chooser ul,
823 #widgets-right .widget-in-question .widget-top,
824 .widget-top:hover,
825 div#widgets-right .widget-top:hover,
826 #widgets-right .widget-top:hover {
827 border-color: #999;
828 -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.1);
829 box-shadow: 0 1px 2px rgba(0,0,0,0.1);
830 }
831
832 .widgetsopts-chooser ul.widgetopts-chooser-sidebars {
833 margin: 0;
834 list-style-type: none;
835 max-height: 300px;
836 overflow: auto;
837 }
838
839 .widgetsopts-chooser {
840 margin-top: 10px;
841 padding: 10px;
842 background: #f7f7f7;
843 }
844
845 .widgetsopts-chooser ul {
846 border: 1px solid #ccc;
847 }
848
849 .widgetsopts-chooser li {
850 padding: 10px 15px 10px 35px;
851 border-bottom: 1px solid #ccc;
852 background: #fff;
853 margin: 0;
854 cursor: pointer;
855 outline: none;
856 position: relative;
857 -webkit-transition: background 0.2s ease-in-out;
858 transition: background 0.2s ease-in-out;
859 }
860
861 /* @todo looks like these hover/focus states are overridden by .widgets-chooser-selected */
862 .widgetsopts-chooser li:hover,
863 .widgetsopts-chooser li:focus {
864 background: rgba(255,255,255,0.7);
865 }
866
867 .widgetsopts-chooser li:focus:before {
868 content: "\f147";
869 display: block;
870 -webkit-font-smoothing: antialiased;
871 font: normal 26px/1 dashicons;
872 color: #555d66;
873 position: absolute;
874 top: 7px;
875 left: 5px;
876 }
877
878 .widgetsopts-chooser li:last-child {
879 border: none;
880 }
881
882 .widgetsopts-chooser li.widgetopts-chooser-selected {
883 background: #00a0d2;
884 color: #fff;
885 }
886
887 .widgetsopts-chooser li.widgetopts-chooser-selected:before,
888 .widgetsopts-chooser li.widgetopts-chooser-selected:focus:before {
889 content: "\f147";
890 display: block;
891 -webkit-font-smoothing: antialiased;
892 font: normal 26px/1 dashicons;
893 color: #fff;
894 position: absolute;
895 top: 7px;
896 left: 5px;
897 }
898
899 .widgetsopts-chooser .widgetsopts-chooser-actions {
900 padding: 10px 0 12px 0;
901 text-align: center;
902 }
903
904 .widgetsopts-chooser button {
905 margin-right: 5px;
906 }
907
908 /**
909 * Sidebar Options
910 */
911 .widgetopts-sidebaropts{
912 display: block;
913 clear: both;
914 padding: 10px;
915 background: #eee;
916 border-top: 1px solid #e5e5e5;
917 }
918 .widgets-holder-wrap.closed .widgetopts-sidebaropts{
919 display: none;
920 }
921 .widgetopts-sidebaropts a{
922 text-decoration: none !important;
923 color: #777 !important;
924 font-size: 11px !important;
925 padding-right: 2px !important;
926 }
927 .widgetopts-sidebaropts a .dashicons{
928 font-size: 15px !important;
929 line-height: 21px !important;
930 text-align: right !important;
931 }
932 .sidebaropts-confirm{
933 display: none;
934 background: #fff;
935 border: 1px solid #ccc;
936 color: #a00;
937 padding: 15px 18px;
938 margin: 10px 0px 0px;
939 text-align: center;
940 }
941
942 /* DEMO Options */
943 .extended-widget-opts-tabcontent .extended-widget-opts-demo-feature {
944 margin-top: 1em;
945 }
946 .extended-widget-opts-demo-feature {
947 position: relative;
948 }
949
950 .extended-widget-opts-demo-feature > * {
951 z-index: 1;
952 }
953 .extended-widget-opts-demo-feature:before {
954 content: '';
955 display: block;
956 position: absolute;
957 top: 0px;
958 left: 0px;
959 right: 0px;
960 bottom: 0px;
961 z-index: 2;
962 background: #FFF1B8;
963 opacity: 0.85;
964 }
965 .extended-widget-opts-demo-feature .extended-widget-opts-demo-warning {
966 display: flex;
967 align-items: center;
968 justify-content: center;
969 position: absolute;
970 top: 50%;
971 left: 0px;
972 right: 0px;
973 z-index: 3;
974 flex-wrap: wrap;
975 transform: translate(0, -50%);
976 }
977 .extended-widget-opts-demo-feature .extended-widget-opts-demo-warning > * {
978 width: 100%;
979 }
980 .extended-widget-opts-feature-warning {
981 background: #FFF1B8;
982 padding: 15px;
983 }