wp-admin/css/nav-menus-rtl.css

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