[Summary view] [Print] [Text view]

   1  html {
   2      --wp-admin--admin-bar--height: 32px;
   3      scroll-padding-top: var(--wp-admin--admin-bar--height);
   4  }
   5  
   6  #wpadminbar * {
   7      height: auto;
   8      width: auto;
   9      margin: 0;
  10      padding: 0;
  11      position: static;
  12      text-shadow: none;
  13      text-transform: none;
  14      letter-spacing: normal;
  15      font-size: 13px;
  16      font-weight: 400;
  17      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  18      font-style: normal;
  19      line-height: 2.46153846;
  20      border-radius: 0;
  21      box-sizing: content-box;
  22      transition: none;
  23      -webkit-font-smoothing: subpixel-antialiased; /* Prevent Safari from switching to standard antialiasing on hover */
  24      -moz-osx-font-smoothing: auto; /* Prevent Firefox from inheriting from themes that use other values */
  25  }
  26  
  27  .rtl #wpadminbar * {
  28      font-family: Tahoma, sans-serif;
  29  }
  30  
  31  html:lang(he-il) .rtl #wpadminbar * {
  32      font-family: Arial, sans-serif;
  33  }
  34  
  35  #wpadminbar .ab-empty-item {
  36      cursor: default;
  37      outline: none;
  38  }
  39  
  40  #wpadminbar .ab-empty-item,
  41  #wpadminbar a.ab-item,
  42  #wpadminbar > #wp-toolbar span.ab-label,
  43  #wpadminbar > #wp-toolbar span.noticon {
  44      color: #f0f0f1;
  45  }
  46  
  47  #wpadminbar #wp-admin-bar-site-name a.ab-item,
  48  #wpadminbar #wp-admin-bar-my-sites a.ab-item {
  49      white-space: nowrap;
  50  }
  51  
  52  #wpadminbar ul li::before,
  53  #wpadminbar ul li::after {
  54      content: normal;
  55  }
  56  
  57  #wpadminbar a,
  58  #wpadminbar a:hover,
  59  #wpadminbar a img,
  60  #wpadminbar a img:hover {
  61      border: none;
  62      text-decoration: none;
  63      background: none;
  64      box-shadow: none;
  65  }
  66  
  67  #wpadminbar a:focus,
  68  #wpadminbar a:active,
  69  #wpadminbar input[type="text"],
  70  #wpadminbar input[type="password"],
  71  #wpadminbar input[type="number"],
  72  #wpadminbar input[type="search"],
  73  #wpadminbar input[type="email"],
  74  #wpadminbar input[type="url"],
  75  #wpadminbar select,
  76  #wpadminbar textarea,
  77  #wpadminbar div {
  78      box-shadow: none;
  79  }
  80  
  81  #wpadminbar a:focus {
  82      outline-offset: -1px;
  83      /* Only visible in Windows High Contrast mode */
  84      outline: 2px solid transparent;
  85  }
  86  
  87  #wpadminbar {
  88      direction: ltr;
  89      color: #c3c4c7;
  90      font-size: 13px;
  91      font-weight: 400;
  92      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  93      line-height: 2.46153846;
  94      height: 32px;
  95      position: fixed;
  96      top: 0;
  97      left: 0;
  98      width: 100%;
  99      min-width: 600px; /* match the min-width of the body in wp-admin/css/common.css */
 100      z-index: 99999;
 101      background: #1d2327;
 102      /* Only visible in Windows High Contrast mode */
 103      outline: 1px solid transparent;
 104  }
 105  
 106  #wpadminbar .ab-sub-wrapper,
 107  #wpadminbar ul,
 108  #wpadminbar ul li {
 109      background: none;
 110      clear: none;
 111      list-style: none;
 112      margin: 0;
 113      padding: 0;
 114      position: relative;
 115      text-indent: 0;
 116      z-index: 99999;
 117  }
 118  
 119  #wpadminbar ul#wp-admin-bar-root-default > li {
 120      margin-right: 0;
 121  }
 122  
 123  #wpadminbar .quicklinks ul {
 124      text-align: left;
 125  }
 126  
 127  #wpadminbar li {
 128      float: left;
 129  }
 130  
 131  #wpadminbar .quicklinks a,
 132  #wpadminbar .quicklinks .ab-empty-item,
 133  #wpadminbar .shortlink-input {
 134      height: 32px;
 135      display: block;
 136      padding: 0 10px;
 137      margin: 0;
 138  }
 139  
 140  #wpadminbar .quicklinks > ul > li > a {
 141      padding: 0 8px 0 7px;
 142  }
 143  
 144  #wpadminbar .menupop .ab-sub-wrapper,
 145  #wpadminbar .shortlink-input {
 146      margin: 0;
 147      padding: 0;
 148      box-shadow: 0 3px 5px rgba(0, 0, 0, 0.2);
 149      background: #2c3338;
 150      display: none;
 151      position: absolute;
 152      float: none;
 153  }
 154  
 155  #wpadminbar .ab-top-menu > .menupop > .ab-sub-wrapper {
 156      min-width: 100%;
 157  }
 158  
 159  #wpadminbar .ab-top-secondary .menupop .ab-sub-wrapper {
 160      right: 0;
 161      left: auto;
 162  }
 163  
 164  #wpadminbar .ab-submenu {
 165      padding: 6px 0;
 166  }
 167  
 168  #wpadminbar .selected .shortlink-input {
 169      display: block;
 170  }
 171  
 172  #wpadminbar .quicklinks .menupop ul li {
 173      float: none;
 174  }
 175  
 176  #wpadminbar .quicklinks .menupop ul li a strong {
 177      font-weight: 600;
 178  }
 179  
 180  #wpadminbar .quicklinks .menupop ul li .ab-item,
 181  #wpadminbar .quicklinks .menupop ul li a strong,
 182  #wpadminbar .quicklinks .menupop.hover ul li .ab-item,
 183  #wpadminbar.nojs .quicklinks .menupop:hover ul li .ab-item,
 184  #wpadminbar .shortlink-input {
 185      line-height: 2;
 186      height: 26px;
 187      white-space: nowrap;
 188      min-width: 140px;
 189  }
 190  
 191  #wpadminbar .shortlink-input {
 192      width: 200px;
 193  }
 194  
 195  #wpadminbar.nojs li:hover > .ab-sub-wrapper,
 196  #wpadminbar li.hover > .ab-sub-wrapper {
 197      display: block;
 198      /* Only visible in Windows High Contrast mode */
 199      outline: 1px solid transparent;
 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: -32px;
 206  }
 207  
 208  #wpadminbar .ab-top-secondary .menupop li:hover > .ab-sub-wrapper,
 209  #wpadminbar .ab-top-secondary .menupop li.hover > .ab-sub-wrapper {
 210      margin-left: 0;
 211      left: inherit;
 212      right: 100%;
 213  }
 214  
 215  #wpadminbar:not(.mobile) .ab-top-menu > li > .ab-item:focus,
 216  #wpadminbar.nojq .quicklinks .ab-top-menu > li > .ab-item:focus,
 217  #wpadminbar:not(.mobile) .ab-top-menu > li:hover > .ab-item,
 218  #wpadminbar .ab-top-menu > li.hover > .ab-item {
 219      background: #2c3338;
 220      color: #72aee6;
 221  }
 222  
 223  #wpadminbar:not(.mobile) > #wp-toolbar li:hover span.ab-label,
 224  #wpadminbar > #wp-toolbar li.hover span.ab-label,
 225  #wpadminbar:not(.mobile) > #wp-toolbar a:focus span.ab-label {
 226      color: #72aee6;
 227  }
 228  
 229  #wpadminbar > #wp-toolbar > #wp-admin-bar-root-default .ab-icon,
 230  #wpadminbar .ab-icon,
 231  #wpadminbar .ab-item::before,
 232  .wp-admin-bar-arrow {
 233      position: relative;
 234      float: left;
 235      font: 400 20px/1 dashicons;
 236      padding: 4px 0;
 237      -webkit-font-smoothing: antialiased;
 238      -moz-osx-font-smoothing: grayscale;
 239      background-image: none !important;
 240      margin-right: 6px;
 241  }
 242  
 243  #wpadminbar .ab-icon::before,
 244  #wpadminbar .ab-item::before,
 245  #wpadminbar #adminbarsearch::before {
 246      position: relative;
 247      color: #a7aaad;
 248      color: rgba(240, 246, 252, 0.6);
 249      transition: color 0.1s ease-in-out;
 250  }
 251  
 252  #wpadminbar .ab-label {
 253      display: inline-block;
 254      height: 32px;
 255  }
 256  
 257  #wpadminbar .ab-submenu .ab-item {
 258      color: #c3c4c7;
 259      color: rgba(240, 246, 252, 0.7);
 260  }
 261  
 262  #wpadminbar .quicklinks .menupop ul li a,
 263  #wpadminbar .quicklinks .menupop ul li a strong,
 264  #wpadminbar .quicklinks .menupop.hover ul li a,
 265  #wpadminbar.nojs .quicklinks .menupop:hover ul li a {
 266      color: #c3c4c7;
 267      color: rgba(240, 246, 252, 0.7);
 268  }
 269  
 270  #wpadminbar .quicklinks .menupop ul li a:hover,
 271  #wpadminbar .quicklinks .menupop ul li a:focus,
 272  #wpadminbar .quicklinks .menupop ul li a:hover strong,
 273  #wpadminbar .quicklinks .menupop ul li a:focus strong,
 274  #wpadminbar .quicklinks .ab-sub-wrapper .menupop.hover > a,
 275  #wpadminbar .quicklinks .menupop.hover ul li a:hover,
 276  #wpadminbar .quicklinks .menupop.hover ul li a:focus,
 277  #wpadminbar .quicklinks .menupop.hover ul li div[tabindex]:hover,
 278  #wpadminbar .quicklinks .menupop.hover ul li div[tabindex]:focus,
 279  #wpadminbar.nojs .quicklinks .menupop:hover ul li a:hover,
 280  #wpadminbar.nojs .quicklinks .menupop:hover ul li a:focus,
 281  #wpadminbar li:hover .ab-icon::before,
 282  #wpadminbar li:hover .ab-item::before,
 283  #wpadminbar li a:focus .ab-icon::before,
 284  #wpadminbar li .ab-item:focus::before,
 285  #wpadminbar li .ab-item:focus .ab-icon::before,
 286  #wpadminbar li.hover .ab-icon::before,
 287  #wpadminbar li.hover .ab-item::before,
 288  #wpadminbar li:hover #adminbarsearch::before,
 289  #wpadminbar li #adminbarsearch.adminbar-focused::before {
 290      color: #72aee6;
 291  }
 292  
 293  #wpadminbar.mobile .quicklinks .ab-icon::before,
 294  #wpadminbar.mobile .quicklinks .ab-item::before {
 295      color: #c3c4c7;
 296  }
 297  
 298  #wpadminbar.mobile .quicklinks .hover .ab-icon::before,
 299  #wpadminbar.mobile .quicklinks .hover .ab-item::before {
 300      color: #72aee6;
 301  }
 302  
 303  #wpadminbar .menupop .menupop > .ab-item .wp-admin-bar-arrow::before,
 304  #wpadminbar .ab-top-secondary .menupop .menupop > .ab-item::before {
 305      position: absolute;
 306      font: 400 17px/1 dashicons;
 307      -webkit-font-smoothing: antialiased;
 308      -moz-osx-font-smoothing: grayscale;
 309  }
 310  
 311  #wpadminbar .menupop .menupop > .ab-item {
 312      display: block;
 313      padding-right: 2em;
 314  }
 315  
 316  #wpadminbar .menupop .menupop > .ab-item .wp-admin-bar-arrow::before {
 317      top: 1px;
 318      right: 10px;
 319      padding: 4px 0;
 320      content: "\f139";
 321      content: "\f139" / "";
 322      color: inherit;
 323  }
 324  
 325  #wpadminbar .ab-top-secondary .menupop .menupop > .ab-item {
 326      padding-left: 2em;
 327      padding-right: 1em;
 328  }
 329  
 330  #wpadminbar .ab-top-secondary .menupop .menupop > .ab-item .wp-admin-bar-arrow::before {
 331      top: 1px;
 332      left: 6px;
 333      content: "\f141";
 334      content: "\f141" / "";
 335  }
 336  
 337  #wpadminbar .quicklinks .menupop ul.ab-sub-secondary {
 338      display: block;
 339      position: relative;
 340      right: auto;
 341      margin: 0;
 342      box-shadow: none;
 343  }
 344  
 345  #wpadminbar .quicklinks .menupop ul.ab-sub-secondary,
 346  #wpadminbar .quicklinks .menupop ul.ab-sub-secondary .ab-submenu {
 347      background: #3c434a;
 348  }
 349  
 350  #wpadminbar .quicklinks .menupop .ab-sub-secondary > li > a:hover,
 351  #wpadminbar .quicklinks .menupop .ab-sub-secondary > li .ab-item:focus a {
 352      color: #72aee6;
 353  }
 354  
 355  #wpadminbar .quicklinks a span#ab-updates {
 356      background: #f0f0f1;
 357      color: #2c3338;
 358      display: inline;
 359      padding: 2px 5px;
 360      font-size: 10px;
 361      font-weight: 600;
 362      border-radius: 10px;
 363  }
 364  
 365  #wpadminbar .quicklinks a:hover span#ab-updates {
 366      background: #fff;
 367      color: #000;
 368  }
 369  
 370  #wpadminbar .ab-top-secondary {
 371      float: right;
 372  }
 373  
 374  #wpadminbar ul li:last-child,
 375  #wpadminbar ul li:last-child .ab-item {
 376      box-shadow: none;
 377  }
 378  
 379  /**
 380   * Recovery Mode
 381   */
 382  #wpadminbar #wp-admin-bar-recovery-mode {
 383      color: #fff;
 384      background-color: #d63638;
 385  }
 386  
 387  #wpadminbar .ab-top-menu > #wp-admin-bar-recovery-mode.hover > .ab-item,
 388  #wpadminbar.nojq .quicklinks .ab-top-menu > #wp-admin-bar-recovery-mode > .ab-item:focus,
 389  #wpadminbar:not(.mobile) .ab-top-menu > #wp-admin-bar-recovery-mode:hover > .ab-item,
 390  #wpadminbar:not(.mobile) .ab-top-menu > #wp-admin-bar-recovery-mode > .ab-item:focus {
 391      color: #fff;
 392      background-color: #d63638;
 393  }
 394  
 395  /**
 396   * My Account
 397   */
 398  #wp-admin-bar-my-account > ul {
 399      min-width: 198px;
 400  }
 401  
 402  #wp-admin-bar-my-account:not(.with-avatar) > .ab-item {
 403      display: inline-block;
 404  }
 405  
 406  #wp-admin-bar-my-account > .ab-item::before {
 407      content: "\f110";
 408      content: "\f110" / "";
 409      top: 2px;
 410      float: right;
 411      margin-left: 6px;
 412      margin-right: 0;
 413  }
 414  
 415  #wp-admin-bar-my-account.with-avatar > .ab-item::before {
 416      display: none;
 417      content: none;
 418  }
 419  
 420  #wp-admin-bar-my-account.with-avatar > ul {
 421      min-width: 270px;
 422  }
 423  
 424  #wpadminbar #wp-admin-bar-user-actions > li {
 425      margin-left: 16px;
 426      margin-right: 16px;
 427  }
 428  
 429  #wpadminbar #wp-admin-bar-user-actions.ab-submenu {
 430      padding: 6px 0 12px;
 431  }
 432  
 433  #wpadminbar #wp-admin-bar-my-account.with-avatar #wp-admin-bar-user-actions > li {
 434      margin-left: 88px;
 435  }
 436  
 437  #wpadminbar #wp-admin-bar-user-info {
 438      margin-top: 6px;
 439      margin-bottom: 15px;
 440      height: auto;
 441      background: none;
 442  }
 443  
 444  #wp-admin-bar-user-info .avatar {
 445      position: absolute;
 446      left: -72px;
 447      top: 4px;
 448      width: 64px;
 449      height: 64px;
 450      border-radius: 50%;
 451  }
 452  
 453  #wpadminbar #wp-admin-bar-user-info a {
 454      background: none;
 455      height: auto;
 456  }
 457  
 458  #wpadminbar #wp-admin-bar-user-info span {
 459      background: none;
 460      padding: 0;
 461      height: 18px;
 462  }
 463  
 464  #wpadminbar #wp-admin-bar-user-info .display-name,
 465  #wpadminbar #wp-admin-bar-user-info .username {
 466      display: block;
 467  }
 468  
 469  #wpadminbar #wp-admin-bar-user-info .username {
 470      color: #a7aaad;
 471      font-size: 11px;
 472  }
 473  
 474  #wpadminbar #wp-admin-bar-my-account.with-avatar > .ab-empty-item img,
 475  #wpadminbar #wp-admin-bar-my-account.with-avatar > a img {
 476      width: auto;
 477      height: 20px;
 478      padding: 0;
 479      border: 1px solid #2c353b;
 480      border-radius: 50%;
 481      background: #f0f0f1;
 482      line-height: 1.84615384;
 483      vertical-align: middle;
 484      margin: -4px 0 0 6px;
 485      float: none;
 486      display: inline;
 487  }
 488  
 489  /**
 490   * WP Logo
 491   */
 492  #wpadminbar #wp-admin-bar-wp-logo > .ab-item .ab-icon {
 493      width: 15px;
 494      height: 20px;
 495      margin-right: 0;
 496      padding: 6px 0 5px;
 497  }
 498  
 499  #wpadminbar #wp-admin-bar-wp-logo > .ab-item {
 500      padding: 0 7px;
 501  }
 502  
 503  #wpadminbar #wp-admin-bar-wp-logo > .ab-item .ab-icon::before {
 504      content: "\f120";
 505      content: "\f120" / "";
 506      top: 2px;
 507  }
 508  
 509  /*
 510   * My Sites & Site Title
 511   */
 512  #wpadminbar .quicklinks li .blavatar {
 513      display: inline-block;
 514      vertical-align: middle;
 515      font: 400 16px/1 dashicons !important;
 516      -webkit-font-smoothing: antialiased;
 517      -moz-osx-font-smoothing: grayscale;
 518      color: #f0f0f1;
 519  }
 520  
 521  #wpadminbar .quicklinks li a:hover .blavatar,
 522  #wpadminbar .quicklinks li a:focus .blavatar,
 523  #wpadminbar .quicklinks .ab-sub-wrapper .menupop.hover > a .blavatar {
 524      color: #72aee6;
 525  }
 526  
 527  #wpadminbar .quicklinks li img.blavatar,
 528  #wpadminbar .quicklinks li div.blavatar::before {
 529      height: 16px;
 530      width: 16px;
 531      margin: 0 8px 2px -2px;
 532  }
 533  
 534  #wpadminbar .quicklinks li img.blavatar {
 535      border-radius: 2px;
 536  }
 537  
 538  #wpadminbar .quicklinks li div.blavatar::before {
 539      content: "\f120";
 540      content: "\f120" / "";
 541      display: inline-block;
 542  }
 543  
 544  #wpadminbar #wp-admin-bar-appearance {
 545      margin-top: -12px;
 546  }
 547  
 548  #wpadminbar #wp-admin-bar-my-sites > .ab-item::before,
 549  #wpadminbar #wp-admin-bar-site-name > .ab-item::before {
 550      content: "\f541";
 551      content: "\f541" / "";
 552      top: 2px;
 553  }
 554  
 555  #wpadminbar #wp-admin-bar-site-editor > .ab-item::before {
 556      content: "\f100";
 557      content: "\f100" / "";
 558      top: 2px;
 559  }
 560  
 561  #wpadminbar #wp-admin-bar-customize > .ab-item::before {
 562      content: "\f540";
 563      content: "\f540" / "";
 564      top: 2px;
 565  }
 566  
 567  #wpadminbar #wp-admin-bar-edit > .ab-item::before {
 568      content: "\f464";
 569      content: "\f464" / "";
 570      top: 2px;
 571  }
 572  
 573  #wpadminbar #wp-admin-bar-site-name > .ab-item::before {
 574      content: "\f226";
 575      content: "\f226" / "";
 576  }
 577  
 578  .wp-admin #wpadminbar #wp-admin-bar-site-name > .ab-item::before {
 579      content: "\f102";
 580      content: "\f102" / "";
 581  }
 582  
 583  #wpadminbar #wp-admin-bar-site-name.has-site-icon > .ab-item {
 584      display: flex;
 585      align-items: center;
 586      gap: 6px;
 587  }
 588  
 589  #wpadminbar #wp-admin-bar-site-name.has-site-icon > .ab-item::before {
 590      content: none;
 591  }
 592  
 593  #wpadminbar #wp-admin-bar-site-name > .ab-item .site-icon {
 594      width: 20px;
 595      height: 20px;
 596      border-radius: 2px;
 597  }
 598  
 599  /**
 600   * Comments
 601   */
 602  #wpadminbar #wp-admin-bar-comments .ab-icon {
 603      margin-right: 6px;
 604  }
 605  
 606  #wpadminbar #wp-admin-bar-comments .ab-icon::before {
 607      content: "\f101";
 608      content: "\f101" / "";
 609      top: 3px;
 610  }
 611  
 612  /**
 613   * New Content
 614   */
 615  #wpadminbar #wp-admin-bar-new-content .ab-icon::before {
 616      content: "\f132";
 617      content: "\f132" / "";
 618      top: 4px;
 619  }
 620  
 621  /**
 622   * Updates
 623   */
 624  #wpadminbar #wp-admin-bar-updates .ab-icon::before {
 625      content: "\f463";
 626      content: "\f463" / "";
 627      top: 2px;
 628  }
 629  
 630  #wpadminbar #wp-admin-bar-updates.spin .ab-icon::before {
 631      display: inline-block;
 632      animation: rotation 2s infinite linear;
 633  }
 634  
 635  @media (prefers-reduced-motion: reduce) {
 636      #wpadminbar #wp-admin-bar-updates.spin .ab-icon::before {
 637          animation: none;
 638      }
 639  }
 640  
 641  /**
 642   * Search
 643   */
 644  #wpadminbar #wp-admin-bar-search .ab-item {
 645      padding: 0;
 646      background: transparent;
 647  }
 648  
 649  #wpadminbar #adminbarsearch {
 650      position: relative;
 651      height: 32px;
 652      padding: 0 2px;
 653      z-index: 1;
 654  }
 655  
 656  #wpadminbar #adminbarsearch::before {
 657      position: absolute;
 658      top: 6px;
 659      left: 5px;
 660      z-index: 20;
 661      font: 400 20px/1 dashicons !important;
 662      content: "\f179";
 663      content: "\f179" / "";
 664      speak: never;
 665      -webkit-font-smoothing: antialiased;
 666      -moz-osx-font-smoothing: grayscale;
 667  }
 668  
 669  /* The admin bar search field needs to reset many styles that might be inherited from the active Theme CSS. See ticket #40313. */
 670  #wpadminbar > #wp-toolbar > #wp-admin-bar-top-secondary > #wp-admin-bar-search #adminbarsearch input.adminbar-input {
 671      display: inline-block;
 672      float: none;
 673      position: relative;
 674      z-index: 30;
 675      font-size: 13px;
 676      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
 677      line-height: 1.84615384;
 678      text-indent: 0;
 679      height: 24px;
 680      width: 24px;
 681      max-width: none;
 682      padding: 0 3px 0 24px;
 683      margin: 0;
 684      color: #c3c4c7;
 685      background-color: rgba(255, 255, 255, 0);
 686      border: none;
 687      outline: none;
 688      cursor: pointer;
 689      box-shadow: none;
 690      box-sizing: border-box;
 691      transition-duration: 400ms;
 692      transition-property: width, background;
 693      transition-timing-function: ease;
 694  }
 695  
 696  #wpadminbar > #wp-toolbar > #wp-admin-bar-top-secondary > #wp-admin-bar-search #adminbarsearch input.adminbar-input:focus {
 697      z-index: 10;
 698      color: #000;
 699      width: 200px;
 700      background-color: rgba(255, 255, 255, 0.9);
 701      cursor: text;
 702      border: 0;
 703  }
 704  
 705  #wpadminbar #adminbarsearch .adminbar-button {
 706      display: none;
 707  }
 708  
 709  /**
 710   * Command Palette
 711   */
 712  #wpadminbar #wp-admin-bar-command-palette .ab-icon::before {
 713      content: "\f179";
 714      content: "\f179" / "";
 715      top: 3px;
 716  }
 717  
 718  #wpadminbar #wp-admin-bar-command-palette kbd {
 719      background: transparent;
 720  }
 721  
 722  /**
 723   * Customize support classes
 724   */
 725  .no-customize-support .hide-if-no-customize,
 726  .customize-support .hide-if-customize,
 727  .no-customize-support #wpadminbar .hide-if-no-customize,
 728  .no-customize-support.wp-core-ui .hide-if-no-customize,
 729  .no-customize-support .wp-core-ui .hide-if-no-customize,
 730  .customize-support #wpadminbar .hide-if-customize,
 731  .customize-support.wp-core-ui .hide-if-customize,
 732  .customize-support .wp-core-ui .hide-if-customize {
 733      display: none;
 734  }
 735  
 736  /**
 737   * Skip link
 738   */
 739  #wpadminbar .screen-reader-text,
 740  #wpadminbar .screen-reader-text span {
 741      border: 0;
 742      clip-path: inset(50%);
 743      height: 1px;
 744      margin: -1px;
 745      overflow: hidden;
 746      padding: 0;
 747      position: absolute;
 748      width: 1px;
 749      /* Many screen reader and browser combinations announce broken words as they would appear visually. */
 750      word-wrap: normal !important;
 751      word-break: normal !important;
 752  }
 753  
 754  #wpadminbar .screen-reader-shortcut {
 755      position: absolute;
 756      top: -1000em;
 757      left: 6px;
 758      height: auto;
 759      width: auto;
 760      display: block;
 761      font-size: 14px;
 762      font-weight: 600;
 763      padding: 15px 23px 14px;
 764      background: #f0f0f1;
 765      color: #2271b1;
 766      z-index: 100000;
 767      line-height: normal;
 768      text-decoration: none;
 769  }
 770  
 771  #wpadminbar .screen-reader-shortcut:focus {
 772      top: 7px;
 773      background: #f0f0f1;
 774      box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
 775  }
 776  
 777  /**
 778   * Media Queries
 779   */
 780  @media screen and (max-width: 782px) {
 781      html {
 782          --wp-admin--admin-bar--height: 46px;
 783      }
 784  
 785      /* Toolbar Touchification*/
 786      html #wpadminbar {
 787          height: 46px;
 788          min-width: 240px; /* match the min-width of the body in wp-admin/css/common.css */
 789      }
 790  
 791      #wpadminbar * {
 792          font-size: 14px;
 793          font-weight: 400;
 794          font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
 795          line-height: 2.28571428;
 796      }
 797  
 798      #wpadminbar .quicklinks > ul > li > a,
 799      #wpadminbar .quicklinks .ab-empty-item {
 800          padding: 0;
 801          height: 46px;
 802          line-height: 3.28571428;
 803          width: auto;
 804      }
 805  
 806      #wpadminbar .ab-icon {
 807          font: 40px/1 dashicons !important;
 808          margin: 0;
 809          padding: 0;
 810          width: 52px;
 811          height: 46px;
 812          text-align: center;
 813      }
 814  
 815      #wpadminbar .ab-icon::before {
 816          text-align: center;
 817      }
 818  
 819      #wpadminbar .ab-submenu {
 820          padding: 0;
 821      }
 822  
 823      #wpadminbar #wp-admin-bar-site-name a.ab-item,
 824      #wpadminbar #wp-admin-bar-my-sites a.ab-item,
 825      #wpadminbar #wp-admin-bar-my-account a.ab-item {
 826          text-overflow: clip;
 827      }
 828  
 829      #wpadminbar .quicklinks .menupop ul li .ab-item,
 830      #wpadminbar .quicklinks .menupop ul li a strong,
 831      #wpadminbar .quicklinks .menupop.hover ul li .ab-item,
 832      #wpadminbar.nojs .quicklinks .menupop:hover ul li .ab-item,
 833      #wpadminbar .shortlink-input {
 834          line-height: 1.6;
 835      }
 836  
 837      #wpadminbar .ab-label {
 838          border: 0;
 839          clip-path: inset(50%);
 840          height: 1px;
 841          margin: -1px;
 842          overflow: hidden;
 843          padding: 0;
 844          position: absolute;
 845          width: 1px;
 846          /* Many screen reader and browser combinations announce broken words as they would appear visually. */
 847          word-wrap: normal !important;
 848          word-break: normal !important;
 849      }
 850  
 851      #wpadminbar .menupop li:hover > .ab-sub-wrapper,
 852      #wpadminbar .menupop li.hover > .ab-sub-wrapper {
 853          margin-top: -46px;
 854      }
 855  
 856      #wpadminbar .ab-top-menu .menupop .ab-sub-wrapper .menupop > .ab-item {
 857          padding-right: 30px;
 858      }
 859  
 860      #wpadminbar .menupop .menupop > .ab-item::before {
 861          top: 10px;
 862          right: 6px;
 863      }
 864  
 865      #wpadminbar .ab-top-menu > .menupop > .ab-sub-wrapper .ab-item {
 866          font-size: 16px;
 867          padding: 8px 16px;
 868      }
 869  
 870      #wpadminbar .ab-top-menu > .menupop > .ab-sub-wrapper a:empty {
 871          display: none;
 872      }
 873  
 874      /* WP logo */
 875      #wpadminbar #wp-admin-bar-wp-logo > .ab-item {
 876          padding: 0;
 877      }
 878  
 879      #wpadminbar #wp-admin-bar-wp-logo > .ab-item .ab-icon {
 880          padding: 0;
 881          width: 52px;
 882          height: 46px;
 883          text-align: center;
 884          vertical-align: top;
 885      }
 886  
 887      #wpadminbar #wp-admin-bar-wp-logo > .ab-item .ab-icon::before {
 888          font: 28px/1 dashicons !important;
 889          top: -3px;
 890      }
 891  
 892      #wpadminbar .ab-icon,
 893      #wpadminbar .ab-item::before {
 894          padding: 0;
 895      }
 896  
 897      /* My Sites and "Site Title" menu */
 898      #wpadminbar #wp-admin-bar-my-sites > .ab-item,
 899      #wpadminbar #wp-admin-bar-site-name > .ab-item,
 900      #wpadminbar #wp-admin-bar-site-editor > .ab-item,
 901      #wpadminbar #wp-admin-bar-customize > .ab-item,
 902      #wpadminbar #wp-admin-bar-edit > .ab-item,
 903      #wpadminbar #wp-admin-bar-my-account > .ab-item {
 904          text-indent: 100%;
 905          white-space: nowrap;
 906          overflow: hidden;
 907          width: 52px;
 908          padding: 0;
 909          color: #a7aaad; /* @todo not needed? this text is hidden */
 910          position: relative;
 911      }
 912  
 913      #wpadminbar > #wp-toolbar > #wp-admin-bar-root-default .ab-icon,
 914      #wpadminbar .ab-icon,
 915      #wpadminbar .ab-item::before {
 916          padding: 0;
 917          margin-right: 0;
 918      }
 919  
 920      #wpadminbar #wp-admin-bar-edit > .ab-item::before,
 921      #wpadminbar #wp-admin-bar-my-sites > .ab-item::before,
 922      #wpadminbar #wp-admin-bar-site-name:not(.has-site-icon) > .ab-item::before,
 923      #wpadminbar #wp-admin-bar-site-editor > .ab-item::before,
 924      #wpadminbar #wp-admin-bar-customize > .ab-item::before,
 925      #wpadminbar #wp-admin-bar-my-account > .ab-item::before,
 926      #wpadminbar #wp-admin-bar-command-palette .ab-icon::before {
 927          display: block;
 928          text-indent: 0;
 929          font: 400 32px/1 dashicons;
 930          top: 7px;
 931          width: 52px;
 932          text-align: center;
 933          -webkit-font-smoothing: antialiased;
 934          -moz-osx-font-smoothing: grayscale;
 935      }
 936  
 937      /*
 938       * Flex prevents `text-indent` from hiding the site title, and is unused here
 939       * since the icon is positioned absolutely below.
 940       */
 941      #wpadminbar #wp-admin-bar-site-name.has-site-icon > .ab-item {
 942          display: block;
 943      }
 944  
 945      #wpadminbar #wp-admin-bar-site-name > .ab-item .site-icon {
 946          position: absolute;
 947          top: 9px;
 948          left: 12px;
 949          width: 28px;
 950          height: 28px;
 951          margin: 0;
 952          border-radius: 4px;
 953      }
 954  
 955      #wpadminbar #wp-admin-bar-appearance {
 956          margin-top: 0;
 957      }
 958  
 959      #wpadminbar .quicklinks li .blavatar::before {
 960          display: none;
 961      }
 962  
 963      /* Search */
 964      #wpadminbar #wp-admin-bar-search {
 965          display: none;
 966      }
 967  
 968      /* New Content */
 969      #wpadminbar #wp-admin-bar-new-content .ab-icon::before {
 970          top: 0;
 971          line-height: 1.26;
 972          height: 46px !important;
 973          text-align: center;
 974          width: 52px;
 975          display: block;
 976      }
 977  
 978      /* Updates */
 979      #wpadminbar #wp-admin-bar-updates {
 980          text-align: center;
 981      }
 982  
 983      #wpadminbar #wp-admin-bar-updates .ab-icon::before {
 984          top: 3px;
 985      }
 986  
 987      /* Comments and Command Palette */
 988      #wpadminbar #wp-admin-bar-comments .ab-icon,
 989      #wpadminbar #wp-admin-bar-command-palette .ab-icon {
 990          margin: 0;
 991      }
 992  
 993      #wpadminbar #wp-admin-bar-comments .ab-icon::before,
 994      #wpadminbar #wp-admin-bar-command-palette .ab-icon::before {
 995          display: block;
 996          font-size: 34px;
 997          height: 46px;
 998          line-height: 1.38235294;
 999          top: 0;
