wp-admin/css/nav-menu.dev.css

   1 /**
   2  * WordPress Administration Custom Navigation
   3  * Interface CSS
   4  *
   5  * @version 2.0.0
   6  *
   7  * @package WordPress
   8  * @subpackage Administration
   9  */
  10
  11 html,
  12 body {
  13         min-width: 950px;
  14 }
  15
  16 #nav-menus-frame {
  17         margin-left: 300px;
  18 }
  19
  20 #wpbody-content #menu-settings-column {
  21         display:inline;
  22         width:281px;
  23         margin-left: -300px;
  24         clear: both;
  25         float: left;
  26         padding-top: 24px;
  27 }
  28         .no-js #wpbody-content #menu-settings-column {
  29                 padding-top: 31px;
  30         }
  31
  32 #menu-settings-column .inside {
  33         clear: both;
  34         padding:0 10px;
  35 }
  36
  37 .metabox-holder-disabled .postbox {
  38         opacity: 0.5;
  39         filter: alpha(opacity=50);
  40 }
  41
  42 .metabox-holder-disabled .button-controls .select-all {
  43         display: none;
  44 }
  45 #wpbody {
  46         position: relative;
  47 }
  48
  49 /* Menu Container */
  50 #menu-management-liquid {
  51         float: left;
  52         min-width: 100%;
  53 }
  54 #menu-management {
  55         position: relative;
  56         margin-right: 20px;
  57         margin-top: -3px;
  58         width: 100%;
  59 }
  60         #menu-management .menu-edit {
  61                 margin-bottom: 20px;
  62         }
  63
  64         #nav-menu-header, #post-body, #nav-menu-footer {
  65                 border-color: #ccc;
  66                 border-style: solid;
  67         }
  68
  69         #nav-menu-header {
  70                 border-width: 1px 1px 0 1px;
  71                 -moz-border-radius-topleft: 6px;
  72                 -webkit-border-top-left-radius: 6px;
  73                 -khtml-border-top-left-radius: 6px;
  74                 border-top-left-radius: 6px;
  75                 -moz-border-radius-topright: 6px;
  76                 -webkit-border-top-right-radius: 6px;
  77                 -khtml-border-top-right-radius: 6px;
  78                 border-top-right-radius: 6px;
  79         }
  80
  81         #post-body {
  82                 background: #fff;
  83                 padding: 10px;
  84                 border-width: 0 1px;
  85         }
  86
  87         #post-body div.updated {
  88                 margin: 0;
  89         }
  90
  91         #post-body-content {
  92                 position: relative;
  93         }
  94
  95         #menu-management .menu-add-new abbr {
  96                 font-weight:bold;
  97         }
  98
  99 #nav-menu-footer {
 100         border-width: 0 1px 1px 1px;
 101         -moz-border-radius-bottomleft: 6px;
 102         -webkit-border-bottom-left-radius: 6px;
 103         -khtml-border-bottom-left-radius: 6px;
 104         border-bottom-left-radius: 6px;
 105         -moz-border-radius-bottomright: 6px;
 106         -webkit-border-bottom-right-radius: 6px;
 107         -khtml-border-bottom-right-radius: 6px;
 108         border-bottom-right-radius: 6px;
 109 }
 110
 111 /* Menu Tabs */
 112
 113 #menu-management .nav-tabs-nav {
 114         margin: 0 20px;
 115 }
 116
 117 #menu-management .nav-tabs-arrow {
 118         width: 10px;
 119         padding: 0 5px 4px;
 120         cursor: pointer;
 121         position: absolute;
 122         top: 0;
 123         line-height: 22px;
 124         font-size: 18px;
 125         text-shadow: 0 1px 0 #fff;
 126 }
 127         #menu-management .nav-tabs-arrow a { color: #C1C1C1; }
 128         #menu-management .nav-tabs-arrow a:hover { color: #D54E21; }
 129         #menu-management .nav-tabs-arrow a:active { color: #464646; }
 130         #menu-management .nav-tabs-arrow-left {
 131                 left: 0;
 132         }
 133         #menu-management .nav-tabs-arrow-right {
 134                 right: 0;
 135                 text-align: right;
 136         }
 137
 138
 139 #menu-management .nav-tabs-wrapper {
 140         width: 100%;
 141         height: 28px;
 142         margin-bottom: -1px;
 143         overflow: hidden;
 144 }
 145
 146 #menu-management .nav-tabs {
 147         padding-left: 20px;
 148         padding-right: 10px;
 149 }
 150 .js #menu-management .nav-tabs {
 151         float: left;
 152         margin-left: 0px;
 153         margin-right: -400px;
 154 }
 155
 156 #menu-management .nav-tab {
 157         margin-bottom: 0;
 158         background: #f4f4f4;
 159         font-weight: bold;
 160         border-color: #dfdfdf;
 161 }
 162
 163 #menu-management .nav-tab-active {
 164         border-color:#ccc;
 165 }
 166
 167 #select-nav-menu-container {
 168         text-align: right;
 169         padding: 0 10px 3px 10px;
 170         margin-bottom: 5px;
 171 }
 172         #select-nav-menu {
 173                 width: 100px;
 174                 display: inline;
 175         }
 176
 177 #menu-name-label {
 178         margin-top: -2px;
 179 }
 180
 181 #wpbody .open-label {
 182         display: block;
 183         float:left;
 184 }
 185 #wpbody .open-label span {
 186         padding-right: 10px;
 187 }
 188
 189         .js .input-with-default-title {
 190                 color: #aaa;
 191                 font-style: italic;
 192         }
 193
 194 #menu-management .inside { padding: 0 10px; }
 195
 196 /* Add Menu Item Boxes */
 197 .postbox .howto input {
 198         width: 180px;
 199         float: right;
 200 }
 201 .customlinkdiv .howto input {
 202         width: 210px;
 203 }
 204 #nav-menu-theme-locations .howto select {
 205         width: 100%;
 206 }
 207 #nav-menu-theme-locations .button-controls {
 208         text-align: right;
 209 }
 210 .add-menu-item-view-all {
 211         height: 400px;
 212 }
 213
 214 /* Button Primary Actions */
 215 #menu-container .submit { margin: 0px 0px 10px; padding: 0px; }
 216
 217 .meta-sep,
 218 .submitdelete,
 219 .submitcancel {
 220         display:block;
 221         float:left;
 222         font-size: 11px;
 223         margin: 4px 0;
 224         line-height: 15px;
 225 }
 226 .meta-sep {
 227         padding: 0 2px;
 228 }
 229
 230 #cancel-save { color: #ff0000; text-decoration: underline; font-size: 11px; margin-left: 20px; margin-top: 5px; }
 231 #cancel-save:hover { background-color: #FF0000; color: #fff; }
 232
 233 /* Button Secondary Actions */
 234 .list-controls { float: left; margin-top: 5px; }
 235 .add-to-menu {
 236         float: right;
 237 }
 238
 239 .postbox img.waiting {
 240         display: none;
 241         vertical-align: middle;
 242 }
 243
 244 .button-controls {
 245         clear:both;
 246         margin: 10px 0;
 247 }
 248 .show-all, .hide-all { cursor: pointer; }
 249 .hide-all { display: none; }
 250
 251 /* Create Menu */
 252 #menu-name { width: 270px; }
 253 #manage-menu .inside { padding: 0px 0px; }
 254
 255 /* Custom Links */
 256 #available-links dt { display: block; }
 257 #add-custom-link .howto { font-size: 11px; }
 258 #add-custom-link label span { display: block; float: left; margin-top: 5px; padding-right: 5px; }
 259 .menu-item-textbox { width: 180px; }
 260 .howto span { margin-top: 4px; display: block; float: left; }
 261
 262 /* Menu item types */
 263 .quick-search { width: 190px; }
 264 .list-wrap { display: none; clear: both; margin-bottom: 10px; }
 265 .list-container { max-height: 200px; overflow-y: auto; padding: 10px 10px 5px; border: 1px solid #DFDFDF; -moz-border-radius: 4px; }
 266 .postbox p.submit { margin-bottom: 0; }
 267
 268 /* Listings */
 269 .list li { display: none; margin: 0; margin-bottom: 5px; }
 270
 271 .list li .menu-item-title { cursor: pointer; display: block; }
 272 .list li .menu-item-title input { margin-right: 3px; margin-top: -3px; }
 273
 274 /* Nav Menu */
 275 #menu-container .inside { padding-bottom: 10px; }
 276
 277 .menu {
 278         padding-top:1em;
 279 }
 280
 281 #menu-to-edit {
 282         padding: 1em 0;
 283 }
 284
 285 .menu ul {
 286         width: 100%;
 287 }
 288 .menu ul.sub-menu {
 289 }
 290 .menu li {
 291         margin-bottom: 0;
 292         position:relative;
 293 }
 294 .menu-item-bar {
 295         clear:both;
 296         line-height:1.5em;
 297         position:relative;
 298         margin-top: 13px;
 299 }
 300 .menu-item-handle {
 301         border: 1px solid #E6E6E6;
 302         position: relative;
 303         padding-left: 10px;
 304         height: auto;
 305         width: 400px;
 306         line-height: 35px;
 307         text-shadow: 0 1px 0 #FFFFFF;
 308         font-weight:bold;
 309         overflow: hidden;
 310         border-radius: 6px;
 311         -webkit-border-radius: 6px;
 312         -moz-border-radius: 6px;
 313         -khtml-border-radius: 6px;
 314         word-wrap: break-word;
 315 }
 316 .menu-item-edit-active .menu-item-handle {
 317         -moz-border-radius: 6px 6px 0 0;
 318         -webkit-border-bottom-right-radius: 0;
 319         -webkit-border-bottom-left-radius: 0;
 320         -khtml-border-bottom-right-radius: 0;
 321         -khtml-border-bottom-left-radius: 0;
 322         border-bottom-right-radius: 0;
 323         border-bottom-left-radius: 0;
 324 }
 325 .no-js .menu-item-edit-active .item-edit {
 326         display: none;
 327 }
 328 .js .menu-item-handle {
 329         cursor: move;
 330 }
 331 .menu li.deleting .menu-item-handle {
 332         background-color: #f66;
 333         background-image: none;
 334         text-shadow: 0 0 0 #ccc;
 335 }
 336
 337 .menu-item-handle .item-title {
 338         padding: 7px 0;
 339         line-height: 20px;
 340         display:block;
 341         margin-right:13em;
 342 }
 343
 344 /* Sortables */
 345 li.menu-item.ui-sortable-helper dl {
 346         margin-top: 0;
 347 }
 348         li.menu-item.ui-sortable-helper .menu-item-transport dl {
 349                 margin-top: 13px;
 350         }
 351 .menu .sortable-placeholder {
 352         height: 35px;
 353         width: 410px;
 354         margin-top: 13px;
 355 }
 356
 357 /* WARNING: The factor of 30px is hardcoded into the nav-menus javascript. */
 358 .menu-item-depth-0 { margin-left: 0px; }
 359 .menu-item-depth-1 { margin-left: 30px; }
 360 .menu-item-depth-2 { margin-left: 60px; }
 361 .menu-item-depth-3 { margin-left: 90px; }
 362 .menu-item-depth-4 { margin-left: 120px; }
 363 .menu-item-depth-5 { margin-left: 150px; }
 364 .menu-item-depth-6 { margin-left: 180px; }
 365 .menu-item-depth-7 { margin-left: 210px; }
 366 .menu-item-depth-8 { margin-left: 240px; }
 367 .menu-item-depth-9 { margin-left: 270px; }
 368 .menu-item-depth-10 { margin-left: 300px; }
 369 .menu-item-depth-11 { margin-left: 330px; }
 370
 371 .menu-item-depth-0 .menu-item-transport { margin-left: 0px; }
 372 .menu-item-depth-1 .menu-item-transport { margin-left: -30px; }
 373 .menu-item-depth-2 .menu-item-transport { margin-left: -60px; }
 374 .menu-item-depth-3 .menu-item-transport { margin-left: -90px; }
 375 .menu-item-depth-4 .menu-item-transport { margin-left: -120px; }
 376 .menu-item-depth-5 .menu-item-transport { margin-left: -150px; }
 377 .menu-item-depth-6 .menu-item-transport { margin-left: -180px; }
 378 .menu-item-depth-7 .menu-item-transport { margin-left: -210px; }
 379 .menu-item-depth-8 .menu-item-transport { margin-left: -240px; }
 380 .menu-item-depth-9 .menu-item-transport { margin-left: -270px; }
 381 .menu-item-depth-10 .menu-item-transport { margin-left: -300px; }
 382 .menu-item-depth-11 .menu-item-transport { margin-left: -330px; }
 383
 384 body.menu-max-depth-0 { min-width: 950px !important; }
 385 body.menu-max-depth-1 { min-width: 980px !important; }
 386 body.menu-max-depth-2 { min-width: 1010px !important; }
 387 body.menu-max-depth-3 { min-width: 1040px !important; }
 388 body.menu-max-depth-4 { min-width: 1070px !important; }
 389 body.menu-max-depth-5 { min-width: 1100px !important; }
 390 body.menu-max-depth-6 { min-width: 1130px !important; }
 391 body.menu-max-depth-7 { min-width: 1160px !important; }
 392 body.menu-max-depth-8 { min-width: 1190px !important; }
 393 body.menu-max-depth-9 { min-width: 1220px !important; }
 394 body.menu-max-depth-10 { min-width: 1250px !important; }
 395 body.menu-max-depth-11 { min-width: 1280px !important; }
 396
 397 /* Menu item controls */
 398 .item-type { text-transform: uppercase; font-size: 11px; color: #999999; padding-right: 10px; }
 399 .item-controls { font-size: 11px; position: absolute; right: 20px; top: -1px; }
 400 .item-controls a { text-decoration: none; }
 401 .item-controls a:hover { cursor: pointer; }
 402 .item-controls .item-order { padding-right: 10px;}
 403 .item-controls .item-order a {
 404         font-weight:bold;
 405 }
 406
 407 body.js .item-order {
 408         display:none;
 409 }
 410
 411 .item-controls .menu-item-delete:hover { color: #ff0000; }
 412
 413 .item-edit {
 414         background: url("../images/menu-bits.gif?ver=20100610") no-repeat scroll 0 -105px;
 415         position: absolute;
 416         right: -20px;
 417         top: 0;
 418         display: block;
 419         width: 23px;
 420         height: 36px;
 421         overflow: hidden;
 422         text-indent:-999em;
 423         border-bottom: 1px solid #eee;
 424         -moz-border-radius-bottomleft: 3px;
 425         -webkit-border-bottom-left-radius: 3px;
 426         -khtml-border-bottom-left-radius: 3px;
 427         border-bottom-left-radius: 3px;
 428 }
 429
 430 /* Menu editing */
 431 .menu-instructions-inactive {
 432         display: none;
 433 }
 434 .menu-item-settings {
 435         background: #F9F9F9;
 436         display:block;
 437         width: 400px;
 438         padding: 10px 0 10px 10px;
 439         border: solid #E6E6E6;
 440         border-width: 0 1px 1px 1px;
 441         -moz-border-radius: 0 0 6px 6px;
 442         -webkit-border-bottom-right-radius: 6px;
 443         -webkit-border-bottom-left-radius: 6px;
 444         -khtml-border-bottom-right-radius: 6px;
 445         -khtml-border-bottom-left-radius: 6px;
 446 }
 447 .menu-item-edit-active .menu-item-settings {
 448         display:block;
 449 }
 450
 451 .menu-item-edit-inactive .menu-item-settings {
 452         display:none;
 453 }
 454
 455 .add-menu-item-pagelinks {
 456         margin:.5em auto;
 457         text-align:center;
 458 }
 459
 460 .link-to-original {
 461         display: block;
 462         margin: 0 0 10px;
 463         padding: 3px 5px 5px;
 464         font-size: 11px;
 465         color: #777;
 466         font-style: italic;
 467         border: 1px solid #dfdfdf;
 468         border-radius: 6px;
 469         -webkit-border-radius: 6px;
 470         -moz-border-radius: 6px;
 471         -khtml-border-radius: 6px;
 472 }
 473         .link-to-original a {
 474                 padding-left: 4px;
 475                 font-style: normal;
 476         }
 477
 478 .hidden-field {
 479         display: none;
 480 }
 481
 482 .menu-item-settings .description-thin,
 483 .menu-item-settings .description-wide {
 484         margin-right: 10px;
 485         float: left;
 486 }
 487 .description-thin {
 488         width: 190px;
 489         height: 40px;
 490 }
 491 .description-wide {
 492         width: 390px;
 493 }
 494
 495 .menu-item-actions {
 496         padding-top: 15px;
 497 }
 498
 499 #cancel-save { cursor: pointer; }
 500 #cancel-save:hover { color: #fff !important; }
 501 #update-menu-item { color: #fff !important; }
 502 #update-menu-item:hover,
 503 #update-menu-item:active,
 504 #update-menu-item:focus { color: #eaf2fa !important; border-color: #13455b !important; }
 505
 506 /* Major/minor publishing actions (classes) */
 507 .major-publishing-actions {
 508         clear:both;
 509         padding: 5px 10px;
 510 }
 511 .major-publishing-actions .publishing-action {
 512         text-align: right;
 513         float: right;
 514         line-height: 23px;
 515         margin: 5px 0 1px;
 516 }
 517 .major-publishing-actions .delete-action {
 518         vertical-align: middle;
 519         text-align: left;
 520         float: left;
 521         padding-right: 15px;
 522         margin-top: 5px;
 523 }
 524 .menu-name-label span, .auto-add-pages label {
 525         font-size: 11px;
 526         font-style: normal;
 527 }
 528 .menu-name-label {
 529         margin-right: 15px;
 530 }
 531 .auto-add-pages input {
 532         margin-top: 0;
 533 }
 534 .auto-add-pages {
 535         margin-top: 4px;
 536         float: left;
 537 }
 538 .submitbox .submitcancel {
 539         color: #21759B;
 540         border-bottom: 1px solid #21759B;
 541         padding: 1px 2px;
 542         text-decoration: none;
 543 }
 544 .submitbox .submitcancel:hover {
 545         background: #21759B;
 546         color: #fff;
 547 }
 548
 549 .major-publishing-actions .form-invalid {
 550         border-radius: 4px;
 551         -webkit-border-radius: 4px;
 552         -moz-border-radius: 4px;
 553         -khtml-border-radius: 4px;
 554         padding-left: 4px;
 555         margin-left: -4px;
 556 }
 557
 558 /* Clearfix */
 559 #menu-item-name-wrap:after,
 560 #menu-item-url-wrap:after,
 561 #menu-name-label:after,
 562 #menu-settings-column .inside:after,
 563 #nav-menus-frame:after,
 564 #post-body-content:after,
 565 .button-controls:after,
 566 .major-publishing-actions:after,
 567 .menu-item-settings:after {
 568         clear: both;
 569         content: ".";
 570         display: block;
 571         height: 0;
 572         visibility: hidden;
 573 }
 574 #nav-menus-frame, .button-controls, #menu-item-url-wrap, #menu-item-name-wrap { display: block; }