wp-includes/css/admin-bar.css

   1 #wpadminbar * {
   2         height: auto;
   3         width: auto;
   4         margin: 0;
   5         padding: 0;
   6         position: static;
   7         text-transform: none;
   8         letter-spacing: normal;
   9         line-height: 1;
  10         font: normal 13px/28px sans-serif;
  11         color: #ccc;
  12         text-shadow: #444 0px -1px 0px;
  13         -webkit-box-sizing: content-box;
  14         -moz-box-sizing:    content-box;
  15         box-sizing:         content-box;
  16         -webkit-transition: none;
  17         -moz-transition:    none;
  18         -o-transition:      none;
  19         transition:         none;
  20 }
  21
  22 #wpadminbar ul li:before,
  23 #wpadminbar ul li:after {
  24         content: normal;
  25 }
  26
  27 #wpadminbar a,
  28 #wpadminbar a:hover,
  29 #wpadminbar a img,
  30 #wpadminbar a img:hover {
  31         outline: none;
  32         border: none;
  33         text-decoration: none;
  34         background: none;
  35 }
  36
  37 #wpadminbar a:focus,
  38 #wpadminbar a:active,
  39 #wpadminbar input[type="text"],
  40 #wpadminbar input[type="password"],
  41 #wpadminbar input[type="number"],
  42 #wpadminbar input[type="search"],
  43 #wpadminbar input[type="email"],
  44 #wpadminbar input[type="url"],
  45 #wpadminbar select,
  46 #wpadminbar textarea,
  47 #wpadminbar div {
  48         outline: none;
  49 }
  50
  51 #wpadminbar {
  52         direction: ltr;
  53         color: #ccc;
  54         font: normal 13px/28px sans-serif;
  55         height: 28px;
  56         position: fixed;
  57         top: 0;
  58         left: 0;
  59         width: 100%;
  60         min-width: 600px; /* match the min-width of the body in wp-admin.css */
  61         z-index: 99999;
  62         background: #464646;
  63         background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #373737), color-stop(18%, #464646));
  64         background-image: -webkit-linear-gradient(bottom, #373737 0, #464646 5px);
  65         background-image:    -moz-linear-gradient(bottom, #373737 0, #464646 5px);
  66         background-image:      -o-linear-gradient(bottom, #373737 0, #464646 5px);
  67         background-image: linear-gradient(to top, #373737 0, #464646 5px);
  68 }
  69
  70 #wpadminbar .ab-sub-wrapper,
  71 #wpadminbar ul,
  72 #wpadminbar ul li {
  73         background: none;
  74         clear: none;
  75         list-style: none;
  76         margin: 0;
  77         padding: 0;
  78         position: relative;
  79         text-indent: 0;
  80         z-index: 99999;
  81 }
  82
  83 #wpadminbar .quicklinks {
  84         border-left: 1px solid transparent;
  85 }
  86
  87 #wpadminbar .quicklinks ul {
  88         text-align: left;
  89 }
  90
  91 #wpadminbar li {
  92         float: left;
  93 }
  94
  95 #wpadminbar .ab-empty-item {
  96         outline: none;
  97 }
  98
  99 #wpadminbar .quicklinks > ul > li {
 100         border-right: 1px solid #555;
 101 }
 102
 103 #wpadminbar .quicklinks > ul > li > a,
 104 #wpadminbar .quicklinks > ul > li > .ab-empty-item {
 105         border-right: 1px solid #333;
 106 }
 107
 108 #wpadminbar .quicklinks .ab-top-secondary > li {
 109         border-left: 1px solid #333;
 110         border-right: 0;
 111         float: right;
 112 }
 113
 114 #wpadminbar .quicklinks .ab-top-secondary > li > a,
 115 #wpadminbar .quicklinks .ab-top-secondary > li > .ab-empty-item {
 116         border-left: 1px solid #555;
 117         border-right: 0;
 118 }
 119
 120 #wpadminbar .quicklinks a,
 121 #wpadminbar .quicklinks .ab-empty-item,
 122 #wpadminbar .shortlink-input {
 123         height: 28px;
 124         display: block;
 125         padding: 0 12px;
 126         margin: 0;
 127 }
 128
 129 #wpadminbar .menupop .ab-sub-wrapper,
 130 #wpadminbar .shortlink-input {
 131         margin: 0 0 0 -1px;
 132         padding: 0;
 133         -webkit-box-shadow: 0 4px 4px rgba(0,0,0,0.2);
 134         box-shadow: 0 4px 4px rgba(0,0,0,0.2);
 135         background: #fff;
 136         display: none;
 137         position: absolute;
 138         float: none;
 139         border-width: 0 1px 1px 1px;
 140         border-style: solid;
 141         border-color: #dfdfdf;
 142 }
 143
 144 #wpadminbar.ie7 .menupop .ab-sub-wrapper,
 145 #wpadminbar.ie7 .shortlink-input {
 146         top: 28px;
 147         left: 0;
 148 }
 149
 150 #wpadminbar .ab-top-menu > .menupop > .ab-sub-wrapper {
 151         min-width: 100%;
 152 }
 153
 154 #wpadminbar .ab-top-secondary .menupop .ab-sub-wrapper {
 155         right: 0;
 156         left: auto;
 157         margin: 0 -1px 0 0;
 158 }
 159
 160 #wpadminbar .ab-sub-wrapper > .ab-submenu:first-child {
 161         border-top: none;
 162 }
 163
 164 #wpadminbar .ab-submenu {
 165         padding: 6px 0;
 166         border-top: 1px solid #dfdfdf;
 167 }
 168
 169 #wpadminbar .selected .shortlink-input {
 170         display: block;
 171 }
 172
 173 #wpadminbar .quicklinks .menupop ul li {
 174         float: none;
 175 }
 176
 177 #wpadminbar .quicklinks .menupop ul li a strong {
 178         font-weight: bold;
 179 }
 180
 181 #wpadminbar .quicklinks .menupop ul li .ab-item,
 182 #wpadminbar .quicklinks .menupop ul li a strong,
 183 #wpadminbar .quicklinks .menupop.hover ul li .ab-item,
 184 #wpadminbar.nojs .quicklinks .menupop:hover ul li .ab-item,
 185 #wpadminbar .shortlink-input {
 186         line-height: 26px;
 187         height: 26px;
 188         text-shadow: none;
 189         white-space: nowrap;
 190         min-width: 140px;
 191 }
 192
 193 #wpadminbar .shortlink-input {
 194         width: 200px;
 195 }
 196
 197 #wpadminbar.nojs li:hover > .ab-sub-wrapper,
 198 #wpadminbar li.hover > .ab-sub-wrapper {
 199         display: block;
 200 }
 201
 202 #wpadminbar .menupop li:hover > .ab-sub-wrapper,
 203 #wpadminbar .menupop li.hover > .ab-sub-wrapper {
 204         margin-left: 100%;
 205         margin-top: -33px;
 206         border-width: 1px;
 207 }
 208
 209 #wpadminbar .ab-top-secondary .menupop li:hover > .ab-sub-wrapper,
 210 #wpadminbar .ab-top-secondary .menupop li.hover > .ab-sub-wrapper {
 211         margin-left: 0;
 212         left: inherit;
 213         right: 100%;
 214 }
 215
 216 #wpadminbar .ab-top-menu > li:hover > .ab-item,
 217 #wpadminbar .ab-top-menu > li.hover > .ab-item,
 218 #wpadminbar .ab-top-menu > li > .ab-item:focus,
 219 #wpadminbar.nojq .quicklinks .ab-top-menu > li > .ab-item:focus {
 220         color: #fafafa;
 221         background: #222;
 222         background-image: -webkit-gradient(linear, left bottom, left top, from(#3a3a3a), to(#222));
 223         background-image: -webkit-linear-gradient(bottom, #3a3a3a, #222);
 224         background-image:    -moz-linear-gradient(bottom, #3a3a3a, #222);
 225         background-image:      -o-linear-gradient(bottom, #3a3a3a, #222);
 226         background-image: linear-gradient(to top, #3a3a3a, #222);
 227 }
 228
 229 #wpadminbar.nojs .ab-top-menu > li.menupop:hover > .ab-item,
 230 #wpadminbar .ab-top-menu > li.menupop.hover > .ab-item {
 231         background: #fff;
 232         color: #333;
 233         text-shadow: none;
 234         border-right-color: transparent;
 235         border-left-color: transparent;
 236 }
 237
 238 #wpadminbar .hover .ab-label,
 239 #wpadminbar.nojq .ab-item:focus .ab-label {
 240         color: #fafafa;
 241 }
 242
 243 #wpadminbar .menupop.hover .ab-label {
 244         color: #333;
 245         text-shadow: none;
 246 }
 247
 248 #wpadminbar .menupop li:hover,
 249 #wpadminbar .menupop li.hover,
 250 #wpadminbar .quicklinks .menupop .ab-item:focus,
 251 #wpadminbar .quicklinks .ab-top-menu .menupop .ab-item:focus {
 252         background-color: #eaf2fa;
 253 }
 254
 255 #wpadminbar .ab-submenu .ab-item {
 256         color: #333;
 257         text-shadow: none;
 258 }
 259
 260 #wpadminbar .quicklinks .menupop ul li a,
 261 #wpadminbar .quicklinks .menupop ul li a strong,
 262 #wpadminbar .quicklinks .menupop.hover ul li a,
 263 #wpadminbar.nojs .quicklinks .menupop:hover ul li a {
 264         color: #21759B;
 265 }
 266
 267 #wpadminbar .menupop .menupop > .ab-item {
 268         display: block;
 269         background-image: url(../images/admin-bar-sprite.png?d=20120830);
 270         background-position: 95% -20px;
 271         background-repeat: no-repeat;
 272         padding-right: 2em;
 273 }
 274
 275 #wpadminbar .ab-top-secondary .menupop .menupop > .ab-item {
 276         background-image: url(../images/admin-bar-sprite.png?d=20120830);
 277         background-position: 5% -46px;
 278         background-repeat: no-repeat;
 279         padding-left: 2em;
 280         padding-right: 1em;
 281 }
 282
 283 #wpadminbar .quicklinks .menupop ul.ab-sub-secondary {
 284         display: block;
 285         position: relative;
 286         right: auto;
 287         margin: 0;
 288         background: #eee;
 289         -webkit-box-shadow: none;
 290         box-shadow: none;
 291 }
 292
 293 #wpadminbar .quicklinks .menupop .ab-sub-secondary > li:hover,
 294 #wpadminbar .quicklinks .menupop .ab-sub-secondary > li.hover,
 295 #wpadminbar .quicklinks .menupop .ab-sub-secondary > li .ab-item:focus {
 296         background-color: #dfdfdf;
 297 }
 298
 299 #wpadminbar .quicklinks a span#ab-updates {
 300         background: #eee;
 301         color: #333;
 302         text-shadow: none;
 303         display: inline;
 304         padding: 2px 5px;
 305         font-size: 10px;
 306         font-weight: bold;
 307         -webkit-border-radius: 10px;
 308         border-radius: 10px;
 309 }
 310
 311 #wpadminbar .quicklinks a:hover span#ab-updates  {
 312         background: #fff;
 313         color: #000;
 314 }
 315
 316 #wpadminbar .ab-top-secondary {
 317         float: right;
 318         background: #464646;
 319         background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #373737), color-stop(18%, #464646));
 320         background-image: -webkit-linear-gradient(bottom, #373737 0, #464646 5px);
 321         background-image:    -moz-linear-gradient(bottom, #373737 0, #464646 5px);
 322         background-image:      -o-linear-gradient(bottom, #373737 0, #464646 5px);
 323         background-image: linear-gradient(to top, #373737 0, #464646 5px);
 324 }
 325
 326 #wpadminbar ul li:last-child,
 327 #wpadminbar ul li:last-child .ab-item {
 328         border-right: 0;
 329         -webkit-box-shadow: none;
 330         box-shadow: none;
 331 }
 332
 333 /**
 334  * My Account
 335  */
 336 #wp-admin-bar-my-account > ul {
 337         min-width: 198px;
 338 }
 339
 340 #wp-admin-bar-my-account.with-avatar > ul {
 341         min-width: 270px;
 342 }
 343
 344 #wpadminbar #wp-admin-bar-user-actions > li {
 345         margin-left: 16px;
 346         margin-right: 16px;
 347 }
 348
 349 #wpadminbar #wp-admin-bar-my-account.with-avatar #wp-admin-bar-user-actions > li {
 350         margin-left: 88px;
 351 }
 352
 353 #wp-admin-bar-user-actions > li > .ab-item {
 354         padding-left: 8px;
 355 }
 356
 357 #wpadminbar #wp-admin-bar-user-info {
 358         margin-top: 6px;
 359         margin-bottom: 15px;
 360         height: auto;
 361         background: none;
 362 }
 363
 364 #wp-admin-bar-user-info .avatar {
 365         position: absolute;
 366         left: -72px;
 367         top: 4px;
 368         width: 64px;
 369         height: 64px;
 370 }
 371
 372 #wpadminbar #wp-admin-bar-user-info a {
 373         background: none;
 374         height: auto;
 375 }
 376
 377 #wpadminbar #wp-admin-bar-user-info span {
 378         background: none;
 379         padding: 0;
 380         height: 18px;
 381 }
 382
 383 #wpadminbar #wp-admin-bar-user-info .display-name,
 384 #wpadminbar #wp-admin-bar-user-info .username {
 385         text-shadow: none;
 386         display: block;
 387 }
 388
 389 #wpadminbar #wp-admin-bar-user-info .display-name {
 390         color: #333;
 391 }
 392
 393 #wpadminbar #wp-admin-bar-user-info .username {
 394         color: #999;
 395         font-size: 11px;
 396 }
 397
 398 #wpadminbar .quicklinks li#wp-admin-bar-my-account.with-avatar > a img {
 399         width: 16px;
 400         height: 16px;
 401         border: 1px solid #999;
 402         padding: 0;
 403         background: #eee;
 404         line-height: 24px;
 405         vertical-align: middle;
 406         margin: -3px 0 0 6px;
 407         float: none;
 408         display: inline;
 409 }
 410
 411 /*
 412  * My Sites
 413  */
 414 #wpadminbar .quicklinks li .blavatar {
 415         vertical-align: middle;
 416         margin: -3px 4px 0 0;
 417         padding: 0;
 418 }
 419
 420 #wpadminbar .quicklinks li div.blavatar {
 421         background: url('../images/wpmini-blue.png') no-repeat;
 422         height: 16px;
 423         width: 16px;
 424         display: inline-block;
 425 }
 426
 427 /**
 428  * Search
 429  */
 430 #wpadminbar #wp-admin-bar-search .ab-item {
 431         padding: 0;
 432 }
 433
 434 #wpadminbar #wp-admin-bar-search .ab-item {
 435         /* default background */
 436         background: transparent;
 437 }
 438
 439 #wpadminbar #adminbarsearch {
 440         height: 28px;
 441         padding: 0 2px;
 442 }
 443
 444 #wpadminbar #adminbarsearch .adminbar-input {
 445         font: 13px/24px sans-serif;
 446         height: 24px;
 447         width: 24px;
 448         border: none;
 449         padding: 0 3px 0 23px;
 450         margin: 0;
 451         color: #ccc;
 452         text-shadow: #444 0px -1px 0px;
 453         background-color: rgba( 255, 255, 255, 0 );
 454         background-image: url(../images/admin-bar-sprite.png?d=20120830);
 455         background-position: 3px 2px;
 456         background-repeat: no-repeat;
 457         outline: none;
 458         cursor: pointer;
 459
 460         -webkit-border-radius: 3px;
 461         border-radius: 3px;
 462
 463         -webkit-box-shadow: none;
 464         box-shadow: none;
 465
 466         -moz-box-sizing: border-box;
 467         -webkit-box-sizing: border-box;
 468         -ms-box-sizing: border-box;
 469         box-sizing: border-box;
 470
 471         -webkit-transition-duration: 400ms;
 472         -webkit-transition-property: width, background;
 473         -webkit-transition-timing-function: ease;
 474         -moz-transition-duration: 400ms;
 475         -moz-transition-property: width, background;
 476         -moz-transition-timing-function: ease;
 477         -o-transition-duration: 400ms;
 478         -o-transition-property: width, background;
 479         -o-transition-timing-function: ease;
 480 }
 481
 482 #wpadminbar.ie7 #adminbarsearch .adminbar-input {
 483         margin-top: 1px;
 484         width: 120px;
 485 }
 486
 487 #wpadminbar #adminbarsearch .adminbar-input:focus {
 488         color: #555;
 489         text-shadow: 0 1px 0 #fff;
 490         width: 200px;
 491         background-color: rgba( 255, 255, 255, 0.9 );
 492         cursor: text;
 493 }
 494
 495 #wpadminbar.ie8 #adminbarsearch .adminbar-input {
 496         background-color: #464646;
 497 }
 498
 499 #wpadminbar.ie8 #adminbarsearch .adminbar-input:focus {
 500         background-color: #fff;
 501 }
 502
 503 /* Two rules to ensure browser recognition */
 504 #wpadminbar #adminbarsearch .adminbar-input::-webkit-input-placeholder {
 505         color: #ddd;
 506 }
 507
 508 #wpadminbar #adminbarsearch .adminbar-input:-moz-placeholder {
 509         color: #ddd;
 510 }
 511
 512 #wpadminbar #adminbarsearch .adminbar-button {
 513         display: none;
 514 }
 515
 516 /**
 517  * Site Menu
 518  */
 519 #wpadminbar #wp-admin-bar-appearance {
 520         border-top: none;
 521         margin-top: -12px;
 522 }
 523
 524 /**
 525  * Site Menu
 526  */
 527 #wpadminbar #wp-admin-bar-appearance {
 528         border-top: none;
 529         margin-top: -12px;
 530 }
 531
 532 /**
 533  * ICONS
 534  */
 535 #wpadminbar .ab-icon {
 536         position: relative;
 537         float: left;
 538         width: 16px;
 539         height: 16px;
 540         margin-top: 6px;
 541 }
 542
 543 #wpadminbar .ab-label {
 544         margin-left: 4px;
 545 }
 546
 547 /**
 548  * WP Logo icon
 549  */
 550 #wp-admin-bar-wp-logo > .ab-item .ab-icon {
 551         width: 20px;
 552         height: 20px;
 553         margin-top: 4px;
 554         background-image: url(../images/admin-bar-sprite.png?d=20120830);
 555         background-position: 0 -76px;
 556         background-repeat: no-repeat;
 557 }
 558
 559 #wpadminbar.nojs #wp-admin-bar-wp-logo:hover > .ab-item .ab-icon,
 560 #wpadminbar #wp-admin-bar-wp-logo.hover > .ab-item .ab-icon {
 561         background-position: 0 -104px;
 562 }
 563
 564 /**
 565  * Updates icon
 566  */
 567 #wp-admin-bar-updates > .ab-item .ab-icon {
 568         background-image: url(../images/admin-bar-sprite.png?d=20120830);
 569         background-position: -2px -159px;
 570         background-repeat: no-repeat;
 571 }
 572
 573 /**
 574  * Comments icon
 575  */
 576 #wp-admin-bar-comments > .ab-item .ab-icon {
 577         background-image: url(../images/admin-bar-sprite.png?d=20120830);
 578         background-position: -1px -134px;
 579         background-repeat: no-repeat;
 580 }
 581
 582 #wpadminbar span.count-0 {
 583         display: none;
 584 }
 585
 586 /**
 587  * Add New icon
 588  */
 589 #wpadminbar #wp-admin-bar-new-content > .ab-item .ab-icon {
 590         background-image: url(../images/admin-bar-sprite.png?d=20120830);
 591         background-position: -2px -182px;
 592         background-repeat: no-repeat;
 593 }
 594
 595 /**
 596  * Add New icon
 597  */
 598 #wpadminbar.nojs #wp-admin-bar-new-content:hover > .ab-item .ab-icon,
 599 #wpadminbar #wp-admin-bar-new-content.hover > .ab-item .ab-icon {
 600         background-position: -2px -203px;
 601 }
 602
 603 /**
 604  * Customize support classes
 605  */
 606 .no-customize-support .hide-if-no-customize,
 607 .customize-support .hide-if-customize,
 608 .no-customize-support.wp-core-ui .hide-if-no-customize,
 609 .no-customize-support .wp-core-ui .hide-if-no-customize,
 610 .customize-support.wp-core-ui .hide-if-customize,
 611 .customize-support .wp-core-ui .hide-if-customize {
 612         display: none;
 613 }
 614
 615 /**
 616  * Retina display 2x icons
 617  */
 618 @media print,
 619   (-o-min-device-pixel-ratio: 5/4),
 620   (-webkit-min-device-pixel-ratio: 1.25),
 621   (min-resolution: 120dpi) {
 622         #wpadminbar .menupop .menupop > .ab-item,
 623         #wpadminbar .ab-top-secondary .menupop .menupop > .ab-item,
 624         #wpadminbar #adminbarsearch .adminbar-input,
 625         #wp-admin-bar-wp-logo > .ab-item .ab-icon,
 626         #wp-admin-bar-updates > .ab-item .ab-icon,
 627         #wp-admin-bar-comments > .ab-item .ab-icon,
 628         #wpadminbar #wp-admin-bar-new-content > .ab-item .ab-icon {
 629                 background-image: url(../images/admin-bar-sprite-2x.png?d=20120830);
 630                 background-size: 20px 220px;
 631         }
 632
 633         #wpadminbar .quicklinks li div.blavatar {
 634                 background: url('../images/wpmini-blue-2x.png') no-repeat;
 635                 background-size: 16px 16px;
 636         }
 637 }
 638
 639 /* Skip link */
 640 #wpadminbar .screen-reader-text,
 641 #wpadminbar .screen-reader-text span {
 642         position: absolute;
 643         left: -1000em;
 644         top: -1000em;
 645         height: 1px;
 646         width: 1px;
 647         overflow: hidden;
 648 }
 649
 650 #wpadminbar .screen-reader-shortcut {
 651         position: absolute;
 652         top: -1000em;
 653 }
 654
 655 #wpadminbar .screen-reader-shortcut:focus {
 656         left: 6px;
 657         top: 7px;
 658         height: auto;
 659         width: auto;
 660         display: block;
 661         font-size: 14px;
 662         font-weight: bold;
 663         padding: 15px 23px 14px;
 664         background: #f1f1f1;
 665         color: #21759b;
 666         text-shadow: none;
 667         border-radius: 3px;
 668         z-index: 100000;
 669         line-height: normal;
 670         -webkit-box-shadow: 0 0 2px 2px rgba(0,0,0,.6);
 671         box-shadow: 0 0 2px 2px rgba(0,0,0,.6);
 672         text-decoration: none;
 673 }
 674
 675 /**
 676  * IE 6-targeted rules
 677  */
 678 * html #wpadminbar {
 679         overflow: hidden;
 680         position: absolute;
 681 }
 682
 683 * html #wpadminbar .quicklinks ul li a {
 684         float: left;
 685 }
 686
 687 * html #wpadminbar .menupop a span {
 688         background-image: none;
 689 }