1/*! This file is auto-generated */
2/* nav-menu */
3
4/* @todo: determine if this is truly for nav menus only */
5.no-js #message {
6 display: block;
7}
8
9ul.add-menu-item-tabs li {
10 padding: 3px 8px 4px 5px;
11}
12
13.accordion-section ul.category-tabs,
14.accordion-section ul.add-menu-item-tabs,
15.accordion-section ul.wp-tab-bar {
16 margin: 0;
17}
18
19.accordion-section .categorychecklist {
20 margin: 13px 0;
21}
22
23#nav-menu-meta .accordion-section-content {
24 padding: 18px 13px;
25 resize: vertical;
26}
27
28#nav-menu-meta .button-controls {
29 margin-bottom: 0;
30}
31
32.has-no-menu-item .button-controls {
33 display: none;
34}
35
36#nav-menus-frame {
37 margin-right: 300px;
38 margin-top: 23px;
39}
40
41#wpbody-content #menu-settings-column {
42 display: inline;
43 width: 281px;
44 margin-right: -300px;
45 clear: both;
46 float: right;
47 padding-top: 0;
48}
49
50#menu-settings-column .inside {
51 clear: both;
52 margin: 10px 0 0;
53 height: 100%;
54 max-height: inherit;
55}
56
57#menu-settings-column .categorydiv,
58#menu-settings-column .customlinkdiv,
59#menu-settings-column .posttypediv,
60#menu-settings-column .taxonomydiv {
61 max-height: inherit;
62 height: 100%;
63}
64
65#menu-settings-column .wp-tab-panel,
66#menu-settings-column .categorydiv div.tabs-panel,
67#menu-settings-column .customlinkdiv div.tabs-panel,
68#menu-settings-column .posttypediv div.tabs-panel,
69#menu-settings-column .taxonomydiv div.tabs-panel {
70 /* Allow space for content after tab panels in nav menu editor. */
71 max-height: calc( 100% - 75px );
72 height: 100%;
73}
74
75.metabox-holder-disabled .postbox,
76.metabox-holder-disabled .accordion-section-content,
77.metabox-holder-disabled .accordion-section-title {
78 opacity: 0.5;
79 filter: alpha(opacity=50);
80}
81
82.metabox-holder-disabled .button-controls .select-all {
83 display: none;
84}
85
86#wpbody {
87 position: relative;
88}
89
90.is-submenu {
91 color: #50575e; /* #fafafa background */
92 font-style: italic;
93 font-weight: 400;
94 margin-right: 4px;
95}
96
97.manage-menus {
98 margin-top: 23px;
99 padding: 10px;
100 overflow: hidden;
101 background: #fff;
102}
103
104.manage-menus .selected-menu,
105.manage-menus select,
106.manage-menus .submit-btn,
107.nav-menus-php .add-new-menu-action {
108 display: inline-block;
109 margin-left: 3px;
110 vertical-align: middle;
111}
112
113.manage-menus select,
114.menu-location-menus select {
115 max-width: 100%;
116}
117
118.menu-edit #post-body-content h3 {
119 margin: 1em 0 10px;
120}
121
122#nav-menu-bulk-actions-top {
123 margin: 1em 0;
124}
125
126#nav-menu-bulk-actions-bottom {
127 margin: 1em 0;
128 margin: calc( 1em + 9px ) 0;
129}
130
131.bulk-actions input.button {
132 margin-left: 12px;
133}
134
135.bulk-select-button {
136 position: relative;
137 display: inline-block;
138 padding: 0 10px;
139 font-size: 13px;
140 line-height: 2.15384615;
141 height: auto;
142 min-height: 30px;
143 background: #f6f7f7;
144 vertical-align: top;
145 border: 1px solid #dcdcde;
146 margin: 0;
147 cursor: pointer;
148 border-radius: 3px;
149 white-space: nowrap;
150 box-sizing: border-box;
151}
152
153.bulk-selection .bulk-select-button {
154 color: #2271b1;
155 border-color: #2271b1;
156 background: #f6f7f7;
157 vertical-align: top;
158}
159
160#pending-menu-items-to-delete {
161 display: none;
162}
163
164.bulk-selection #pending-menu-items-to-delete {
165 display: block;
166 margin-top: 1em;
167}
168
169#pending-menu-items-to-delete p {
170 margin-bottom: 0;
171}
172
173#pending-menu-items-to-delete ul {
174 margin-top: 0;
175 list-style: none;
176}
177
178#pending-menu-items-to-delete ul li {
179 display: inline;
180}
181
182input.bulk-select-switcher + .bulk-select-button-label {
183 vertical-align: inherit;
184}
185
186label.bulk-select-button:hover,
187label.bulk-select-button:active,
188label.bulk-select-button:focus-within {
189 background: #f0f0f1;
190 border-color: #0a4b78;
191 color: #0a4b78;
192}
193
194input.bulk-select-switcher:focus + .bulk-select-button-label {
195 color: #0a4b78;
196}
197
198.bulk-actions input.menu-items-delete {
199 appearance: none;
200 font-size: inherit;
201 border: 0;
202 line-height: 2.1em;
203 background: none;
204 cursor: pointer;
205 text-decoration: underline;
206 color: #b32d2e;
207}
208
209.bulk-actions input.menu-items-delete:hover {
210 color: #b32d2e;
211 border: none;
212}
213
214.bulk-actions input.menu-items-delete.disabled {
215 display: none;
216}
217
218.menu-settings {
219 border-top: 1px solid #f0f0f1;
220 margin-top: 2em;
221}
222
223.menu-settings-group {
224 margin: 0 0 10px;
225 overflow: hidden;
226 padding-right: 20%;
227}
228
229.menu-settings-group:last-of-type {
230 margin-bottom: 0;
231}
232
233.menu-settings-input {
234 float: right;
235 margin: 0;
236 width: 100%;
237}
238
239.menu-settings-group-name {
240 float: right;
241 clear: both;
242 width: 25%;
243 padding: 3px 0 0;
244 margin-right: -25%; /* 20 container left padding x ( 100 container % width / 80 this % width ) */
245}
246
247.menu-settings label {
248 vertical-align: baseline;
249}
250
251.menu-edit .checkbox-input {
252 margin-top: 4px;
253}
254
255.theme-location-set {
256 color: #646970;
257 font-size: 11px;
258}
259
260/* Menu Container */
261
262/* @todo: responsive view. */
263#menu-management-liquid {
264 float: right;
265 min-width: 100%;
266 margin-top: 3px;
267}
268
269/* @todo: responsive view. */
270#menu-management {
271 position: relative;
272 margin-left: 20px;
273 margin-top: -3px;
274 width: 100%;
275}
276
277#menu-management .menu-edit {
278 margin-bottom: 20px;
279}
280
281.nav-menus-php #post-body {
282 padding: 0 10px;
283 border-top: 1px solid #fff;
284 border-bottom: 1px solid #dcdcde;
285 background: #fff;
286}
287
288#nav-menu-header,
289#nav-menu-footer {
290 padding: 0 10px;
291 background: #f6f7f7;
292}
293
294#nav-menu-header {
295 border-bottom: 1px solid #dcdcde;
296 margin-bottom: 0;
297}
298
299#nav-menu-header .menu-name-label {
300 display: inline-block;
301 vertical-align: middle;
302 margin-left: 7px;
303}
304
305.nav-menus-php #post-body div.updated,
306.nav-menus-php #post-body div.error {
307 margin: 0;
308}
309
310.nav-menus-php #post-body-content {
311 position: relative;
312 float: none;
313}
314
315.nav-menus-php #post-body-content .post-body-plain {
316 margin-bottom: 0;
317}
318
319#menu-management .menu-add-new abbr {
320 font-weight: 600;
321}
322
323#select-nav-menu-container {
324 text-align: left;
325 padding: 0 10px 3px;
326 margin-bottom: 5px;
327}
328
329#select-nav-menu {
330 width: 100px;
331 display: inline;
332}
333
334#menu-name-label {
335 margin-top: -2px;
336}
337
338.widefat .menu-locations .menu-location-title {
339 padding: 13px 10px 0;
340}
341
342.menu-location-title label {
343 font-weight: 600;
344}
345
346.menu-location-menus select {
347 float: right;
348}
349
350#locations-nav-menu-wrapper {
351 padding: 5px 0;
352}
353
354.locations-nav-menu-select select {
355 float: right;
356 width: 160px;
357 margin-left: 5px;
358}
359
360.locations-row-links {
361 float: right;
362 margin: 6px 6px 0 0;
363}
364
365.locations-edit-menu-link,
366.locations-add-menu-link {
367 margin: 0 3px;
368}
369
370.locations-edit-menu-link {
371 padding-left: 3px;
372 border-left: 1px solid #c3c4c7;
373}
374
375#menu-management .inside {
376 padding: 0 10px;
377}
378
379/* Add Menu Item Boxes */
380.postbox .howto input,
381.customlinkdiv .menu-item-textbox,
382.customlinkdiv .error-message {
383 width: 180px;
384 float: left;
385}
386
387.customlinkdiv .error-message {
388 clear: left;
389}
390
391.accordion-container .outer-border {
392 margin: 0;
393}
394
395.customlinkdiv p {
396 margin-top: 0
397}
398
399#nav-menu-theme-locations .howto select {
400 width: 100%;
401}
402
403#nav-menu-theme-locations .button-controls {
404 text-align: left;
405}
406
407.add-menu-item-view-all {
408 height: 400px;
409}
410
411/* Button Primary Actions */
412#menu-container .submit {
413 margin: 0 0 10px;
414 padding: 0;
415}
416
417/* @todo: is this actually used? */
418#cancel-save {
419 text-decoration: underline;
420 font-size: 12px;
421 margin-right: 20px;
422 margin-top: 5px;
423}
424
425.button.right, .button-secondary.right, .button-primary.right {
426 float: left;
427}
428
429/* Button Secondary Actions */
430.list-controls {
431 float: right;
432 margin-top: 5px;
433}
434
435.add-to-menu {
436 float: left;
437}
438
439.button-controls {
440 clear: both;
441 margin: 10px 0;
442}
443
444.show-all,
445.hide-all {
446 cursor: pointer;
447}
448
449.hide-all {
450 display: none;
451}
452
453/* Create Menu */
454#menu-name {
455 width: 270px;
456 vertical-align: middle;
457}
458
459#manage-menu .inside {
460 padding: 0;
461}
462
463/* Custom Links */
464#available-links dt {
465 display: block;
466}
467
468#add-custom-link .howto {
469 font-size: 12px;
470}
471
472#add-custom-link label span {
473 display: block;
474 float: right;
475 margin-top: 5px;
476 padding-left: 5px;
477}
478
479.menu-item-textbox {
480 width: 180px;
481}
482
483.customlinkdiv label,
484.nav-menus-php .howto span {
485 float: right;
486 margin-top: 6px;
487}
488
489/* Menu item types */
490.quick-search {
491 width: 190px;
492}
493
494.quick-search-wrap .spinner {
495 float: none;
496 margin: -3px 0 0 -10px;
497}
498
499.nav-menus-php .list-wrap {
500 display: none;
501 clear: both;
502 margin-bottom: 10px;
503}
504
505.nav-menus-php .postbox p.submit {
506 margin-bottom: 0;
507}
508
509/* Listings */
510.nav-menus-php .list li {
511 display: none;
512 margin: 0 0 5px;
513}
514
515.nav-menus-php .list li .menu-item-title {
516 cursor: pointer;
517 display: block;
518}
519
520.nav-menus-php .list li .menu-item-title input {
521 margin-left: 3px;
522 margin-top: -3px;
523}
524
525.menu-item-title input[type=checkbox] {
526 display: inline-block;
527 margin-top: -4px;
528}
529
530.menu-item-title .post-state {
531 font-weight: 600;
532}
533
534/* Nav Menu */
535#menu-container .inside {
536 padding-bottom: 10px;
537}
538
539.menu {
540 padding-top: 1em;
541}
542
543#menu-to-edit {
544 margin: 0;
545 padding: 0.1em 0;
546}
547
548.menu ul {
549 width: 100%;
550}
551
552.menu li {
553 margin-bottom: 0;
554 position: relative;
555}
556
557.menu-item-bar {
558 clear: both;
559 line-height: 1.5;
560 position: relative;
561 margin: 9px 0 0;
562}
563
564.menu-item-bar .menu-item-handle {
565 border: 1px solid #dcdcde;
566 position: relative;
567 padding: 10px 15px;
568 height: auto;
569 min-height: 20px;
570 max-width: 382px;
571 line-height: 2.30769230;
572 overflow: hidden;
573 word-wrap: break-word;
574}
575
576.menu-item-bar .menu-item-handle:hover {
577 border-color: #8c8f94;
578}
579
580#menu-to-edit .menu-item-invalid .menu-item-handle {
581 background: #fcf0f1;
582 border-color: #d63638;
583}
584
585.no-js .menu-item-edit-active .item-edit {
586 display: none;
587}
588
589.js .menu-item-handle {
590 cursor: move;
591}
592
593.menu li.deleting .menu-item-handle {
594 background-image: none;
595 background-color: #f86368;
596}
597
598.menu-item-handle .item-title {
599 font-size: 13px;
600 font-weight: 600;
601 line-height: 1.53846153;
602 display: block;
603 /* @todo: responsive view. */
604 margin-left: 13em;
605}
606
607.menu-item-handle .menu-item-checkbox {
608 display: none;
609}
610
611.bulk-selection .menu-item-handle .menu-item-checkbox {
612 display: inline-block;
613 margin-left: 6px;
614}
615
616.menu-item-handle .menu-item-title.no-title {
617 color: #646970;
618}
619
620/* Sortables */
621li.menu-item.ui-sortable-helper .menu-item-bar {
622 margin-top: 0;
623}
624
625li.menu-item.ui-sortable-helper .menu-item-transport .menu-item-bar {
626 margin-top: 9px; /* Must use the same value used by the dragged item .menu-item-bar */
627}
628
629.menu .sortable-placeholder {
630 height: 35px;
631 width: 410px;
632 margin-top: 9px; /* Must use the same value used by the dragged item .menu-item-bar */
633}
634
635/* Hide the transport list when it's empty */
636.menu-item .menu-item-transport:empty {
637 display: none;
638}
639
640/* WARNING: The factor of 30px is hardcoded into the nav-menus JavaScript. */
641.menu-item-depth-0 { margin-right: 0; }
642.menu-item-depth-1 { margin-right: 30px; }
643.menu-item-depth-2 { margin-right: 60px; }
644.menu-item-depth-3 { margin-right: 90px; }
645.menu-item-depth-4 { margin-right: 120px; }
646.menu-item-depth-5 { margin-right: 150px; }
647.menu-item-depth-6 { margin-right: 180px; }
648.menu-item-depth-7 { margin-right: 210px; }
649.menu-item-depth-8 { margin-right: 240px; }
650.menu-item-depth-9 { margin-right: 270px; }
651.menu-item-depth-10 { margin-right: 300px; }
652.menu-item-depth-11 { margin-right: 330px; }
653
654.menu-item-depth-0 .menu-item-transport { margin-right: 0; }
655.menu-item-depth-1 .menu-item-transport { margin-right: -30px; }
656.menu-item-depth-2 .menu-item-transport { margin-right: -60px; }
657.menu-item-depth-3 .menu-item-transport { margin-right: -90px; }
658.menu-item-depth-4 .menu-item-transport { margin-right: -120px; }
659.menu-item-depth-5 .menu-item-transport { margin-right: -150px; }
660.menu-item-depth-6 .menu-item-transport { margin-right: -180px; }
661.menu-item-depth-7 .menu-item-transport { margin-right: -210px; }
662.menu-item-depth-8 .menu-item-transport { margin-right: -240px; }
663.menu-item-depth-9 .menu-item-transport { margin-right: -270px; }
664.menu-item-depth-10 .menu-item-transport { margin-right: -300px; }
665.menu-item-depth-11 .menu-item-transport { margin-right: -330px; }
666
667body.menu-max-depth-0 { min-width: 950px !important; }
668body.menu-max-depth-1 { min-width: 980px !important; }
669body.menu-max-depth-2 { min-width: 1010px !important; }
670body.menu-max-depth-3 { min-width: 1040px !important; }
671body.menu-max-depth-4 { min-width: 1070px !important; }
672body.menu-max-depth-5 { min-width: 1100px !important; }
673body.menu-max-depth-6 { min-width: 1130px !important; }
674body.menu-max-depth-7 { min-width: 1160px !important; }
675body.menu-max-depth-8 { min-width: 1190px !important; }
676body.menu-max-depth-9 { min-width: 1220px !important; }
677body.menu-max-depth-10 { min-width: 1250px !important; }
678body.menu-max-depth-11 { min-width: 1280px !important; }
679
680/* Menu item controls */
681.item-type {
682 display: inline-block;
683 padding: 12px 16px;
684 color: #646970;
685 font-size: 12px;
686 line-height: 1.5;
687}
688
689.item-controls {
690 font-size: 12px;
691 position: absolute;
692 left: 20px;
693 top: -1px;
694}
695
696.item-controls a {
697 text-decoration: none;
698}
699
700.item-controls a:hover {
701 cursor: pointer;
702}
703
704.item-controls .item-order {
705 padding-left: 10px;
706}
707
708.nav-menus-php .item-edit {
709 position: absolute;
710 left: -20px;
711 top: 0;
712 display: block;
713 width: 30px;
714 height: 40px;
715 outline: none;
716}
717
718.no-js.nav-menus-php .item-edit {
719 position: static;
720 float: left;
721 width: auto;
722 height: auto;
723 margin: 12px 0 12px -10px;
724 padding: 0;
725 color: #2271b1;
726 text-decoration: underline;
727 font-size: 12px;
728 line-height: 1.5;
729}
730
731.no-js.nav-menus-php .item-edit .screen-reader-text {
732 position: static;
733 clip-path: none;
734 width: auto;
735 height: auto;
736 margin: 0;
737}
738
739.nav-menus-php .item-edit:before {
740 margin-top: 10px;
741 margin-right: 4px;
742 width: 20px;
743 border-radius: 50%;
744 text-indent: -1px; /* account for the dashicon alignment */
745}
746
747.no-js.nav-menus-php .item-edit:before {
748 display: none;
749}
750
751.rtl .nav-menus-php .item-edit:before {
752 text-indent: 1px; /* account for the dashicon alignment */
753}
754
755.js.nav-menus-php .item-edit:focus {
756 box-shadow: none;
757}
758
759.nav-menus-php .item-edit:focus:before {
760 box-shadow: 0 0 0 2px #2271b1;
761 /* Only visible in Windows High Contrast mode */
762 outline: 2px solid transparent;
763}
764
765/* Menu editing */
766.menu-instructions-inactive {
767 display: none;
768}
769
770.menu-item-settings {
771 display: block;
772 max-width: 392px;
773 padding: 10px;
774 position: relative;
775 z-index: 10; /* Keep .item-title's shadow from appearing on top of .menu-item-settings */
776 border: 1px solid #c3c4c7;
777 border-top: none;
778 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
779}
780
781.menu-item-settings .field-move {
782 margin: 3px 0 5px;
783 line-height: 1.5;
784}
785
786.field-move-visual-label {
787 float: right;
788 margin-left: 4px;
789}
790
791.menu-item-settings .field-move .button-link {
792 display: none;
793 margin: 0 2px;
794}
795
796.menu-item-edit-active .menu-item-settings {
797 display: block;
798}
799
800.menu-item-edit-inactive .menu-item-settings {
801 display: none;
802}
803
804.add-menu-item-pagelinks {
805 margin: .5em -10px;
806 text-align: center;
807}
808
809.add-menu-item-pagelinks .page-numbers {
810 display: inline-block;
811 min-width: 20px;
812}
813
814.add-menu-item-pagelinks .page-numbers.dots {
815 min-width: 0;
816}
817
818.link-to-original {
819 display: block;
820 margin: 0 0 15px;
821 padding: 3px 5px 5px;
822 border: 1px solid #dcdcde;
823 color: #646970;
824 font-size: 12px;
825}
826
827.link-to-original a {
828 padding-right: 4px;
829 font-style: normal;
830}
831
832.hidden-field {
833 display: none;
834}
835
836.description-group {
837 display: flex;
838 column-gap: 10px;
839}
840
841.description-group > * {
842 flex-grow: 1;
843}
844
845.menu-item-actions {
846 padding-top: 15px;
847 padding-bottom: 7px;
848}
849
850#cancel-save {
851 cursor: pointer;
852}
853
854/* Major/minor publishing actions (classes) */
855.nav-menus-php .major-publishing-actions {
856 padding: 10px 0;
857 display: flex;
858 align-items: center;
859}
860
861.nav-menus-php .major-publishing-actions > * {
862 margin-left: 10px;
863}
864
865.nav-menus-php .major-publishing-actions .form-invalid {
866 padding-right: 4px;
867 margin-right: -4px;
868}
869
870#nav-menus-frame,
871.button-controls,
872#menu-item-url-wrap,
873#menu-item-name-wrap {
874 display: block;
875}
876
877/* =Media Queries
878-------------------------------------------------------------- */
879
880@media only screen and (min-width: 769px) and (max-width: 1000px) {
881 body.menu-max-depth-0 {
882 min-width: 0 !important;
883 }
884
885 #menu-management-liquid {
886 width: 100%;
887 }
888
889 .nav-menus-php #post-body-content {
890 min-width: 0;
891 }
892}
893
894@media screen and (max-width: 782px) {
895 body.nav-menus-php,
896 body.wp-customizer {
897 min-width: 0 !important;
898 }
899
900 #nav-menus-frame {
901 margin-right: 0;
902 float: none;
903 width: 100%;
904 }
905
906 #wpbody-content #menu-settings-column {
907 display: block;
908 width: 100%;
909 float: none;
910 margin-right: 0;
911 }
912
913 #side-sortables .add-menu-item-tabs {
914 margin: 15px 0 14px;
915 }
916
917 ul.add-menu-item-tabs li.tabs {
918 padding: 13px 15px 14px;
919 }
920
921 .nav-menus-php .customlinkdiv .howto input {
922 width: 65%;
923 }
924
925 .nav-menus-php .quick-search {
926 width: 85%;
927 }
928
929 #menu-management-liquid {
930 margin-top: 25px;
931 }
932
933 .nav-menus-php .menu-name-label.howto span {
934 margin-top: 13px
935 }
936
937 #menu-name {
938 width: 100%;
939 }
940
941 .nav-menus-php #nav-menu-header .major-publishing-actions .publishing-action {
942 padding-top: 1em;
943 }
944
945 .nav-menus-php .delete-action {
946 font-size: 14px;
947 line-height: 2.14285714;
948 }
949
950 .menu-item-bar .menu-item-handle,
951 .menu-item-settings {
952 width: auto;
953 }
954
955 .menu-item-settings {
956 padding: 10px;
957 }
958
959 .menu-item-settings .description-group {
960 display: block;
961 }
962
963 .menu-item-settings input {
964 width: 100%;
965 }
966
967 .menu-item-settings input[type="checkbox"],
968 .menu-item-settings input[type="radio"] {
969 width: 25px;
970 }
971
972 .menu-settings-group {
973 padding-right: 0;
974 overflow: visible;
975 }
976
977 .menu-settings-group-name {
978 float: none;
979 width: auto;
980 margin-right: 0;
981 margin-bottom: 15px;
982 }
983
984 .menu-settings-input {
985 float: none;
986 margin-bottom: 15px;
987 }
988
989 .menu-edit .checkbox-input {
990 margin-top: 0;
991 }
992
993 .manage-menus select {
994 margin: 0.5em 0;
995 }
996
997 .wp-core-ui .manage-menus .button {
998 margin-bottom: 0;
999 }
1000
1001 .widefat .menu-locations .menu-location-title {
1002 padding-top: 16px;
1003 }
1004}
1005
1006@media only screen and (min-width: 783px) {
1007 @supports (position: sticky) and (scroll-margin-bottom: 130px) {
1008
1009 #nav-menu-footer {
1010 position: sticky;
1011 bottom: 0;
1012 z-index: 10;
1013 box-shadow: 0 -1px 0 0 #ddd;
1014 }
1015
1016 #save_menu_header {
1017 display: none;
1018 }
1019 }
1020}
1021
1022@media only screen and (max-width: 768px) {
1023 /* menu locations */
1024 #menu-locations-wrap .widefat {
1025 width: 100%;
1026 }
1027
1028 .bulk-select-button {
1029 padding: 5px 10px;
1030 }
1031}
1032