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