1000      }
1001  
1002      /* My Account */
1003      #wpadminbar #wp-admin-bar-my-account > a {
1004          position: relative;
1005          white-space: nowrap;
1006          text-indent: 150%; /* More than 100% indentation is needed since this element has padding */
1007          width: 28px;
1008          padding: 0 10px;
1009          overflow: hidden; /* Prevent link text from forcing horizontal scrolling on mobile */
1010      }
1011  
1012      #wpadminbar .quicklinks li#wp-admin-bar-my-account.with-avatar > a img {
1013          position: absolute;
1014          top: 12px;
1015          right: 10px;
1016          width: 28px;
1017          height: 28px;
1018          border-radius: 50%;
1019      }
1020  
1021      #wpadminbar #wp-admin-bar-user-actions.ab-submenu {
1022          padding: 0;
1023      }
1024  
1025      #wpadminbar #wp-admin-bar-user-actions.ab-submenu img.avatar {
1026          display: none;
1027      }
1028  
1029      #wpadminbar #wp-admin-bar-my-account.with-avatar #wp-admin-bar-user-actions > li {
1030          margin: 0;
1031      }
1032  
1033      #wpadminbar #wp-admin-bar-user-info .display-name {
1034          height: auto;
1035          font-size: 16px;
1036          line-height: 1.5;
1037          color: #f0f0f1;
1038      }
1039  
1040      #wpadminbar #wp-admin-bar-user-info a {
1041          padding-top: 4px;
1042      }
1043  
1044      #wpadminbar #wp-admin-bar-user-info .username {
1045          line-height: 0.8 !important;
1046          margin-bottom: -2px;
1047      }
1048  
1049      /* Show only default top level items */
1050      #wp-toolbar > ul > li {
1051          display: none;
1052      }
1053  
1054      #wpadminbar li#wp-admin-bar-menu-toggle,
1055      #wpadminbar li#wp-admin-bar-wp-logo,
1056      #wpadminbar li#wp-admin-bar-my-sites,
1057      #wpadminbar li#wp-admin-bar-updates,
1058      #wpadminbar li#wp-admin-bar-site-name,
1059      #wpadminbar li#wp-admin-bar-site-editor,
1060      #wpadminbar li#wp-admin-bar-customize,
1061      #wpadminbar li#wp-admin-bar-new-content,
1062      #wpadminbar li#wp-admin-bar-edit,
1063      #wpadminbar li#wp-admin-bar-comments,
1064      #wpadminbar li#wp-admin-bar-my-account,
1065      #wpadminbar li#wp-admin-bar-command-palette {
1066          display: block;
1067      }
1068  
1069      /* Allow dropdown list items to appear normally */
1070      #wpadminbar li:hover ul li,
1071      #wpadminbar li.hover ul li,
1072      #wpadminbar li:hover ul li:hover ul li {
1073          display: list-item;
1074      }
1075  
1076      /* Override default min-width so dropdown lists aren't stretched
1077          to 100% viewport width at responsive sizes. */
1078      #wpadminbar .ab-top-menu > .menupop > .ab-sub-wrapper {
1079          min-width: fit-content;
1080      }
1081  
1082      #wpadminbar ul#wp-admin-bar-root-default > li {
1083          margin-right: 0;
1084      }
1085  
1086      /* Experimental fix for touch toolbar dropdown positioning */
1087      #wpadminbar .ab-top-menu,
1088      #wpadminbar .ab-top-secondary,
1089      #wpadminbar #wp-admin-bar-wp-logo,
1090      #wpadminbar #wp-admin-bar-my-sites,
1091      #wpadminbar #wp-admin-bar-site-name,
1092      #wpadminbar #wp-admin-bar-updates,
1093      #wpadminbar #wp-admin-bar-comments,
1094      #wpadminbar #wp-admin-bar-new-content,
1095      #wpadminbar #wp-admin-bar-edit,
1096      #wpadminbar #wp-admin-bar-my-account,
1097      #wpadminbar #wp-admin-bar-command-palette {
1098          position: static;
1099      }
1100  
1101      .network-admin #wpadminbar ul#wp-admin-bar-top-secondary > li#wp-admin-bar-my-account {
1102          margin-right: 0;
1103      }
1104  
1105      /* Realign arrows on taller responsive submenus */
1106  
1107      #wpadminbar .ab-top-secondary .menupop .menupop > .ab-item::before {
1108          top: 10px;
1109          left: 0;
1110      }
1111  }
1112  
1113  /* Smartphone */
1114  @media screen and (max-width: 600px) {
1115      #wpadminbar {
1116          position: absolute;
1117      }
1118  
1119      #wp-responsive-overlay {
1120          position: fixed;
1121          top: 0;
1122          left: 0;
1123          width: 100%;
1124          height: 100%;
1125          z-index: 400;
1126      }
1127  
1128      #wpadminbar .ab-top-menu > .menupop > .ab-sub-wrapper {
1129          width: 100%;
1130          left: 0;
1131      }
1132  
1133      #wpadminbar .menupop .menupop > .ab-item::before {
1134          display: none;
1135      }
1136  
1137      #wpadminbar #wp-admin-bar-wp-logo.menupop .ab-sub-wrapper {
1138          margin-left: 0;
1139      }
1140  
1141      #wpadminbar .ab-top-menu > .menupop li > .ab-sub-wrapper {
1142          margin: 0;
1143          /* Make submenus full-width at this size */
1144          width: 100%;
1145          position: static;
1146          box-shadow: none;
1147      }
1148  
1149      #wpadminbar .ab-top-menu > .menupop li > .ab-sub-wrapper .ab-item {
1150          font-size: 16px;
1151          padding: 6px 15px 19px 30px;
1152      }
1153  
1154      #wpadminbar li:hover ul li ul li {
1155          display: list-item;
1156      }
1157  
1158      #wpadminbar li#wp-admin-bar-wp-logo,
1159      #wpadminbar li#wp-admin-bar-updates {
1160          display: none;
1161      }
1162  }
1163  
1164  /* Very narrow screens */
1165  @media screen and (max-width: 400px) {
1166      #wpadminbar li#wp-admin-bar-comments {
1167          display: none;
1168      }
1169  }