PluginProbe
Responsive Menu – Create Mobile-Friendly Menu / 3.0.6
Responsive Menu – Create Mobile-Friendly Menu v3.0.6
4.7.3 3.1.5 3.1.6 3.1.7 3.1.8 3.1.9 4.0.0 4.0.1 4.0.2 4.0.3 4.0.4 4.1.0 4.1.1 4.1.10 4.1.11 4.1.12 4.1.2 4.1.3 4.1.4 4.1.5 4.1.6 4.1.7 4.1.8 4.1.9 4.2.0 All 90 releases
responsive-menu / src / public / css / admin / main.css

main.css in Responsive Menu – Create Mobile-Friendly Menu 3.0.6, at src/public/css/admin/main.css

698 lines 12.4 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 .tab_container
2 {
3 display: none;
4 }
5
6 .tabs_container {
7 margin: 25px 0 15px 0;
8 }
9
10 .wrap .notice,
11 .wrap div.error,
12 .wrap div.updated {
13 margin: 0;
14 }
15
16 #menu-sortable {
17 position: relative;
18 }
19
20 #menu-sortable,
21 #items_order_container td:last-child {
22 width:400px;
23 }
24
25 #postbox_order .fa {
26 position: absolute;
27 right: 3%;
28 top: 13px;
29 }
30
31 #postbox_ordering .fa {
32 position: absolute;
33 left: 47%;
34 bottom: 11px;
35 }
36
37 #postbox_ordering li.draggable {
38 height: 41px;
39 vertical-align: top;
40 }
41
42 .menu-order-option-switch,
43 .order-option-switch {
44 background: #DE4B42;
45 color: white;
46 position: absolute;
47 left: 0;
48 top: 0;
49 bottom: 0;
50 line-height: 40px;
51 padding: 0 5px;
52 width: 30px;
53 text-align: center;
54 cursor: pointer;
55 }
56
57 .menu-order-option-switch.menu-order-option-switch-on,
58 .order-option-switch.order-option-switch-on {
59 background: green;
60 }
61
62 .menu-order-option-switch:after,
63 .order-option-switch:after {
64 content: "OFF";
65 }
66
67 .menu-order-option-switch.menu-order-option-switch-on:after,
68 .order-option-switch.order-option-switch-on:after {
69 content: "ON";
70 }
71
72 li.draggable {
73 position: relative;
74 }
75
76 .postbox > h4 {
77 background: #ffffff none repeat scroll 0 0;
78 border-bottom: 1px solid #eee;
79 box-sizing: border-box;
80 display: block;
81 font-size: 14px;
82 line-height: 1.4;
83 padding: 8px 12px;
84 width: 100%;
85 margin: 0;
86 }
87
88 .add-font-icon {
89 display: inline-block;
90 background: #298CBA;
91 color: white;
92 padding: 10px 25px;
93 border-radius: 2px;
94 cursor: pointer;
95 margin-top: 15px;
96 font-weight: bold;
97 }
98
99 .postbox .inside .select,
100 .postbox .inside .image_button,
101 .postbox .inside .image,
102 .postbox .inside .text {
103 padding: 5px 15px;
104 height: 30px;
105 margin-right: 10px;
106 }
107
108 .postbox .inside .textarea {
109 height: 100px;
110 padding: 15px;
111 width: 100%;
112 }
113
114 .font-icon-container .font-icon-row:first-child {
115 font-weight: bold;
116 }
117
118 .postbox .inside {
119 padding: 0;
120 margin: 0 !important;
121 }
122
123 .postbox .inside table {
124 width: 100%;
125 border-spacing: 0;
126 }
127
128 .postbox .inside table .description {
129 color: #899194;
130 line-height: 16px;
131 font-size: 12px;
132 }
133
134 .postbox .inside table tr td {
135 border-bottom: 1px solid #f5f5f5;
136 vertical-align: middle;
137 }
138
139 .postbox .inside table tr td:first-child {
140 background: #F9F9F9;
141 font-weight: bold;
142 border-right: 1px solid #e1e1e1;
143 color: #333;
144 width: 250px;
145 }
146
147 .postbox .inside table tr td:last-child:hover {
148 background: #FCFCFC;
149 }
150
151 .postbox .inside table tr.pro_option td:last-child:hover {
152 background: #FFE9E8;
153 }
154
155 .postbox .inside table tr.semi_pro_option td:last-child:hover {
156 background: #EDEAEA;
157 }
158
159 .postbox .inside table tr td:last-child {
160 text-align: left;
161 position: relative;
162 }
163
164 input[type="text"].image,
165 .select-style,
166 .inside .minicolors-theme-default.minicolors,
167 .postbox .inside .textarea,
168 .postbox .inside input.text {
169 width: 74%;
170 }
171
172 #normal-sortables .button.submit,
173 .postbox .inside .image_button {
174 background: #298CBA;
175 color: white;
176 border-color: #298CBA;
177 }
178
179 #normal-sortables .button.submit {
180 padding: 0 35px;
181 height: 50px;
182 line-height: 50px;
183 font-weight: bold;
184 font-size: 11px;
185 }
186
187 #normal-sortables .button.submit:hover {
188 background: #40A1CE;
189 }
190
191 .postbox .inside .image_button .fa {
192 vertical-align: text-top;
193 }
194
195 #header_bar_items_order_container td {
196 width: 100%;
197 display: block;
198 padding: 20px;
199 border: 0;
200 box-sizing: border-box;
201 }
202
203 .postbox .inside tr.semi_pro_option td:last-child:before,
204 .postbox .inside tr.pro_option td:last-child:before {
205 content: "PRO";
206 float: right;
207 color: #DE4B42;
208 font-weight: bold;
209 font-size: 9px;
210 margin-top: 6px;
211 border-left: 1px solid #DE4B42;
212 padding-left: 8px;
213 }
214
215 .postbox .inside tr.semi_pro_option td:last-child:before {
216 content: "SEMI PRO";
217 color: #333;
218 border-color: #333;
219 }
220
221 .postbox .inside tr.pro_option td:last-child:hover:after {
222 width: 100%;
223 content: "Please upgrade to use";
224 top: 0;
225 left: 0;
226 right: 0;
227 bottom: 0;
228 position: absolute;
229 text-align: center;
230 color: #fff;
231 font-weight: bold;
232 font-size: 14px;
233 padding-top: 2%;
234 background: rgba(222, 75, 66, 0.6);
235 }
236
237 #items_order_container td:last-child,
238 #header_bar_items_order_container td:last-child {
239 text-align: center;
240 }
241
242 .postbox_font_icons .inside
243 {
244 padding: 0;
245 margin-bottom: 0;
246 }
247
248 .postbox .inside .wp-color-picker {
249 cursor: crosshair;
250 }
251
252 #all_options_container,
253 #banner_area
254 {
255 vertical-align: top;
256 display: inline-block;
257 box-sizing: border-box;
258 }
259
260 #all_options_container {
261 width: 74%;
262 }
263
264 #banner_area
265 {
266 width: 24%;
267 margin-top: 1px;
268 margin-left: 2%;
269 }
270
271 #upgrade_banner {
272 padding: 35px;
273 background: #DE4B42;
274 color: #fff;
275 border: 1px solid #D33C34;
276 border-radius: 2px;
277 }
278
279 #docs_banner {
280 background: #FAB719;
281 padding: 35px;
282 color: #333;
283 margin-top: 15px;
284 text-align: center;
285 }
286
287 #upgrade_banner,
288 #docs_banner {
289 font-size: 18px;
290 font-weight: bold;
291 line-height: 24px;
292 }
293
294 #upgrade_banner li {
295 list-style: inside;
296 font-weight: bold;
297 font-size: 11px;
298 }
299
300 #docs_banner .button,
301 #upgrade_banner .button {
302 background: white;
303 padding: 0 25px;
304 height: 50px;
305 line-height: 50px;
306 font-weight: bold;
307 font-size: 13px;
308 color: #333;
309 display: block;
310 margin: auto;
311 width: auto;
312 text-align: center;
313 }
314
315 #docs_banner .button {
316 margin-top: 15px;
317 }
318
319 #options_list_container .tab_container:first-child {
320 display: block;
321 }
322
323 .tab
324 {
325 display: inline-block;
326 padding: 5px;
327 text-align: center;
328 border: 1px solid #CCC;
329 border-radius: 2px;
330 cursor: pointer;
331 background: white;
332 margin: 0 5px 0 0 !important;
333 }
334
335 .tab.active_tab {
336 background: #00A0D2;
337 color: white;
338 border-color: #298CBA;
339 }
340
341 .option_holder
342 {
343 display: inline-block;
344 width: 30%;
345 vertical-align: middle;
346 position: relative;
347 text-align: center;
348 margin-right: 2%;
349 padding: 5px 2% 25px 2%;
350 margin-top: 15px;
351 border: 1px dashed #DADADA;
352 border-radius: 5px;
353 transition: 0.4s all;
354 box-sizing: border-box;
355 }
356
357 .option_holder:hover
358 {
359 background: #F7F2F2;
360 }
361
362 .option_holder h4
363 {
364 margin-bottom: 0;
365 }
366
367 .option_holder h5
368 {
369 margin: 5px 0;
370 font-weight: normal;
371 }
372
373 .option_holder.pro_option
374 {
375 border-color: #ED655E;
376 }
377
378 .option_holder.semi_pro_option {
379 border-color: #DADADA;
380 }
381
382 .options_container
383 {
384 background: white;
385 border: 1px solid #CCC;
386 border-radius: 0 2px 2px 2px;
387 padding: 0 15px 15px 15px;
388 text-align: center;
389 }
390
391 .options_container input,
392 .options_container textarea,
393 .options_container select
394 {
395 width: 90%;
396 border: 1px solid #CCC;
397 border-radius: 2px;
398 padding: 5px;
399 background: white;
400 }
401
402 ul#adminmenu a.wp-has-current-submenu::after,
403 ul#adminmenu > li.current > a.current::after
404 {
405 border-color: transparent #DE4B42 transparent transparent;
406 }
407
408 /* On-Off Buttons */
409
410 .onoffswitch {
411 position: relative; width: 74px;
412 -webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;
413 }
414 .onoffswitch-checkbox {
415 display: none;
416 }
417 .onoffswitch-label {
418 display: block; overflow: hidden; cursor: pointer;
419 border: 2px solid transparent;
420 text-align: left;
421 }
422 .onoffswitch-inner {
423 display: block; width: 200%; margin-left: -100%;
424 transition: margin 0.3s ease-in 0s;
425 }
426 .onoffswitch-inner:before, .onoffswitch-inner:after {
427 display: block; float: left; width: 50%; height: 23px; padding: 0; line-height: 23px;
428 font-size: 14px; color: white; font-family: Trebuchet, Arial, sans-serif; font-weight: bold;
429 box-sizing: border-box;
430 }
431 .onoffswitch-inner:before {
432 content: "ON";
433 padding-left: 10px;
434 background-color: transparent; color: #DE4B42;
435 }
436 .onoffswitch-inner:after {
437 content: "OFF";
438 padding-right: 10px;
439 background-color: transparent; color: #999999;
440 text-align: right;
441 }
442 .onoffswitch-switch {
443 display: block; width: 13px; margin: 5px;
444 background: #FFFFFF;
445 position: absolute; top: 0; bottom: 0;
446 right: 47px;
447 border: 2px solid #999999; border-radius: 12px;
448 transition: all 0.3s ease-in 0s;
449 }
450 .onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
451 margin-left: 0;
452 }
453 .onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
454 right: 0px;
455 }
456
457 input[type="checkbox"]
458 {
459 display: none;
460 }
461
462 .key-container {
463 margin-bottom: 15px;
464 }
465
466 .key-container .key-title {
467 font-weight: bold;
468 display: inline-block;
469 margin-right: 10px;
470 }
471
472 .key-container .key {
473 display: inline-block;
474 font-size: 9px;
475 border: 1px solid #DADADA;
476 border-radius: 2px;
477 padding: 5px 15px 5px 5px;
478 background: white;
479 }
480
481 .key-container .key span {
482 border-right: 1px solid #de4b42;
483 display: inline-block;
484 padding-right: 5px;
485 margin-right: 10px;
486 color: #de4b42;
487 font-size: 9px;
488 font-weight: bold;
489 }
490
491 .key-container .key.key-semi-pro span {
492 color: #333;
493 border-color: #333;
494 }
495
496 .key-container .key.key-pro {
497 margin-right: 15px;
498 }
499
500 .key-container a {
501 text-decoration: none;
502 color: #333;
503 }
504
505 /* End On-Off Buttons */
506
507 /* Nice Select Button Styling */
508 .select-style {
509 border: 1px solid #ccc;
510 border-radius: 3px;
511 cursor: pointer;
512 overflow: hidden;
513 background: #fafafa url("data:image/png;base64,R0lGODlhDwAUAIABAAAAAP///yH5BAEAAAEALAAAAAAPABQAAAIXjI+py+0Po5wH2HsXzmw//lHiSJZmUAAAOw==")no-repeat 95% 50%;
514 }
515
516 .select-style select {
517 width: 105%;
518 border: none;
519 cursor: pointer;
520 box-shadow: none;
521 background: transparent;
522 background-image: none;
523 -webkit-appearance: none;
524 max-width: 115%;
525 }
526
527 .select-style select:focus {
528 outline: none;
529 }
530
531 /* End Select Button Styling */
532
533 /* Text Box Styling */
534
535 input[type="text"].text,
536 input[type="text"].image
537 {
538 padding: 10px 5%;
539 border: 1px solid #c9c9c9;
540 border-bottom: solid 2px #c9c9c9;
541 transition: border 0.3s;
542 }
543
544 input[type="text"].text:focus,
545 input[type="text"].text.focus,
546 input[type="text"].image:focus,
547 input[type="text"].image.focus,
548 {
549 border-bottom: solid 2px #969696;
550 }
551
552 input[type="button"].image_button
553 {
554 width: 15%;
555 height: 42px;
556 }
557
558 input[type="text"].image,
559 input[type="button"].image_button
560 {
561 display: inline-block;
562 }
563
564 /* End Text Box Styling */
565 #custom_css,
566 #menu_font_icons_container,
567 #custom_css_container
568 {
569 width: 90%;
570 }
571
572 .font-icon-container
573 {
574 width: 100%;
575 display: table;
576 }
577
578 #custom_css {
579 height: 300px;
580 }
581
582 .font-icon-row
583 {
584 display: table-row;
585 }
586
587 .font-icon-cell-id,
588 .font-icon-cell-icon
589 {
590 display: inline-block;
591 text-align: left;
592 }
593
594 .font-icon-cell-id {
595 width: 10%;
596 }
597
598 .font-icon-cell-icon {
599 width: 64%;
600 }
601
602 .font-icon-cell-id input,
603 .font-icon-cell-icon input
604 {
605 width: 100%;
606 }
607
608 .draggable {
609 border: 1px solid #DADADA;
610 border-radius: 2px;
611 background: #EFEFEF;
612 padding: 10px 0;
613 margin: 0;
614 cursor: move;
615 font-weight: bold;
616 padding-left: 35px;
617 box-sizing: border-box;
618 }
619
620 .draggable input {
621 display: none;
622 }
623
624 #header_bar_items_order_container .draggable {
625 display: inline-block;
626 width: 19%;
627 }
628
629 .upgrade-notes {
630 background: #DE4B42;
631 padding: 15px 2%;
632 width: 96%;
633 position: relative;
634 margin: 15px 0;
635 color: white;
636 }
637
638 .upgrade-notes a {
639 color: white;
640 text-decoration: underline;
641 }
642
643 .upgrade-notes-title {
644 font-size: 16px;
645 margin-bottom: 10px;
646 font-weight: bold;
647 }
648
649 .upgrade-notes-close {
650 position: absolute;
651 top: 0;
652 right: 2%;
653 font-size: 18px;
654 padding: 15px;
655 font-weight: bold;
656 cursor: pointer;
657 }
658
659 @media (max-width: 800px) {
660 .tab {
661 margin-bottom: 10px !important;
662 width: 18%;
663 margin-right: 1% !important;
664 }
665 #banner_area,
666 #all_options_container {
667 width: 100%;
668 }
669 .tabs_container {
670 text-align: center;
671 }
672 .postbox .inside table tr td,
673 .postbox .inside table tr td:last-child,
674 .postbox .inside table tr td:first-child {
675 width: 100%;
676 display: block;
677 text-align: center;
678 padding: 10px 0;
679 }
680 #banner_area {
681 margin: 15px 0;
682 }
683 #menu-sortable,
684 .onoffswitch,
685 .select-style {
686 margin: auto;
687 }
688 #menu-sortable, #items_order_container td:last-child {
689 width: 90%;
690 margin: auto;
691 }
692 #normal-sortables .button.submit {
693 margin: auto;
694 display: block;
695 float: none;
696 }
697 }
698