PluginProbe
Responsive Menu – Create Mobile-Friendly Menu / 3.0.9
Responsive Menu – Create Mobile-Friendly Menu v3.0.9
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.9, at src/public/css/admin/main.css

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