PHPXRef 0.7.1 : WordPress Trunk (Updated Daily) : /wp-admin/css/common.css source

[Summary view] [Print] [Text view]
   1  /* 2 column liquid layout */
   2  #wpwrap {
   3      height: auto;
   4      min-height: 100%;
   5      width: 100%;
   6      position: relative;
   7      -webkit-font-smoothing: subpixel-antialiased;
   8  }
   9  
  10  #wpcontent {
  11      height: 100%;
  12      padding-left: 20px;
  13  }
  14  
  15  #wpcontent,
  16  #wpfooter {
  17      margin-left: 160px;
  18  }
  19  
  20  .folded #wpcontent,
  21  .folded #wpfooter {
  22      margin-left: 36px;
  23  }
  24  
  25  #wpbody-content {
  26      padding-bottom: 65px;
  27      float: left;
  28      width: 100%;
  29      overflow: visible;
  30  }
  31  
  32  /* inner 2 column liquid layout */
  33  
  34  .inner-sidebar {
  35      float: right;
  36      clear: right;
  37      display: none;
  38      width: 281px;
  39      position: relative;
  40  }
  41  
  42  .columns-2 .inner-sidebar {
  43      margin-right: auto;
  44      width: 286px;
  45      display: block;
  46  }
  47  
  48  .inner-sidebar #side-sortables,
  49  .columns-2 .inner-sidebar #side-sortables {
  50      min-height: 300px;
  51      width: 280px;
  52      padding: 0;
  53  }
  54  
  55  .has-right-sidebar .inner-sidebar {
  56      display: block;
  57  }
  58  
  59  .has-right-sidebar #post-body {
  60      float: left;
  61      clear: left;
  62      width: 100%;
  63      margin-right: -2000px;
  64  }
  65  
  66  .has-right-sidebar #post-body-content {
  67      margin-right: 300px;
  68      float: none;
  69      width: auto;
  70  }
  71  
  72  /* 2 columns main area */
  73  
  74  #col-left {
  75      float: left;
  76      width: 35%;
  77  }
  78  
  79  #col-right {
  80      float: right;
  81      width: 65%;
  82  }
  83  
  84  #col-left .col-wrap {
  85      padding: 0 6px 0 0;
  86  }
  87  
  88  #col-right .col-wrap {
  89      padding: 0 0 0 6px;
  90  }
  91  
  92  /* utility classes */
  93  .alignleft {
  94      float: left;
  95  }
  96  
  97  .alignright {
  98      float: right;
  99  }
 100  
 101  .textleft {
 102      text-align: left;
 103  }
 104  
 105  .textright {
 106      text-align: right;
 107  }
 108  
 109  .clear {
 110      clear: both;
 111  }
 112  
 113  /* modern clearfix */
 114  .wp-clearfix:after {
 115      content: "";
 116      display: table;
 117      clear: both;
 118  }
 119  
 120  /* Hide visually but not from screen readers */
 121  .screen-reader-text,
 122  .screen-reader-text span,
 123  .ui-helper-hidden-accessible {
 124      border: 0;
 125      clip-path: inset(50%);
 126      height: 1px;
 127      margin: -1px;
 128      overflow: hidden;
 129      padding: 0;
 130      position: absolute;
 131      width: 1px;
 132      /* Many screen reader and browser combinations announce broken words as they would appear visually. */
 133      word-wrap: normal !important;
 134      word-break: normal !important;
 135  }
 136  
 137  .button .screen-reader-text {
 138      height: auto; /* Fixes a Safari+VoiceOver bug, see ticket #42006 */
 139  }
 140  
 141  .screen-reader-text + .dashicons-external {
 142      margin-top: -1px;
 143      margin-left: 2px;
 144      text-decoration: none;
 145  }
 146  
 147  .screen-reader-shortcut {
 148      position: absolute;
 149      top: -1000em;
 150      left: 6px;
 151      height: auto;
 152      width: auto;
 153      display: block;
 154      font-size: 14px;
 155      font-weight: 600;
 156      padding: 15px 23px 14px;
 157      /* Background and color set to prevent false positives in automated accessibility tests. */
 158      background: #ffffff;
 159      color: var(--wp-admin-theme-color, #3858e9);
 160      z-index: 100000;
 161      line-height: normal;
 162  }
 163  
 164  .screen-reader-shortcut:focus {
 165      top: -25px;
 166      /* Overrides a:focus in the admin. See ticket #56789. */
 167      color: var(--wp-admin-theme-color, #3858e9);
 168      box-shadow: 0 0 0 var(--wp-admin-border-width-focus, 1.5px) var(--wp-admin-theme-color, #3858e9);
 169      text-decoration: none;
 170      /* Only visible in Windows High Contrast mode */
 171      outline: 2px solid transparent;
 172      outline-offset: -2px;
 173  }
 174  
 175  .hidden,
 176  .js .closed .inside,
 177  .js .hide-if-js,
 178  .no-js .hide-if-no-js,
 179  .js.wp-core-ui .hide-if-js,
 180  .js .wp-core-ui .hide-if-js,
 181  .no-js.wp-core-ui .hide-if-no-js,
 182  .no-js .wp-core-ui .hide-if-no-js {
 183      display: none;
 184  }
 185  
 186  /* @todo: Take a second look. Large chunks of shared color, from the colors.css merge */
 187  .widget-top,
 188  .menu-item-handle,
 189  .widget-inside,
 190  #menu-settings-column .accordion-container,
 191  #menu-management .menu-edit,
 192  .manage-menus,
 193  table.widefat,
 194  .stuffbox,
 195  p.popular-tags,
 196  .widgets-holder-wrap,
 197  .wp-editor-container,
 198  .popular-tags,
 199  .feature-filter,
 200  .comment-ays {
 201      border: 1px solid #c3c4c7;
 202      box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
 203  }
 204  
 205  table.widefat,
 206  .wp-editor-container,
 207  .stuffbox,
 208  p.popular-tags,
 209  .widgets-holder-wrap,
 210  .popular-tags,
 211  .feature-filter,
 212  .comment-ays {
 213      background: #fff;
 214  }
 215  
 216  /* general */
 217  html,
 218  body {
 219      height: 100%;
 220      margin: 0;
 221      padding: 0;
 222  }
 223  
 224  body {
 225      background: #f0f0f1;
 226      color: #3c434a;
 227      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
 228      font-size: 13px;
 229      line-height: 1.4em;
 230      min-width: 600px;
 231  }
 232  
 233  body.iframe {
 234      min-width: 0;
 235      padding-top: 1px;
 236  }
 237  
 238  body.modal-open {
 239      overflow: hidden;
 240  }
 241  
 242  body.mobile.modal-open #wpwrap {
 243      overflow: hidden;
 244      position: fixed;
 245      height: 100%;
 246  }
 247  
 248  iframe,
 249  img {
 250      border: 0;
 251  }
 252  
 253  td {
 254      font-family: inherit;
 255      font-size: inherit;
 256      font-weight: inherit;
 257      line-height: inherit;
 258  }
 259  
 260  /* Any change to the default link style must be applied to button-link too. */
 261  a {
 262      color: #2271b1;
 263      transition-property: border, background, color;
 264      transition-duration: .05s;
 265      transition-timing-function: ease-in-out;
 266  }
 267  
 268  a,
 269  div {
 270      outline: 0;
 271  }
 272  
 273  a:hover,
 274  a:active {
 275      color: #135e96;
 276  }
 277  
 278  a:focus,
 279  a:focus .media-icon img,
 280  a:focus .plugin-icon,
 281  .wp-person a:focus .gravatar {
 282      color: #043959;
 283      border-radius: 2px;
 284      box-shadow: 0 0 0 var(--wp-admin-border-width-focus, 1.5px) var(--wp-admin-theme-color, #3858e9);
 285      /* Only visible in Windows High Contrast mode */
 286      outline: 2px solid transparent;
 287  }
 288  
 289  #adminmenu a:focus {
 290      box-shadow: none;
 291      /* Only visible in Windows High Contrast mode */
 292      outline: 1px solid transparent;
 293      outline-offset: -1px;
 294  }
 295  
 296  .screen-reader-text:focus {
 297      box-shadow: none;
 298      outline: none;
 299  }
 300  
 301  blockquote,
 302  q {
 303      quotes: none;
 304  }
 305  
 306  blockquote:before,
 307  blockquote:after,
 308  q:before,
 309  q:after {
 310      content: "";
 311      content: none;
 312  }
 313  
 314  p,
 315  .wp-die-message {
 316      font-size: 13px;
 317      line-height: 1.5;
 318      margin: 1em 0;
 319  }
 320  
 321  blockquote {
 322      margin: 1em;
 323  }
 324  
 325  li,
 326  dd {
 327      margin-bottom: 6px;
 328  }
 329  
 330  h1,
 331  h2,
 332  h3,
 333  h4,
 334  h5,
 335  h6 {
 336      display: block;
 337      font-weight: 600;
 338  }
 339  
 340  h1 {
 341      color: #1d2327;
 342      font-size: 2em;
 343      margin: .67em 0;
 344  }
 345  
 346  h2,
 347  h3 {
 348      color: #1d2327;
 349      font-size: 1.3em;
 350      margin: 1em 0;
 351  }
 352  
 353  .update-core-php h2 {
 354      margin-top: 4em;
 355  }
 356  
 357  .update-php h2,
 358  .update-messages h2,
 359  h4 {
 360      font-size: 1em;
 361      margin: 1.33em 0;
 362  }
 363  
 364  h5 {
 365      font-size: 0.83em;
 366      margin: 1.67em 0;
 367  }
 368  
 369  h6 {
 370      font-size: 0.67em;
 371      margin: 2.33em 0;
 372  }
 373  
 374  ul,
 375  ol {
 376      padding: 0;
 377  }
 378  
 379  ul {
 380      list-style: none;
 381  }
 382  
 383  ol {
 384      list-style-type: decimal;
 385      margin-left: 2em;
 386  }
 387  
 388  ul.ul-disc {
 389      list-style: disc outside;
 390  }
 391  
 392  ul.ul-square {
 393      list-style: square outside;
 394  }
 395  
 396  ol.ol-decimal {
 397      list-style: decimal outside;
 398  }
 399  
 400  ul.ul-disc,
 401  ul.ul-square,
 402  ol.ol-decimal {
 403      margin-left: 1.8em;
 404  }
 405  
 406  ul.ul-disc > li,
 407  ul.ul-square > li,
 408  ol.ol-decimal > li {
 409      margin: 0 0 0.5em;
 410  }
 411  
 412  /* rtl:ignore */
 413  .ltr {
 414      direction: ltr;
 415  }
 416  
 417  /* rtl:ignore */
 418  .code,
 419  code {
 420      font-family: Consolas, Monaco, monospace;
 421      direction: ltr;
 422      unicode-bidi: embed;
 423  }
 424  
 425  kbd,
 426  code {
 427      padding: 3px 5px 2px;
 428      margin: 0 1px;
 429      background: #f0f0f1;
 430      background: rgba(0, 0, 0, 0.07);
 431      font-size: 13px;
 432  }
 433  
 434  .subsubsub {
 435      list-style: none;
 436      margin: 8px 0 0;
 437      padding: 0;
 438      font-size: 13px;
 439      float: left;
 440      color: #646970;
 441  }
 442  
 443  .subsubsub a {
 444      line-height: 2;
 445      padding: .2em;
 446      text-decoration: none;
 447  }
 448  
 449  .subsubsub a .count,
 450  .subsubsub a.current .count {
 451      color: #50575e; /* #f1f1f1 background */
 452      font-weight: 400;
 453  }
 454  
 455  .subsubsub a.current {
 456      font-weight: 600;
 457      border: none;
 458  }
 459  
 460  .subsubsub li {
 461      display: inline-block;
 462      margin: 0;
 463      padding: 0;
 464      white-space: nowrap;
 465  }
 466  
 467  /* .widefat - main style for tables */
 468  .widefat {
 469      border-spacing: 0;
 470      width: 100%;
 471      clear: both;
 472      margin: 0;
 473  }
 474  
 475  .widefat * {
 476      word-wrap: break-word;
 477  }
 478  
 479  .widefat a,
 480  .widefat button.button-link {
 481      text-decoration: none;
 482  }
 483  
 484  .widefat td,
 485  .widefat th {
 486      padding: 8px 10px;
 487  }
 488  
 489  .widefat thead th,
 490  .widefat thead td {
 491      border-bottom: 1px solid #c3c4c7;
 492  }
 493  
 494  .widefat tfoot th,
 495  .widefat tfoot td {
 496      border-top: 1px solid #c3c4c7;
 497      border-bottom: none;
 498  }
 499  
 500  .widefat .no-items td {
 501      border-bottom-width: 0;
 502  }
 503  
 504  .widefat td {
 505      vertical-align: top;
 506  }
 507  
 508  .widefat td,
 509  .widefat td p,
 510  .widefat td ol,
 511  .widefat td ul {
 512      font-size: 13px;
 513      line-height: 1.5em;
 514  }
 515  
 516  .widefat th,
 517  .widefat thead td,
 518  .widefat tfoot td {
 519      text-align: left;
 520      line-height: 1.3em;
 521      font-size: 14px;
 522  }
 523  
 524  .widefat th input,
 525  .updates-table td input,
 526  .widefat thead td input,
 527  .widefat tfoot td input {
 528      margin: 0 0 0 8px;
 529      padding: 0;
 530      vertical-align: text-top;
 531  }
 532  
 533  .widefat .check-column {
 534      width: 2.2em;
 535      padding: 6px 0 25px;
 536      vertical-align: top;
 537  }
 538  
 539  .widefat tbody th.check-column {
 540      padding: 9px 0 22px;
 541  }
 542  
 543  .widefat thead td.check-column,
 544  .widefat tbody th.check-column,
 545  .updates-table tbody td.check-column,
 546  .widefat tfoot td.check-column {
 547      padding: 11px 0 0 3px;
 548  }
 549  
 550  .widefat thead td.check-column,
 551  .widefat tfoot td.check-column {
 552      padding-top: 4px;
 553      vertical-align: middle;
 554  }
 555  
 556  .update-php div.updated,
 557  .update-php div.error {
 558      margin-left: 0;
 559  }
 560  
 561  .js-update-details-toggle .dashicons {
 562      text-decoration: none;
 563  }
 564  
 565  .js-update-details-toggle[aria-expanded="true"] .dashicons::before {
 566      content: "\f142";
 567      content: "\f142" / '';
 568  }
 569  
 570  .no-js .widefat thead .check-column input,
 571  .no-js .widefat tfoot .check-column input {
 572      display: none;
 573  }
 574  
 575  .widefat .num,
 576  .column-comments,
 577  .column-links,
 578  .column-posts {
 579      text-align: center;
 580  }
 581  
 582  .widefat th#comments {
 583      vertical-align: middle;
 584  }
 585  
 586  .wrap {
 587      margin: 10px 20px 0 2px;
 588  }
 589  
 590  .wrap > h2:first-child, /* Back-compat for pre-4.4 */
 591  .wrap [class$="icon32"] + h2, /* Back-compat for pre-4.4 */
 592  .postbox .inside h2, /* Back-compat for pre-4.4 */
 593  .wrap h1 {
 594      font-size: 23px;
 595      font-weight: 400;
 596      margin: 0;
 597      padding: 9px 0 4px;
 598      line-height: 1.3;
 599  }
 600  
 601  .wrap h1.wp-heading-inline {
 602      display: inline-block;
 603      margin-right: 5px;
 604  }
 605  
 606  .wp-header-end {
 607      visibility: hidden;
 608      margin: -2px 0 0;
 609  }
 610  
 611  .subtitle {
 612      margin: 0;
 613      padding-left: 25px;
 614      color: #50575e;
 615      font-size: 14px;
 616      font-weight: 400;
 617      line-height: 1;
 618  }
 619  
 620  .subtitle strong {
 621      word-break: break-all;
 622  }
 623  
 624  .wrap .add-new-h2, /* deprecated */
 625  .wrap .add-new-h2:active, /* deprecated */
 626  .wrap .page-title-action,
 627  .wrap .page-title-action:active {
 628      display: inline-block;
 629      position: relative;
 630      box-sizing: border-box;
 631      cursor: pointer;
 632      white-space: nowrap;
 633      text-decoration: none;
 634      text-shadow: none;
 635      top: -3px;
 636      margin-left: 4px;
 637      border: 1px solid #2271b1;
 638      border-radius: 2px;
 639      background: transparent;
 640      font-size: 13px;
 641      font-weight: 500;
 642      min-height: 32px;
 643      line-height: 2.30769231; /* 30px for 32px height */
 644      color: #2271b1; /* use the standard color used for buttons */
 645      padding: 0 12px;
 646      -webkit-appearance: none;
 647  
 648  }
 649  
 650  .wrap .wp-heading-inline + .page-title-action {
 651      margin-left: 0;
 652  }
 653  
 654  .wrap .add-new-h2:hover, /* deprecated */
 655  .wrap .page-title-action:hover {
 656      border-color: #0a4b78;
 657      color: #0a4b78;
 658  }
 659  
 660  /* lower specificity: color needs to be overridden by :hover and :active */
 661  .page-title-action:focus {
 662      color: #0a4b78;
 663  }
 664  
 665  /* Dashicon for language options on General Settings and Profile screens */
 666  .form-table th label[for="locale"] .dashicons,
 667  .form-table th label[for="WPLANG"] .dashicons {
 668      margin-left: 5px;
 669  }
 670  
 671  .wrap .page-title-action:focus {
 672      border-color: #3582c4;
 673      box-shadow: 0 0 0 1px #3582c4;
 674      /* Only visible in Windows High Contrast mode */
 675      outline: 2px solid transparent;
 676  }
 677  
 678  .wrap h1.long-header {
 679      padding-right: 0;
 680  }
 681  
 682  .wp-dialog {
 683      background-color: #fff;
 684  }
 685  
 686  .widgets-chooser ul,
 687  #widgets-left .widget-in-question .widget-top,
 688  #available-widgets .widget-top:hover,
 689  div#widgets-right .widget-top:hover,
 690  #widgets-left .widget-top:hover {
 691      border-color: #8c8f94;
 692      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
 693  }
 694  
 695  .sorthelper {
 696      background-color: #c5d9ed;
 697  }
 698  
 699  .ac_match,
 700  .subsubsub a.current {
 701      color: #000;
 702  }
 703  
 704  .striped > tbody > :nth-child(odd),
 705  ul.striped > :nth-child(odd),
 706  .alternate {
 707      background-color: #f6f7f7;
 708  }
 709  
 710  .bar {
 711      background-color: #f0f0f1;
 712      border-right-color: var(--wp-admin-theme-color);
 713  }
 714  
 715  /* Helper classes for plugins to leverage the active WordPress color scheme */
 716  
 717  .highlight {
 718      background-color: rgba(var(--wp-admin-theme-color--rgb), 0.08);
 719      color: #3c434a;
 720  }
 721  
 722  .wp-ui-primary {
 723      color: #fff;
 724      background-color: #2c3338;
 725  }
 726  .wp-ui-text-primary {
 727      color: #2c3338;
 728  }
 729  
 730  .wp-ui-highlight {
 731      color: #fff;
 732      background-color: #2271b1;
 733  }
 734  .wp-ui-text-highlight {
 735      color: #2271b1;
 736  }
 737  
 738  .wp-ui-notification {
 739      color: #fff;
 740      background-color: #d63638;
 741  }
 742  .wp-ui-text-notification {
 743      color: #d63638;
 744  }
 745  
 746  .wp-ui-text-icon {
 747      color: #8c8f94; /* same as new icons */
 748  }
 749  
 750  /* For emoji replacement images */
 751  img.emoji {
 752      display: inline !important;
 753      border: none !important;
 754      height: 1em !important;
 755      width: 1em !important;
 756      margin: 0 .07em !important;
 757      vertical-align: -0.1em !important;
 758      background: none !important;
 759      padding: 0 !important;
 760      box-shadow: none !important;
 761  }
 762  
 763  /*------------------------------------------------------------------------------
 764    1.0 - Text Styles
 765  ------------------------------------------------------------------------------*/
 766  
 767  .widget .widget-top,
 768  .postbox .hndle,
 769  .stuffbox .hndle,
 770  .control-section .accordion-section-title,
 771  .sidebar-name,
 772  #nav-menu-header,
 773  #nav-menu-footer,
 774  .menu-item-handle,
 775  .checkbox,
 776  .side-info,
 777  #your-profile #rich_editing,
 778  .widefat thead th,
 779  .widefat thead td,
 780  .widefat tfoot th,
 781  .widefat tfoot td {
 782      line-height: 1.4em;
 783  }
 784  
 785  .widget .widget-top,
 786  .menu-item-handle {
 787      background: #f6f7f7;
 788      color: #1d2327;
 789  }
 790  
 791  .stuffbox .hndle {
 792      border-bottom: 1px solid #c3c4c7;
 793  }
 794  
 795  .quicktags {
 796      background-color: #c3c4c7;
 797      color: #000;
 798      font-size: 12px;
 799  }
 800  
 801  .icon32 {
 802      display: none;
 803  }
 804  
 805  /* @todo can we combine these into a class or use an existing dashicon one? */
 806  .welcome-panel .welcome-panel-close:before,
 807  .tagchecklist .ntdelbutton .remove-tag-icon:before,
 808  #bulk-titles .ntdelbutton:before,
 809  .notice-dismiss:before {
 810      background: none;
 811      color: #1e1e1e;
 812      content: "\f335";
 813      content: "\f335" / '';
 814      display: block;
 815      font: normal 20px/1 dashicons;
 816      height: 1em;
 817      text-align: center;
 818      width: 1em;
 819      -webkit-font-smoothing: antialiased;
 820      -moz-osx-font-smoothing: grayscale;
 821  }
 822  
 823  .welcome-panel .welcome-panel-close:before {
 824      margin: 0;
 825  }
 826  
 827  .tagchecklist .ntdelbutton .remove-tag-icon:before {
 828      margin-left: 2px;
 829      border-radius: 50%;
 830      color: var(--wp-admin-theme-color, #3858e9);
 831      /* vertically center the icon cross browsers */
 832      line-height: 1.1;
 833  }
 834  
 835  .tagchecklist .ntdelbutton:focus {
 836      outline: 0;
 837  }
 838  
 839  .tagchecklist .ntdelbutton:hover .remove-tag-icon:before,
 840  .tagchecklist .ntdelbutton:focus .remove-tag-icon:before,
 841  #bulk-titles .ntdelbutton:hover:before,
 842  #bulk-titles .ntdelbutton:focus:before {
 843      color: #d63638;
 844  }
 845  
 846  .tagchecklist .ntdelbutton:focus .remove-tag-icon:before {
 847      box-shadow: 0 0 0 var(--wp-admin-border-width-focus, 1.5px) var(--wp-admin-theme-color, #3858e9);
 848      /* Only visible in Windows High Contrast mode */
 849      outline: 2px solid transparent;
 850  }
 851  
 852  .key-labels label {
 853      line-height: 24px;
 854  }
 855  
 856  strong, b {
 857      font-weight: 600;
 858  }
 859  
 860  .pre {
 861      /* https://developer.mozilla.org/en-US/docs/CSS/white-space */
 862      white-space: pre-wrap; /* css-3 */
 863      word-wrap: break-word; /* IE 5.5 - 7 */
 864  }
 865  
 866  .howto {
 867      color: #646970;
 868      display: block;
 869  }
 870  
 871  p.install-help {
 872      margin: 8px 0;
 873      font-style: italic;
 874  }
 875  
 876  .no-break {
 877      white-space: nowrap;
 878  }
 879  
 880  hr {
 881      border: 0;
 882      border-top: 1px solid #dcdcde;
 883      border-bottom: 1px solid #f6f7f7;
 884  }
 885  
 886  .row-actions span.delete a,
 887  .row-actions span.trash a,
 888  .row-actions span.spam a,
 889  .plugins a.delete,
 890  #all-plugins-table .plugins a.delete,
 891  #search-plugins-table .plugins a.delete,
 892  .submitbox .submitdelete,
 893  #media-items a.delete,
 894  #media-items a.delete-permanently,
 895  #nav-menu-footer .menu-delete,
 896  #delete-link a.delete,
 897  a#remove-post-thumbnail,
 898  .privacy_requests .remove-personal-data .remove-personal-data-handle {
 899      color: #b32d2e;
 900  }
 901  
 902  abbr.required,
 903  span.required,
 904  .file-error,
 905  .row-actions .delete a:hover,
 906  .row-actions .trash a:hover,
 907  .row-actions .spam a:hover,
 908  .plugins a.delete:hover,
 909  #all-plugins-table .plugins a.delete:hover,
 910  #search-plugins-table .plugins a.delete:hover,
 911  .submitbox .submitdelete:hover,
 912  #media-items a.delete:hover,
 913  #media-items a.delete-permanently:hover,
 914  #nav-menu-footer .menu-delete:hover,
 915  #delete-link a.delete:hover,
 916  a#remove-post-thumbnail:hover,
 917  .privacy_requests .remove-personal-data .remove-personal-data-handle:hover {
 918      color: #b32d2e;
 919      border: none;
 920  }
 921  
 922  .application-password-display .success {
 923      color: #007017;
 924      margin-left: 0.5rem;
 925  }
 926  
 927  /*------------------------------------------------------------------------------
 928    3.0 - Actions
 929  ------------------------------------------------------------------------------*/
 930  
 931  #major-publishing-actions {
 932      padding: 10px;
 933      clear: both;
 934      border-top: 1px solid #dcdcde;
 935      background: #f6f7f7;
 936      display: flex;
 937      flex-wrap: wrap;
 938      align-items: center;
 939      justify-content: space-between;
 940  }
 941  
 942  #delete-action {
 943      line-height: 2.30769231; /* 30px */
 944  }
 945  
 946  #delete-link a {
 947      text-decoration: none;
 948  }
 949  
 950  #publishing-action {
 951      text-align: right;
 952      margin-left: auto;
 953      line-height: 1.9;
 954  }
 955  
 956  #publishing-action .spinner {
 957      float: none;
 958  }
 959  
 960  #misc-publishing-actions {
 961      padding: 6px 0 0;
 962  }
 963  
 964  .misc-pub-section {
 965      padding: 6px 10px 8px;
 966  }
 967  
 968  .word-wrap-break-word,
 969  .misc-pub-filename {
 970      word-wrap: break-word;
 971  }
 972  
 973  #minor-publishing-actions {
 974      padding: 10px 10px 0;
 975      text-align: right;
 976  }
 977  
 978  #save-post {
 979      float: left;
 980  }
 981  
 982  .preview {
 983      float: right;
 984  }
 985  
 986  #sticky-span {
 987      margin-left: 18px;
 988  }
 989  
 990  .approve,
 991  .unapproved .unapprove {
 992      display: none;
 993  }
 994  
 995  .unapproved .approve,
 996  .spam .approve,
 997  .trash .approve {
 998      display: inline;
 999  }
1000  
1001  td.action-links,
1002  th.action-links {
1003      text-align: right;
1004  }
1005  
1006  #misc-publishing-actions .notice {
1007      margin-left: 10px;
1008      margin-right: 10px;
1009  }
1010  
1011  /* Filter bar */
1012  .wp-filter {
1013      display: inline-block;
1014      position: relative;
1015      box-sizing: border-box;
1016      margin: 12px 0 25px;
1017      padding: 0 10px;
1018      width: 100%;
1019      box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
1020      border: 1px solid #c3c4c7;
1021      background: #fff;
1022      color: #50575e;
1023      font-size: 13px;
1024  }
1025  
1026  .wp-filter a {
1027      text-decoration: none;
1028  }
1029  
1030  .filter-count {
1031      display: inline-block;
1032      vertical-align: middle;
1033      min-width: 4em;
1034  }
1035  
1036  .title-count,
1037  .filter-count .count {
1038      display: inline-block;
1039      position: relative;
1040      top: -1px;
1041      padding: 4px 10px;
1042      border-radius: 30px;
1043      background: #646970;
1044      color: #fff;
1045      font-size: 14px;
1046      font-weight: 600;
1047  }
1048  
1049  /* not a part of filter bar, but derived from it, so here for now */
1050  .title-count {
1051      display: inline;
1052      top: -3px;
1053      margin-left: 5px;
1054      margin-right: 20px;
1055  }
1056  
1057  .filter-items {
1058      float: left;
1059  }
1060  
1061  .filter-links {
1062      display: inline-block;
1063      margin: 0;
1064  }
1065  
1066  .filter-links li {
1067      display: inline-block;
1068      margin: 0;
1069  }
1070  
1071  .filter-links li > a {
1072      display: inline-block;
1073      margin: 0 10px;
1074      padding: 15px 0;
1075      border-bottom: 4px solid #fff;
1076      color: #646970;
1077      cursor: pointer;
1078  }
1079  
1080  .filter-links .current {
1081      box-shadow: none;
1082      border-bottom: 4px solid var(--wp-admin-theme-color);
1083      color: #1d2327;
1084  }
1085  
1086  .filter-links li > a:hover,
1087  .filter-links li > a:focus,
1088  .show-filters .filter-links a.current:hover,
1089  .show-filters .filter-links a.current:focus {
1090      color: var(--wp-admin-theme-color);
1091  }
1092  
1093  .wp-filter .search-form {
1094      float: right;
1095      display: flex;
1096      align-items: center;
1097      column-gap: .5rem;
1098  }
1099  
1100  .wp-filter .search-form input[type="search"] {
1101      width: 280px;
1102      max-width: 100%;
1103  }
1104  
1105  .wp-filter .search-form select {
1106      margin: 0;
1107  }
1108  
1109  .wp-filter .search-form input[type="search"] {
1110      min-height: 32px;
1111      padding: 0 8px;
1112  }
1113  
1114  .wp-filter .search-form select,
1115  .wp-filter .filter-items select {
1116      min-height: 32px;
1117      line-height: 2.14285714; /* 30px for 32px height with 14px font */
1118      padding: 0 24px 0 8px;
1119  }
1120  
1121  .wp-filter .button {
1122      min-height: 32px;
1123      line-height: 2.30769231; /* 30px for 32px height with 13px font */
1124      padding: 0 12px;
1125  }
1126  
1127  /* Use flexbox only on the plugins install page and upload page. The `filter-links` and search form children will become flex items. */
1128  .plugin-install-php .wp-filter,
1129  .upload-php .wp-filter {
1130      display: flex;
1131      flex-wrap: wrap;
1132      justify-content: space-between;
1133      align-items: center;
1134  }
1135  
1136  .wp-filter .search-form.search-plugins select,
1137  .wp-filter .search-form.search-plugins .wp-filter-search,
1138  .no-js .wp-filter .search-form.search-plugins .button {
1139      display: inline-block;
1140      vertical-align: top;
1141  }
1142  
1143  .wp-filter .button.drawer-toggle {
1144      margin: 10px 9px 0;
1145      padding: 0 10px 0 6px;
1146      border-color: transparent;
1147      background-color: transparent;
1148      color: #646970;
1149      vertical-align: baseline;
1150      box-shadow: none;
1151  }
1152  
1153  .wp-filter .drawer-toggle:before {
1154      content: "\f111";
1155      content: "\f111" / '';
1156      margin: 0 5px 0 0;
1157      color: #646970;
1158      font: normal 16px/1 dashicons;
1159      vertical-align: text-bottom;
1160      -webkit-font-smoothing: antialiased;
1161      -moz-osx-font-smoothing: grayscale;
1162  }
1163  
1164  .wp-filter .button.drawer-toggle:hover,
1165  .wp-filter .drawer-toggle:hover:before,
1166  .wp-filter .button.drawer-toggle:focus,
1167  .wp-filter .drawer-toggle:focus:before {
1168      background-color: transparent;
1169      color: var(--wp-admin-theme-color);
1170  }
1171  
1172  .wp-filter .button.drawer-toggle:hover,
1173  .wp-filter .button.drawer-toggle:focus:active {
1174      border-color: transparent;
1175  }
1176  
1177  .wp-filter .button.drawer-toggle:focus {
1178      border-color: var(--wp-admin-theme-color);
1179  }
1180  
1181  .wp-filter .button.drawer-toggle:active {
1182      background: transparent;
1183      box-shadow: none;
1184      transform: none;
1185  }
1186  
1187  .wp-filter .drawer-toggle.current:before {
1188      color: #fff;
1189  }
1190  
1191  .filter-drawer,
1192  .wp-filter .favorites-form {
1193      display: none;
1194      margin: 0 -10px 0 -20px;
1195      padding: 20px;
1196      border-top: 1px solid #f0f0f1;
1197      background: #f6f7f7;
1198      overflow: hidden;
1199  }
1200  
1201  .wp-filter .favorites-form .favorites-username {
1202      display: flex;
1203      align-items: center;
1204      flex-wrap: wrap;
1205      gap: 0.5rem;
1206  }
1207  
1208  .wp-filter .favorites-form .favorites-username input {
1209      margin: 0;
1210  }
1211  
1212  .show-filters .filter-drawer,
1213  .show-favorites-form .favorites-form {
1214      display: block;
1215  }
1216  
1217  .show-filters .filter-links a.current {
1218      border-bottom: none;
1219  }
1220  
1221  .show-filters .wp-filter .button.drawer-toggle {
1222      border-radius: 2px;
1223      background: #646970;
1224      color: #fff;
1225  }
1226  
1227  .show-filters .wp-filter .drawer-toggle:hover,
1228  .show-filters .wp-filter .drawer-toggle:focus {
1229      background: var(--wp-admin-theme-color);
1230  }
1231  
1232  .show-filters .wp-filter .drawer-toggle:before {
1233      color: #fff;
1234  }
1235  
1236  .filter-group {
1237      box-sizing: border-box;
1238      position: relative;
1239      float: left;
1240      margin: 0 1% 0 0;
1241      padding: 20px 10px 10px;
1242      width: 24%;
1243      background: #fff;
1244      border: 1px solid #dcdcde;
1245      box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
1246  }
1247  
1248  .filter-group legend {
1249      position: absolute;
1250      top: 10px;
1251      display: block;
1252      margin: 0;
1253      padding: 0;
1254      font-size: 1em;
1255      font-weight: 600;
1256  }
1257  
1258  .filter-drawer .filter-group-feature {
1259      margin: 28px 0 0;
1260      list-style-type: none;
1261      font-size: 12px;
1262  }
1263  
1264  .filter-drawer .filter-group-feature input,
1265  .filter-drawer .filter-group-feature label {
1266      line-height: 1.4;
1267  }
1268  
1269  .filter-drawer .filter-group-feature input {
1270      position: absolute;
1271      margin: 0;
1272  }
1273  
1274  .filter-group .filter-group-feature label {
1275      display: block;
1276      margin: 14px 0 14px 23px;
1277  }
1278  
1279  .filter-drawer .buttons {
1280      clear: both;
1281      margin-bottom: 20px;
1282  }
1283  
1284  .filter-drawer .filter-group + .buttons {
1285      margin-bottom: 0;
1286      padding-top: 20px;
1287  }
1288  
1289  .filter-drawer .buttons .button span {
1290      display: inline-block;
1291      opacity: 0.8;
1292      font-size: 12px;
1293      text-indent: 10px;
1294  }
1295  
1296  .wp-filter .button.clear-filters {
1297      display: none;
1298      margin-left: 10px;
1299  }
1300  
1301  .wp-filter .button-link.edit-filters {
1302      padding: 0 5px;
1303      line-height: 2.2;
1304  }
1305  
1306  .filtered-by {
1307      display: none;
1308      margin: 0;
1309  }
1310  
1311  .filtered-by > span {
1312      font-weight: 600;
1313  }
1314  
1315  .filtered-by a {
1316      margin-left: 10px;
1317  }
1318  
1319  .filtered-by .tags {
1320      display: flex;
1321      align-items: flex-start;
1322      flex-wrap: wrap;
1323      gap: 8px;
1324  }
1325  
1326  .filtered-by .tag {
1327      padding: 4px 8px;
1328      border: 1px solid #dcdcde;
1329      box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
1330      background: #fff;
1331      font-size: 11px;
1332  }
1333  
1334  .filters-applied .filter-group,
1335  .filters-applied .filter-drawer .buttons,
1336  .filters-applied .filter-drawer br {
1337      display: none;
1338  }
1339  
1340  .filters-applied .filtered-by {
1341      display: flex;
1342      align-items: center;
1343      flex-wrap: wrap;
1344      gap: 10px;
1345  }
1346  
1347  .filters-applied .filter-drawer {
1348      padding: 20px;
1349  }
1350  
1351  .show-filters .favorites-form,
1352  .show-filters .content-filterable,
1353  .show-filters.filters-applied.loading-content .content-filterable,
1354  .loading-content .content-filterable,
1355  .error .content-filterable {
1356      display: none;
1357  }
1358  
1359  .show-filters.filters-applied .content-filterable {
1360      display: block;
1361  }
1362  
1363  .loading-content .spinner {
1364      display: block;
1365      margin: 40px auto 0;
1366      float: none;
1367  }
1368  
1369  @media only screen and (max-width: 1138px) {
1370      .wp-filter .search-form {
1371          margin: 11px 0;
1372      }
1373  }
1374  
1375  @media only screen and (max-width: 1250px) {
1376      .wp-filter:has(.plugin-install-search) .search-form {
1377          margin: 11px 0;
1378      }
1379  }
1380  
1381  @media only screen and (max-width: 1120px) {
1382      .filter-drawer {
1383          border-bottom: 1px solid #f0f0f1;
1384      }
1385  
1386      .filter-group {
1387          margin-bottom: 0;
1388          margin-top: 5px;
1389          width: 100%;
1390      }
1391  
1392      .filter-group li {
1393          margin: 10px 0;
1394      }
1395  }
1396  
1397  @media only screen and (max-width: 1000px) {
1398      .filter-items {
1399          float: none;
1400      }
1401  
1402      .wp-filter .media-toolbar-primary,
1403      .wp-filter .media-toolbar-secondary,
1404      .wp-filter .search-form {
1405          float: none; /* Remove float from media-views.css */
1406          position: relative;
1407          max-width: 100%;
1408      }
1409      .wp-filter .search-form {
1410          margin: 11px 0;
1411          flex-wrap: wrap;
1412          row-gap: 10px;
1413      }
1414  }
1415  
1416  @media only screen and (max-width: 782px) {
1417      .filter-group li {
1418          padding: 0;
1419          width: 50%;
1420      }
1421  
1422      .wp-filter .search-form input[type="search"] {
1423          min-height: 40px;
1424          padding: 0 12px;
1425      }
1426  
1427      .wp-filter .search-form select,
1428      .wp-filter .filter-items select {
1429          min-height: 40px;
1430          padding: 0 24px 0 12px;
1431      }
1432  }
1433  
1434  @media only screen and (max-width: 320px) {
1435      .filter-count {
1436          display: none;
1437      }
1438  
1439      .wp-filter .drawer-toggle {
1440          margin: 10px 0;
1441      }
1442  
1443      .filter-group li,
1444      .wp-filter .search-form input[type="search"] {
1445          width: 100%;
1446      }
1447  }
1448  
1449  /*------------------------------------------------------------------------------
1450    4.0 - Notifications
1451  ------------------------------------------------------------------------------*/
1452  
1453  .notice,
1454  div.updated,
1455  div.error {
1456      background: #fff;
1457      border: none;
1458      border-left: 4px solid #c3c4c7;
1459      box-shadow: none;
1460      margin: 5px 15px 2px;
1461      padding: 8px 12px;
1462  }
1463  
1464  div[class="update-message"] { /* back-compat for pre-4.6 */
1465      padding: 0.5em 12px 0.5em 0;
1466  }
1467  
1468  .notice p,
1469  .notice-title,
1470  div.updated p,
1471  div.error p,
1472  .form-table td .notice p {
1473      margin: 0.5em 0;
1474      padding: 0;
1475      font-size: 13px;
1476      line-height: 1.54;
1477      color: #1e1e1e;
1478  }
1479  
1480  div.notice a,
1481  div.error a,
1482  div.updated a {
1483      color: var(--wp-admin-theme-color-darker-10);
1484      text-decoration: underline;
1485  }
1486  
1487  div.notice a:hover,
1488  div.error a:hover,
1489  div.updated a:hover {
1490      color: var(--wp-admin-theme-color-darker-20);
1491  }
1492  
1493  div.notice a:focus,
1494  div.error a:focus,
1495  div.updated a:focus {
1496      box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
1497      outline: 2px solid transparent;
1498      border-radius: 2px;
1499  }
1500  
1501  .notice-alt {
1502      box-shadow: none;
1503  }
1504  
1505  .notice-large {
1506      padding: 10px 20px;
1507  }
1508  
1509  .notice-title {
1510      display: inline-block;
1511      color: #1d2327;
1512      font-size: 18px;
1513  }
1514  
1515  .wp-core-ui .notice.is-dismissible {
1516      padding-right: 48px;
1517      position: relative;
1518  }
1519  
1520  .notice-dismiss {
1521      position: absolute;
1522      top: 12px;
1523      right: 12px;
1524      border: none;
1525      margin: 0;
1526      padding: 0;
1527      background: none;
1528      color: #1e1e1e;
1529      cursor: pointer;
1530      width: 24px;
1531      height: 24px;
1532      display: flex;
1533      align-items: center;
1534      justify-content: center;
1535      border-radius: 2px;
1536  }
1537  
1538  .notice-dismiss:hover:before,
1539  .notice-dismiss:active:before {
1540      color: #1e1e1e;
1541      opacity: 0.7;
1542  }
1543  
1544  .notice-dismiss:focus {
1545      box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
1546      /* Only visible in Windows High Contrast mode */
1547      outline: 2px solid transparent;
1548  }
1549  
1550  .notice-dismiss:focus:before {
1551      color: #1e1e1e;
1552  }
1553  
1554  .notice-success,
1555  div.updated {
1556      border-left-color: #4ab866;
1557      background-color: #eff9f1;
1558  }
1559  
1560  .notice-success.notice-alt,
1561  div.updated.notice-alt {
1562      background-color: #eff9f1;
1563  }
1564  
1565  .notice-warning {
1566      border-left-color: #f0b849;
1567      background-color: #fef8ee;
1568  }
1569  
1570  .notice-warning.notice-alt {
1571      background-color: #fef8ee;
1572  }
1573  
1574  .notice-error,
1575  div.error {
1576      border-left-color: #cc1818;
1577      background-color: #fcf0f0;
1578  }
1579  
1580  .notice-error.notice-alt,
1581  div.error.notice-alt {
1582      background-color: #fcf0f0;
1583  }
1584  
1585  .notice-info {
1586      border-left-color: #3858e9;
1587      background-color: #fff;
1588  }
1589  
1590  .notice-info.notice-alt {
1591      background-color: #fff;
1592  }
1593  
1594  #plugin-information-footer .update-now:not(.button-disabled):before {
1595      color: #d63638;
1596      content: "\f463";
1597      content: "\f463" / '';
1598      display: inline-block;
1599      font: normal 20px/1 dashicons;
1600      margin: -3px 5px 0 -2px;
1601      -webkit-font-smoothing: antialiased;
1602      -moz-osx-font-smoothing: grayscale;
1603      vertical-align: middle;
1604  }
1605  
1606  #plugin-information-footer .notice {
1607      margin-top: -5px;
1608  }
1609  
1610  .update-message p:before,
1611  .updating-message p:before,
1612  .updated-message p:before,
1613  .import-php .updating-message:before,
1614  .button.updating-message:before,
1615  .button.updated-message:before,
1616  .button.installed:before,
1617  .button.installing:before,
1618  .button.activating-message:before,
1619  .button.activated-message:before {
1620      display: inline-block;
1621      font: normal 20px/1 'dashicons';
1622      -webkit-font-smoothing: antialiased;
1623      -moz-osx-font-smoothing: grayscale;
1624      vertical-align: top;
1625  }
1626  
1627  .wrap .notice,
1628  .wrap div.updated,
1629  .wrap div.error,
1630  .media-upload-form .notice,
1631  .media-upload-form div.error {
1632      margin: 5px 0 15px;
1633  }
1634  
1635  .wrap #templateside .notice {
1636      display: block;
1637      margin: 0;
1638      padding: 5px 8px;
1639      font-weight: 600;
1640      text-decoration: none;
1641  }
1642  
1643  .wrap #templateside span.notice {
1644      margin-left: -12px;
1645  }
1646  
1647  #templateside li.notice a {
1648      padding: 0;
1649  }
1650  
1651  /* Update icon. */
1652  .update-message p:before,
1653  .updating-message p:before,
1654  .import-php .updating-message:before,
1655  .button.updating-message:before,
1656  .button.installing:before,
1657  .button.activating-message:before {
1658      color: #d63638;
1659      content: "\f463";
1660      content: "\f463" / '';
1661  }
1662  
1663  /* Spins the update icon. */
1664  .updating-message p:before,
1665  .import-php .updating-message:before,
1666  .button.updating-message:before,
1667  .button.installing:before,
1668  .button.activating-message:before,
1669  .plugins .column-auto-updates .dashicons-update.spin,
1670  .theme-overlay .theme-autoupdate .dashicons-update.spin {
1671      animation: rotation 2s infinite linear;
1672  }
1673  
1674  @media (prefers-reduced-motion: reduce) {
1675      .updating-message p:before,
1676      .import-php .updating-message:before,
1677      .button.updating-message:before,
1678      .button.installing:before,
1679      .button.activating-message:before,
1680      .plugins .column-auto-updates .dashicons-update.spin,
1681      .theme-overlay .theme-autoupdate .dashicons-update.spin {
1682          animation: none;
1683      }
1684  }
1685  
1686  .theme-overlay .theme-autoupdate .dashicons-update.spin {
1687      margin-right: 3px;
1688  }
1689  
1690  /* Updated icon (check mark). */
1691  .updated-message p:before,
1692  .installed p:before,
1693  .button.updated-message:before,
1694  .button.activated-message:before {
1695      color: #68de7c;
1696      content: "\f147";
1697      content: "\f147" / '';
1698  }
1699  
1700  /* Error icon. */
1701  .update-message.notice-error p:before {
1702      color: #d63638;
1703      content: "\f534";
1704      content: "\f534" / '';
1705  }
1706  
1707  .wrap .notice p:before,
1708  .import-php .updating-message:before {
1709      margin-right: 6px;
1710  }
1711  
1712  .import-php .updating-message:before {
1713      vertical-align: bottom;
1714  }
1715  
1716  #update-nag,
1717  .update-nag {
1718      display: inline-block;
1719      line-height: 1.4;
1720      padding: 11px 15px;
1721      font-size: 14px;
1722      margin: 25px 20px 0 2px;
1723  }
1724  
1725  ul#dismissed-updates {
1726      display: none;
1727  }
1728  
1729  #dismissed-updates li > p {
1730      margin-top: 0;
1731  }
1732  
1733  #dismiss,
1734  #undismiss {
1735      margin-left: 0.5em;
1736  }
1737  
1738  form.upgrade {
1739      margin-top: 8px;
1740  }
1741  
1742  form.upgrade .hint {
1743      font-style: italic;
1744      font-size: 85%;
1745      margin: -0.5em 0 2em;
1746  }
1747  
1748  .update-php .spinner {
1749      float: none;
1750      margin: -4px 0;
1751  }
1752  
1753  h2.wp-current-version {
1754      margin-bottom: .3em;
1755  }
1756  
1757  p.update-last-checked {
1758      margin-top: 0;
1759  }
1760  
1761  p.auto-update-status {
1762      margin-top: 2em;
1763      line-height: 1.8;
1764  }
1765  
1766  #ajax-loading,
1767  .ajax-loading,
1768  .ajax-feedback,
1769  .imgedit-wait-spin,
1770  .list-ajax-loading { /* deprecated */
1771      visibility: hidden;
1772  }
1773  
1774  #ajax-response.alignleft {
1775      margin-left: 2em;
1776  }
1777  
1778  .button.updating-message:before,
1779  .button.updated-message:before,
1780  .button.installed:before,
1781  .button.installing:before,
1782  .button.activated-message:before,
1783  .button.activating-message:before {
1784      margin: 0 5px 0 -2px;
1785      line-height: 1.9; /* 38px (20px * 1.9) - matches button */
1786      vertical-align: top;
1787  }
1788  
1789  #plugin-information-footer .button {
1790      padding: 0 14px;
1791      line-height: 2.71428571; /* 38px */
1792      font-size: 14px;
1793      vertical-align: middle;
1794      min-height: 40px;
1795      margin-bottom: 4px;
1796  }
1797  
1798  #plugin-information-footer .button.installed:before,
1799  #plugin-information-footer .button.installing:before,
1800  #plugin-information-footer .button.updating-message:before,
1801  #plugin-information-footer .button.updated-message:before,
1802  #plugin-information-footer .button.activated-message:before,
1803  #plugin-information-footer .button.activating-message:before {
1804      margin: 0 5px 0 -2px;
1805      line-height: 1.9; /* 38px (20px * 1.9) - matches button */
1806      vertical-align: top;
1807  }
1808  
1809  #plugin-information-footer .button.update-now.updating-message:before {
1810      margin: 0 5px 0 -2px;
1811  }
1812  
1813  .button-primary.updating-message:before,
1814  .button-primary.activating-message:before {
1815      color: #fff;
1816  }
1817  
1818  .button-primary.updated-message:before,
1819  .button-primary.activated-message:before {
1820      color: #9ec2e6;
1821  }
1822  
1823  .button.updated-message,
1824  .button.activated-message {
1825      transition-property: border, background, color;
1826      transition-duration: .05s;
1827      transition-timing-function: ease-in-out;
1828  }
1829  
1830  
1831  /* @todo: this does not need its own section anymore */
1832  /*------------------------------------------------------------------------------
1833    6.0 - Admin Header
1834  ------------------------------------------------------------------------------*/
1835  #adminmenu a,
1836  #taglist a,
1837  #catlist a {
1838      text-decoration: none;
1839  }
1840  
1841  /*------------------------------------------------------------------------------
1842    6.1 - Screen Options Tabs
1843  ------------------------------------------------------------------------------*/
1844  
1845  #screen-options-wrap,
1846  #contextual-help-wrap {
1847      margin: 0;
1848      padding: 8px 20px 12px;
1849      position: relative;
1850  }
1851  
1852  #contextual-help-wrap {
1853      overflow: auto;
1854      margin-left: 0;
1855  }
1856  
1857  #screen-meta-links {
1858      float: right;
1859      margin: 0 20px 0 0;
1860  }
1861  
1862  /* screen options and help tabs revert */
1863  #screen-meta {
1864      display: none;
1865      margin: 0 20px -1px 0;
1866      position: relative;
1867      background-color: #fff;
1868      border: 1px solid #c3c4c7;
1869      border-top: none;
1870      box-shadow: 0 0 0 transparent;
1871  }
1872  
1873  #screen-options-link-wrap,
1874  #contextual-help-link-wrap {
1875      float: left;
1876      margin: 0 0 0 6px;
1877  }
1878  
1879  #screen-meta-links .screen-meta-toggle {
1880      position: relative;
1881      top: 0;
1882  }
1883  
1884  #screen-meta-links .show-settings {
1885      border: 1px solid #c3c4c7;
1886      border-top: none;
1887      height: auto;
1888      margin-bottom: 0;
1889      padding: 0 6px 0 16px;
1890      background: #fff;
1891      border-radius: 0 0 4px 4px;
1892      color: #646970;
1893      box-shadow: 0 0 0 transparent;
1894      transition: box-shadow 0.1s linear;
1895  }
1896  
1897  #screen-meta-links .show-settings:hover,
1898  #screen-meta-links .show-settings:active,
1899  #screen-meta-links .show-settings:focus {
1900      color: #2c3338;
1901  }
1902  
1903  #screen-meta-links .show-settings:focus {
1904      border-color: var(--wp-admin-theme-color, #3858e9);
1905      box-shadow: 0 0 0 var(--wp-admin-border-width-focus, 1.5px) var(--wp-admin-theme-color, #3858e9);
1906      /* Only visible in Windows High Contrast mode */
1907      outline: 2px solid transparent;
1908  }
1909  
1910  #screen-meta-links .show-settings:active {
1911      transform: none;
1912  }
1913  
1914  #screen-meta-links .show-settings:after {
1915      right: 0;
1916      content: "\f140";
1917      content: "\f140" / '';
1918      font: normal 20px/1.5 dashicons; /* line-height 1.5 = 30px to match compact button */
1919      display: inline-block;
1920      padding: 0 5px 0 0;
1921      vertical-align: top;
1922      -webkit-font-smoothing: antialiased;
1923      -moz-osx-font-smoothing: grayscale;
1924      text-decoration: none;
1925  }
1926  
1927  #screen-meta-links .screen-meta-active:after {
1928      content: "\f142";
1929      content: "\f142" / '';
1930  }
1931  
1932  /* end screen options and help tabs */
1933  
1934  .toggle-arrow {
1935      background-repeat: no-repeat;
1936      background-position: top left;
1937      background-color: transparent;
1938      height: 22px;
1939      line-height: 22px;
1940      display: block;
1941  }
1942  
1943  .toggle-arrow-active {
1944      background-position: bottom left;
1945  }
1946  
1947  #screen-options-wrap h5, /* Back-compat for old plugins */
1948  #screen-options-wrap legend,
1949  #contextual-help-wrap h5 {
1950      margin: 0;
1951      padding: 8px 0;
1952      font-size: 13px;
1953      font-weight: 600;
1954  }
1955  
1956  .metabox-prefs label {
1957      display: inline-block;
1958      padding-right: 15px;
1959      line-height: 2.35;
1960  }
1961  
1962  #number-of-columns {
1963      display: inline-block;
1964      vertical-align: middle;
1965      line-height: 30px;
1966  }
1967  
1968  .metabox-prefs input[type=checkbox] {
1969      margin-top: 0;
1970      margin-right: 6px;
1971  }
1972  
1973  .metabox-prefs label input,
1974  .metabox-prefs label input[type=checkbox] {
1975      margin: -4px 5px 0 0;
1976  }
1977  
1978  .metabox-prefs .columns-prefs label input {
1979      margin: -1px 2px 0 0;
1980  }
1981  
1982  .metabox-prefs label a {
1983      display: none;
1984  }
1985  
1986  .metabox-prefs .screen-options input,
1987  .metabox-prefs .screen-options label {
1988      margin-top: 0;
1989      margin-bottom: 0;
1990      vertical-align: middle;
1991  }
1992  
1993  .metabox-prefs .screen-options .screen-per-page {
1994      margin-right: 15px;
1995      padding-right: 0;
1996  }
1997  
1998  .metabox-prefs .screen-options label {
1999      line-height: 2.2;
2000      padding-right: 0;
2001  }
2002  
2003  .screen-options + .screen-options {
2004      margin-top: 10px;
2005  }
2006  
2007  .metabox-prefs .submit {
2008      margin-top: 1em;
2009      padding: 0;
2010  }
2011  
2012  /*------------------------------------------------------------------------------
2013    6.2 - Help Menu
2014  ------------------------------------------------------------------------------*/
2015  
2016  #contextual-help-wrap {
2017      padding: 0;
2018  }
2019  
2020  #contextual-help-columns {
2021      position: relative;
2022  }
2023  
2024  #contextual-help-back {
2025      position: absolute;
2026      top: 0;
2027      bottom: 0;
2028      left: 150px;
2029      right: 170px;
2030      border: 1px solid #c3c4c7;
2031      border-top: none;
2032      border-bottom: none;
2033      background: rgba(var(--wp-admin-theme-color--rgb), 0.08);
2034  }
2035  
2036  #contextual-help-wrap.no-sidebar #contextual-help-back {
2037      right: 0;
2038      border-right-width: 0;
2039      border-bottom-right-radius: 2px;
2040  }
2041  
2042  .contextual-help-tabs {
2043      float: left;
2044      width: 150px;
2045      margin: 0;
2046  }
2047  
2048  .contextual-help-tabs ul {
2049      margin: 1em 0;
2050  }
2051  
2052  .contextual-help-tabs li {
2053      margin-bottom: 0;
2054      list-style-type: none;
2055      border-style: solid;
2056      border-width: 0 0 0 2px;
2057      border-color: transparent;
2058  }
2059  
2060  .contextual-help-tabs a {
2061      display: block;
2062      padding: 5px 5px 5px 12px;
2063      line-height: 1.4;
2064      text-decoration: none;
2065      border: 1px solid transparent;
2066      border-right: none;
2067      border-left: none;
2068  }
2069  
2070  .contextual-help-tabs a:hover {
2071      color: #2c3338;
2072  }
2073  
2074  .contextual-help-tabs .active {
2075      padding: 0;
2076      margin: 0 -1px 0 0;
2077      border-left: 2px solid var(--wp-admin-theme-color);
2078      background: color-mix(in srgb, var(--wp-admin-theme-color) 8%, white);
2079      box-shadow: 0 2px 0 rgba(0, 0, 0, 0.02), 0 1px 0 rgba(0, 0, 0, 0.02);
2080  }
2081  
2082  .contextual-help-tabs .active a {
2083      border-color: #c3c4c7;
2084      color: #2c3338;
2085  }
2086  
2087  .contextual-help-tabs-wrap {
2088      padding: 0 20px;
2089      overflow: auto;
2090  }
2091  
2092  .help-tab-content {
2093      display: none;
2094      margin: 0 22px 12px 0;
2095      line-height: 1.6;
2096  }
2097  
2098  .help-tab-content.active {
2099      display: block;
2100  }
2101  
2102  .help-tab-content ul li {
2103      list-style-type: disc;
2104      margin-left: 18px;
2105  }
2106  
2107  .contextual-help-sidebar {
2108      width: 150px;
2109      float: right;
2110      padding: 0 8px 0 12px;
2111      overflow: auto;
2112  }
2113  
2114  /*------------------------------------------------------------------------------
2115    8.0 - Layout Blocks
2116  ------------------------------------------------------------------------------*/
2117  
2118  html.wp-toolbar {
2119      padding-top: var(--wp-admin--admin-bar--height);
2120      box-sizing: border-box;
2121      -ms-overflow-style: scrollbar; /* See ticket #48545 */
2122  }
2123  
2124  .widefat th,
2125  .widefat td {
2126      color: #50575e;
2127  }
2128  
2129  .widefat th,
2130  .widefat thead td,
2131  .widefat tfoot td {
2132      font-weight: 400;
2133  }
2134  
2135  .widefat thead tr th,
2136  .widefat thead tr td,
2137  .widefat tfoot tr th,
2138  .widefat tfoot tr td {
2139      color: #2c3338;
2140  }
2141  
2142  .widefat td p {
2143      margin: 2px 0 0.8em;
2144  }
2145  
2146  .widefat p,
2147  .widefat ol,
2148  .widefat ul {
2149      color: #2c3338;
2150  }
2151  
2152  .widefat .column-comment p {
2153      margin: 0.6em 0;
2154  }
2155  
2156  .widefat .column-comment ul {
2157      list-style: initial;
2158      margin-left: 2em;
2159  }
2160  
2161  /* Screens with postboxes */
2162  .postbox-container {
2163      float: left;
2164  }
2165  
2166  .postbox-container .meta-box-sortables {
2167      box-sizing: border-box;
2168  }
2169  
2170  #wpbody-content .metabox-holder {
2171      padding-top: 10px;
2172  }
2173  
2174  .metabox-holder .postbox-container .meta-box-sortables {
2175      /* The jQuery UI Sortables need some initial height to work properly. */
2176      min-height: 1px;
2177      position: relative;
2178  }
2179  
2180  #post-body-content {
2181      width: 100%;
2182      min-width: 463px;
2183      float: left;
2184  }
2185  
2186  #post-body.columns-2 #postbox-container-1 {
2187      float: right;
2188      margin-right: -300px;
2189      width: 280px;
2190  }
2191  
2192  #post-body.columns-2 #side-sortables {
2193      min-height: 250px;
2194  }
2195  
2196  /* one column on the dash */
2197  @media only screen and (max-width: 799px) {
2198      #wpbody-content .metabox-holder .postbox-container .empty-container {
2199          outline: none;
2200          height: 0;
2201          min-height: 0;
2202      }
2203  }
2204  
2205  .js .widget .widget-top,
2206  .js .postbox .hndle {
2207      cursor: move;
2208  }
2209  
2210  .js .widget .widget-top.is-non-sortable,
2211  .js .postbox .hndle.is-non-sortable {
2212      cursor: auto;
2213  }
2214  
2215  /* Configurable dashboard widgets "Configure" edit-box link. */
2216  .hndle a {
2217      font-size: 12px;
2218      font-weight: 400;
2219  }
2220  
2221  .postbox-header {
2222      display: flex;
2223      align-items: center;
2224      justify-content: space-between;
2225      border-bottom: 1px solid #c3c4c7;
2226  }
2227  
2228  .postbox-header .hndle {
2229      flex-grow: 1;
2230      /* Handle the alignment for the configurable dashboard widgets "Configure" edit-box link. */
2231      display: flex;
2232      justify-content: space-between;
2233      align-items: center;
2234  }
2235  
2236  .postbox-header .handle-actions {
2237      flex-shrink: 0;
2238  }
2239  
2240  /* Post box order and toggle buttons. */
2241  .postbox .handle-order-higher,
2242  .postbox .handle-order-lower,
2243  .postbox .handlediv {
2244      width: 1.62rem;
2245      height: 1.62rem;
2246      margin: 0;
2247      padding: 0;
2248      border: 0;
2249      background: none;
2250      cursor: pointer;
2251  }
2252  
2253  .postbox .handle-order-higher,
2254  .postbox .handle-order-lower {
2255      color: #646970;
2256      width: 1.62rem;
2257  }
2258  
2259  /* Post box order buttons in the block editor meta boxes area. */
2260  .edit-post-meta-boxes-area .postbox .handle-order-higher,
2261  .edit-post-meta-boxes-area .postbox .handle-order-lower {
2262      width: 44px;
2263      height: 44px;
2264      color: #1d2327
2265  }
2266  
2267  .postbox .handle-order-higher[aria-disabled="true"],
2268  .postbox .handle-order-lower[aria-disabled="true"] {
2269      cursor: default;
2270      color: #a7aaad;
2271  }
2272  
2273  .sortable-placeholder:not(.empty-container .sortable-placeholder) {
2274      border: 1px dashed #c3c4c7;
2275      border-radius: 8px;
2276      margin-bottom: 20px;
2277  }
2278  
2279  .postbox,
2280  .stuffbox {
2281      margin-bottom: 20px;
2282      padding: 0;
2283      line-height: 1;
2284  }
2285  
2286  .postbox.closed .postbox-header {
2287      border-bottom: 0;
2288  }
2289  
2290  /* user-select is not a part of the CSS standard - may change behavior in the future */
2291  .postbox .hndle,
2292  .stuffbox .hndle {
2293      -webkit-user-select: none;
2294      user-select: none;
2295  }
2296  
2297  .postbox .inside {
2298      padding: 0 12px 12px;
2299      line-height: 1.4;
2300      font-size: 13px;
2301  }
2302  
2303  .stuffbox .inside {
2304      padding: 0;
2305      line-height: 1.4;
2306      font-size: 13px;
2307      margin-top: 0;
2308  }
2309  
2310  .postbox .inside {
2311      margin: 11px 0;
2312      position: relative;
2313  }
2314  
2315  .postbox .inside > p:last-child,
2316  .rss-widget ul li:last-child {
2317      margin-bottom: 1px !important;
2318  }
2319  
2320  .postbox.closed h3 {
2321      border: none;
2322      box-shadow: none;
2323  }
2324  
2325  .postbox table.form-table {
2326      margin-bottom: 0;
2327  }
2328  
2329  .postbox table.widefat {
2330      box-shadow: none;
2331  }
2332  
2333  .temp-border {
2334      border: 1px dotted #c3c4c7;
2335  }
2336  
2337  .columns-prefs label {
2338      padding: 0 10px 0 0;
2339  }
2340  
2341  /* @todo: what is this doing here */
2342  #dashboard_right_now .versions .b,
2343  #post-status-display,
2344  #post-visibility-display,
2345  #adminmenu .wp-submenu li.current,
2346  #adminmenu .wp-submenu li.current a,
2347  #adminmenu .wp-submenu li.current a:hover,
2348  .media-item .percent,
2349  .plugins .name,
2350  #pass-strength-result.strong,
2351  #pass-strength-result.short,
2352  #ed_reply_toolbar #ed_reply_strong,
2353  .item-controls .item-order a,
2354  .feature-filter .feature-name,
2355  #comment-status-display {
2356      font-weight: 600;
2357  }
2358  
2359  /*------------------------------------------------------------------------------
2360    21.0 - Admin Footer
2361  ------------------------------------------------------------------------------*/
2362  
2363  #wpfooter {
2364      position: absolute;
2365      bottom: 0;
2366      left: 0;
2367      right: 0;
2368      padding: 10px 20px;
2369      color: #50575e;
2370  }
2371  
2372  #wpfooter p {
2373      font-size: 13px;
2374      margin: 0;
2375      line-height: 1.55;
2376  }
2377  
2378  #footer-thankyou {
2379      font-style: italic;
2380  }
2381  
2382  /*------------------------------------------------------------------------------
2383    25.0 - Tabbed Admin Screen Interface (Experimental)
2384  ------------------------------------------------------------------------------*/
2385  
2386  .nav-tab {
2387      float: left;
2388      border: 1px solid #c3c4c7;
2389      border-bottom: none;
2390      margin-left: 0.5em; /* half the font size so set the font size properly */
2391      padding: 5px 10px;
2392      font-size: 14px;
2393      line-height: 1.71428571;
2394      font-weight: 600;
2395      background: #dcdcde;
2396      color: #50575e;
2397      text-decoration: none;
2398      white-space: nowrap;
2399  }
2400  
2401  h3 .nav-tab, /* Back-compat for pre-4.4 */
2402  .nav-tab-small .nav-tab {
2403      padding: 5px 14px;
2404      font-size: 12px;
2405      line-height: 1.33;
2406  }
2407  
2408  .nav-tab:hover,
2409  .nav-tab:focus {
2410      background-color: #fff;
2411      color: #3c434a;
2412  }
2413  
2414  .nav-tab-active,
2415  .nav-tab:focus:active {
2416      box-shadow: none;
2417  }
2418  
2419  .nav-tab-active {
2420      margin-bottom: -1px;
2421      color: #3c434a;
2422  }
2423  
2424  .nav-tab-active,
2425  .nav-tab-active:hover,
2426  .nav-tab-active:focus,
2427  .nav-tab-active:focus:active {
2428      border-bottom: 1px solid #f0f0f1;
2429      background: #f0f0f1;
2430      color: #000;
2431  }
2432  
2433  h1.nav-tab-wrapper, /* Back-compat for pre-4.4 */
2434  .wrap h2.nav-tab-wrapper, /* higher specificity to override .wrap > h2:first-child */
2435  .nav-tab-wrapper {
2436      border-bottom: 1px solid #c3c4c7;
2437      margin: 0;
2438      padding-top: 9px;
2439      padding-bottom: 0;
2440      line-height: inherit;
2441  }
2442  
2443  /* Back-compat for plugins. Deprecated. Use .wp-clearfix instead. */
2444  .nav-tab-wrapper:not(.wp-clearfix):after {
2445      content: "";
2446      display: table;
2447      clear: both;
2448  }
2449  
2450  /*------------------------------------------------------------------------------
2451    26.0 - Misc
2452  ------------------------------------------------------------------------------*/
2453  
2454  .spinner {
2455      background: url(../images/spinner.gif) no-repeat;
2456      background-size: 20px 20px;
2457      display: inline-block;
2458      visibility: hidden;
2459      float: right;
2460      vertical-align: middle;
2461      opacity: 0.7;
2462      filter: alpha(opacity=70);
2463      width: 20px;
2464      height: 20px;
2465      margin: 10px 10px 0;
2466  }
2467  
2468  .spinner.is-active,
2469  .loading-content .spinner {
2470      visibility: visible;
2471  }
2472  
2473  #template > div {
2474      margin-right: 16em;
2475  }
2476  #template .notice {
2477      margin-top: 1em;
2478      margin-right: 3%;
2479  }
2480  #template .notice p {
2481      width: auto;
2482  }
2483  #template .submit .spinner {
2484      float: none;
2485      vertical-align: top;
2486  }
2487  
2488  .metabox-holder .stuffbox > h3, /* Back-compat for pre-4.4 */
2489  .metabox-holder .postbox > h3, /* Back-compat for pre-4.4 */
2490  .metabox-holder h3.hndle, /* Back-compat for pre-4.4 */
2491  .metabox-holder h2.hndle {
2492      font-size: 14px;
2493      padding: 8px 12px;
2494      margin: 0;
2495      line-height: 1.4;
2496  }
2497  
2498  /* Back-compat for nav-menus screen */
2499  .nav-menus-php .metabox-holder h3 {
2500      padding: 0;
2501  }
2502  
2503  .accordion-container h3.accordion-section-title {
2504      padding: 0 !important;
2505  }
2506  
2507  .accordion-section-title button.accordion-trigger,
2508  .nav-menus-php .metabox-holder .accordion-section-title button.accordion-trigger {
2509      background: inherit;
2510      color: #1d2327;
2511      display: block;
2512      position: relative;
2513      text-align: left;
2514      width: 100%;
2515      outline: none;
2516      border: 0;
2517      padding: 10px 10px 11px 14px;
2518      line-height: 1.5;
2519      cursor: pointer;
2520  }
2521  
2522  .accordion-section-title button.accordion-trigger:focus,
2523  .nav-menus-php .metabox-holder .accordion-section-title button.accordion-trigger:focus {
2524      box-shadow: 0 0 0 var(--wp-admin-border-width-focus, 1.5px) var(--wp-admin-theme-color, #3858e9);
2525      outline: 2px solid transparent;
2526  }
2527  
2528  .accordion-section-title span.dashicons.dashicons-arrow-down,
2529  .nav-menus-php .metabox-holder .accordion-section-title span.dashicons.dashicons-arrow-down {
2530      position: absolute;
2531      right: 10px;
2532      left: auto;
2533      color: #787c82;
2534      border-radius: 50px;
2535      top: 50%;
2536      transform: translateY(-50%);
2537  }
2538  
2539  .accordion-section-title:hover span.dashicons.dashicons-arrow-down,
2540  .nav-menus-php .metabox-holder .accordion-section-title:hover span.dashicons.dashicons-arrow-down {
2541      color: #1d2327;
2542  }
2543  
2544  .accordion-section-title span.dashicons.dashicons-arrow-down::before,
2545  .nav-menus-php .metabox-holder .accordion-section-title span.dashicons.dashicons-arrow-down::before {
2546      position: relative;
2547      left: -1px;
2548  }
2549  
2550  .accordion-section.open .accordion-section-title span.dashicons.dashicons-arrow-down,
2551  .nav-menus-php .metabox-holder .accordion-section.open .accordion-section-title span.dashicons.dashicons-arrow-down {
2552      transform: rotate(180deg) translate(0, 50%);
2553  }
2554  
2555  #templateside ul li a {
2556      text-decoration: none;
2557  }
2558  
2559  .plugin-install #description,
2560  .plugin-install-network #description {
2561      width: 60%;
2562  }
2563  
2564  table .vers,
2565  table .column-visible,
2566  table .column-rating {
2567      text-align: left;
2568  }
2569  
2570  .attention,
2571  .error-message {
2572      color: #d63638;
2573      font-weight: 600;
2574  }
2575  
2576  /* Scrollbar fix for bulk upgrade iframe */
2577  body.iframe {
2578      height: 98%;
2579  }
2580  
2581  /* Upgrader styles, Specific to Language Packs */
2582  .lp-show-latest p {
2583      display: none;
2584  }
2585  .lp-show-latest p:last-child,
2586  .lp-show-latest .lp-error p {
2587      display: block;
2588  }
2589  
2590  /* - Only used once or twice in all of WP - deprecate for global style
2591  ------------------------------------------------------------------------------*/
2592  .media-icon {
2593      width: 62px; /* icon + border */
2594      text-align: center;
2595  }
2596  
2597  .media-icon img {
2598      border: 1px solid #dcdcde;
2599      border: 1px solid rgba(0, 0, 0, 0.07);
2600  }
2601  
2602  #howto {
2603      font-size: 11px;
2604      margin: 0 5px;
2605      display: block;
2606  }
2607  
2608  .importers {
2609      font-size: 16px;
2610      width: auto;
2611  }
2612  
2613  .importers td {
2614      padding-right: 14px;
2615      line-height: 1.4;
2616  }
2617  
2618  .importers .import-system {
2619      max-width: 250px;
2620  }
2621  
2622  .importers td.desc {
2623      max-width: 500px;
2624  }
2625  
2626  .importer-title,
2627  .importer-desc,
2628  .importer-action {
2629      display: block;
2630  }
2631  
2632  .importer-title {
2633      color: #000;
2634      font-size: 14px;
2635      font-weight: 400;
2636      margin-bottom: .2em;
2637  }
2638  
2639  .importer-action {
2640      line-height: 1.55; /* Same as with .updating-message */
2641      color: #50575e;
2642      margin-bottom: 1em;
2643  }
2644  
2645  #post-body #post-body-content #namediv h3, /* Back-compat for pre-4.4 */
2646  #post-body #post-body-content #namediv h2 {
2647      margin-top: 0;
2648  }
2649  
2650  .edit-comment-author {
2651      color: #1d2327;
2652      border-bottom: 1px solid #f0f0f1;
2653  }
2654  
2655  #namediv h3 label, /* Back-compat for pre-4.4 */
2656  #namediv h2 label {
2657      vertical-align: baseline;
2658  }
2659  
2660  #namediv table {
2661      width: 100%;
2662  }
2663  
2664  #namediv td.first {
2665      width: 10px;
2666      white-space: nowrap;
2667  }
2668  
2669  #namediv input {
2670      width: 100%;
2671  }
2672  
2673  #namediv p {
2674      margin: 10px 0;
2675  }
2676  
2677  /* - Used - but could/should be deprecated with a CSS reset
2678  ------------------------------------------------------------------------------*/
2679  .zerosize {
2680      height: 0;
2681      width: 0;
2682      margin: 0;
2683      border: 0;
2684      padding: 0;
2685      overflow: hidden;
2686      position: absolute;
2687  }
2688  
2689  br.clear {
2690      height: 2px;
2691      line-height: 0.15;
2692  }
2693  
2694  .checkbox {
2695      border: none;
2696      margin: 0;
2697      padding: 0;
2698  }
2699  
2700  fieldset {
2701      border: 0;
2702      padding: 0;
2703      margin: 0;
2704  }
2705  
2706  .post-categories {
2707      display: inline;
2708      margin: 0;
2709      padding: 0;
2710  }
2711  
2712  .post-categories li {
2713      display: inline;
2714  }
2715  
2716  /* Star Ratings - Back-compat for pre-3.8 */
2717  div.star-holder {
2718      position: relative;
2719      height: 17px;
2720      width: 100px;
2721      background: url(../images/stars.png?ver=20121108) repeat-x bottom left;
2722  }
2723  
2724  div.star-holder .star-rating {
2725      background: url(../images/stars.png?ver=20121108) repeat-x top left;
2726      height: 17px;
2727      float: left;
2728  }
2729  
2730  /* Star Ratings */
2731  .star-rating {
2732      white-space: nowrap;
2733  }
2734  .star-rating .star {
2735      display: inline-block;
2736      width: 20px;
2737      height: 20px;
2738      -webkit-font-smoothing: antialiased;
2739      font-size: 20px;
2740      line-height: 1;
2741      font-family: dashicons;
2742      text-decoration: inherit;
2743      font-weight: 400;
2744      font-style: normal;
2745      vertical-align: top;
2746      transition: color .1s ease-in;
2747      text-align: center;
2748      color: #dba617;
2749  }
2750  
2751  .star-rating .star-full:before {
2752      content: "\f155";
2753      content: "\f155" / '';
2754  }
2755  
2756  .star-rating .star-half:before {
2757      content: "\f459";
2758      content: "\f459" / '';
2759  }
2760  
2761  .rtl .star-rating .star-half {
2762      transform: rotateY(180deg);
2763  }
2764  
2765  .star-rating .star-empty:before {
2766      content: "\f154";
2767      content: "\f154" / '';
2768  }
2769  
2770  div.action-links {
2771      font-weight: 400;
2772      margin: 6px 0 0;
2773  }
2774  
2775  /* Plugin install thickbox */
2776  #plugin-information {
2777      background: #fff;
2778      position: fixed;
2779      top: 0;
2780      right: 0;
2781      bottom: 0;
2782      left: 0;
2783      height: 100%;
2784      padding: 0;
2785  }
2786  
2787  #plugin-information-scrollable {
2788      overflow: auto;
2789      -webkit-overflow-scrolling: touch;
2790      height: 100%;
2791  }
2792  
2793  #plugin-information-title {
2794      padding: 0 26px;
2795      background: #f6f7f7;
2796      font-size: 22px;
2797      font-weight: 600;
2798      line-height: 2.4;
2799      position: relative;
2800      height: 56px;
2801  }
2802  
2803  #plugin-information-title.with-banner {
2804      margin-right: 0;
2805      height: 250px;
2806      background-size: cover;
2807  }
2808  
2809  #plugin-information-title h2 {
2810      font-size: 1em;
2811      font-weight: 600;
2812      padding: 0;
2813      margin: 0;
2814      overflow: hidden;
2815      text-overflow: ellipsis;
2816      white-space: nowrap;
2817  }
2818  
2819  #plugin-information-title.with-banner h2 {
2820      position: relative;
2821      font-family: "Helvetica Neue", sans-serif;
2822      display: inline-block;
2823      font-size: 30px;
2824      line-height: 1.68;
2825      box-sizing: border-box;
2826      max-width: 100%;
2827      padding: 0 15px;
2828      margin-top: 174px;
2829      color: #fff;
2830      background: rgba(29, 35, 39, 0.9);
2831      text-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
2832      box-shadow: 0 0 30px rgba(255, 255, 255, 0.1);
2833      border-radius: 8px;
2834  }
2835  
2836  #plugin-information-title div.vignette {
2837      display: none;
2838  }
2839  
2840  #plugin-information-title.with-banner div.vignette {
2841      position: absolute;
2842      display: block;
2843      top: 0;
2844      left: 0;
2845      height: 250px;
2846      width: 100%;
2847      background: transparent;
2848      box-shadow: inset 0 0 50px 4px rgba(0, 0, 0, 0.2), inset 0 -1px 0 rgba(0, 0, 0, 0.1);
2849  }
2850  
2851  #plugin-information-tabs {
2852      padding: 0 16px;
2853      position: relative;
2854      right: 0;
2855      left: 0;
2856      min-height: 36px;
2857      font-size: 0;
2858      z-index: 1;
2859      border-bottom: 1px solid #dcdcde;
2860      background: #f6f7f7;
2861  }
2862  
2863  #plugin-information-tabs a {
2864      position: relative;
2865      display: inline-block;
2866      padding: 9px 10px;
2867      margin: 0;
2868      height: 18px;
2869      line-height: 1.3;
2870      font-size: 14px;
2871      text-decoration: none;
2872      transition: none;
2873  }
2874  
2875  #plugin-information-tabs a.current {
2876      margin: 0 -1px -1px;
2877      background: #fff;
2878      border: 1px solid #dcdcde;
2879      border-bottom-color: #fff;
2880      padding-top: 8px;
2881      color: #2c3338;
2882  }
2883  
2884  #plugin-information-tabs.with-banner a.current {
2885      border-top: none;
2886      padding-top: 9px;
2887  }
2888  
2889  #plugin-information-tabs a:active,
2890  #plugin-information-tabs a:focus {
2891      outline: none;
2892  }
2893  
2894  #plugin-information-content {
2895      overflow: hidden; /* equal height column trick */
2896      background: #fff;
2897      position: relative;
2898      top: 0;
2899      right: 0;
2900      left: 0;
2901      min-height: 100%;
2902      /* Height of title + tabs + install now */
2903      min-height: calc( 100% - 152px );
2904  }
2905  
2906  #plugin-information-content.with-banner {
2907      /* Height of banner + tabs + install now */
2908      min-height: calc( 100% - 346px );
2909  }
2910  
2911  #section-holder {
2912      position: relative;
2913      top: 0;
2914      right: 250px;
2915      bottom: 0;
2916      left: 0;
2917      margin-top: 10px;
2918      margin-right: 250px; /* FYI box */
2919      padding: 10px 26px 99999px; /* equal height column trick */
2920      margin-bottom: -99932px; /* 67px less than the padding below to accommodate footer height */
2921  }
2922  
2923  #section-holder .notice {
2924      margin: 5px 0 15px;
2925  }
2926  
2927  #section-holder .updated {
2928      margin: 16px 0;
2929  }
2930  
2931  #plugin-information .fyi {
2932      float: right;
2933      position: relative;
2934      top: 0;
2935      right: 0;
2936      padding: 16px 16px 99999px; /* equal height column trick */
2937      margin-bottom: -99932px; /* 67px less than the padding below to accommodate footer height */
2938      width: 217px;
2939      border-left: 1px solid #dcdcde;
2940      background: #f6f7f7;
2941      color: #646970;
2942  }
2943  
2944  #plugin-information .fyi strong {
2945      color: #3c434a;
2946  }
2947  
2948  #plugin-information .fyi h3 {
2949      font-weight: 600;
2950      text-transform: uppercase;
2951      font-size: 12px;
2952      color: #646970;
2953      margin: 24px 0 8px;
2954  }
2955  
2956  #plugin-information .fyi h2 {
2957      font-size: 0.9em;
2958      margin-bottom: 0;
2959      margin-right: 0;
2960  }
2961  
2962  #plugin-information .fyi ul {
2963      padding: 0;
2964      margin: 0;
2965      list-style: none;
2966  }
2967  
2968  #plugin-information .fyi li {
2969      margin: 0 0 10px;
2970  }
2971  
2972  #plugin-information .fyi-description {
2973      margin-top: 0;
2974  }
2975  
2976  #plugin-information .counter-container {
2977      margin: 3px 0;
2978  }
2979  
2980  #plugin-information .counter-label {
2981      float: left;
2982      margin-right: 5px;
2983      min-width: 55px;
2984  }
2985  
2986  #plugin-information .counter-back {
2987      height: 17px;
2988      width: 92px;
2989      background-color: #dcdcde;
2990      float: left;
2991  }
2992  
2993  #plugin-information .counter-bar {
2994      height: 17px;
2995      background-color: #f0c33c; /* slightly lighter than stars due to larger expanse */
2996      float: left;
2997  }
2998  
2999  #plugin-information .counter-count {
3000      margin-left: 5px;
3001  }
3002  
3003  #plugin-information .fyi ul.contributors {
3004      margin-top: 10px;
3005  }
3006  
3007  #plugin-information .fyi ul.contributors li {
3008      display: inline-block;
3009      margin-right: 8px;
3010      vertical-align: middle;
3011  }
3012  
3013  #plugin-information .fyi ul.contributors li {
3014      display: inline-block;
3015      margin-right: 8px;
3016      vertical-align: middle;
3017  }
3018  
3019  #plugin-information .fyi ul.contributors li img {
3020      vertical-align: middle;
3021      margin-right: 4px;
3022  }
3023  
3024  #plugin-information-footer {
3025      padding: 13px 16px;
3026      position: absolute;
3027      right: 0;
3028      bottom: 0;
3029      left: 0;
3030      height: 40px; /* actual height: 40+13+13+1=67 */
3031      border-top: 1px solid #dcdcde;
3032      background: #f6f7f7;
3033  }
3034  
3035  /* rtl:ignore */
3036  #plugin-information .section {
3037      direction: ltr;
3038  }
3039  
3040  /* rtl:ignore */
3041  #plugin-information .section ul,
3042  #plugin-information .section ol {
3043      list-style-type: disc;
3044      margin-left: 24px;
3045  }
3046  
3047  #plugin-information .section,
3048  #plugin-information .section p {
3049      font-size: 14px;
3050      line-height: 1.7;
3051  }
3052  
3053  #plugin-information #section-screenshots ol {
3054      list-style: none;
3055      margin: 0;
3056  }
3057  
3058  #plugin-information #section-screenshots li img {
3059      vertical-align: text-top;
3060      margin-top: 16px;
3061      max-width: 100%;
3062      width: auto;
3063      height: auto;
3064      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
3065  }
3066  
3067  /* rtl:ignore */
3068  #plugin-information #section-screenshots li p {
3069      font-style: italic;
3070      padding-left: 20px;
3071  }
3072  
3073  #plugin-information pre {
3074      padding: 7px;
3075      overflow: auto;
3076      border: 1px solid #c3c4c7;
3077  }
3078  
3079  #plugin-information blockquote {
3080      border-left: 2px solid #dcdcde;
3081      color: #646970;
3082      font-style: italic;
3083      margin: 1em 0;
3084      padding: 0 0 0 1em;
3085  }
3086  
3087  /* rtl:ignore */
3088  #plugin-information .review {
3089      overflow: hidden; /* clearfix */
3090      width: 100%;
3091      margin-bottom: 20px;
3092      border-bottom: 1px solid #dcdcde;
3093  }
3094  
3095  #plugin-information .review-title-section {
3096      overflow: hidden; /* clearfix */
3097  }
3098  
3099  /* rtl:ignore */
3100  #plugin-information .review-title-section h4 {
3101      display: inline-block;
3102      float: left;
3103      margin: 0 6px 0 0;
3104  }
3105  
3106  #plugin-information .reviewer-info p {
3107      clear: both;
3108      margin: 0;
3109      padding-top: 2px;
3110  }
3111  
3112  /* rtl:ignore */
3113  #plugin-information .reviewer-info .avatar {
3114      float: left;
3115      margin: 4px 6px 0 0;
3116  }
3117  
3118  /* rtl:ignore */
3119  #plugin-information .reviewer-info .star-rating {
3120      float: left;
3121  }
3122  
3123  /* rtl:ignore */
3124  #plugin-information .review-meta {
3125      float: left;
3126      margin-left: 0.75em;
3127  }
3128  
3129  /* rtl:ignore */
3130  #plugin-information .review-body {
3131      float: left;
3132      width: 100%;
3133  }
3134  
3135  .plugin-version-author-uri {
3136      font-size: 13px;
3137  }
3138  
3139  /* For non-js plugin installation screen ticket #36430. */
3140  .update-php .button.button-primary {
3141      margin-right: 1em;
3142  }
3143  
3144  @media screen and (max-width: 771px) {
3145      #plugin-information-title.with-banner {
3146          height: 100px;
3147      }
3148  
3149      #plugin-information-title.with-banner h2 {
3150          margin-top: 30px;
3151          font-size: 20px;
3152          line-height: 2;
3153          max-width: 85%;
3154      }
3155  
3156      #plugin-information-title.with-banner div.vignette {
3157          height: 100px;
3158      }
3159  
3160      #plugin-information-tabs {
3161          overflow: hidden; /* clearfix */
3162          padding: 0;
3163          height: auto; /* let tabs wrap */
3164      }
3165  
3166      #plugin-information-tabs a.current {
3167          margin-bottom: 0;
3168          border-bottom: none;
3169      }
3170  
3171      #plugin-information .fyi {
3172          float: none;
3173          border: 1px solid #dcdcde;
3174          position: static;
3175          width: auto;
3176          margin: 26px 26px 0;
3177          padding-bottom: 0; /* reset from the two column height fix */
3178      }
3179  
3180      #section-holder {
3181          position: static;
3182          margin: 0;
3183          padding-bottom: 70px; /* reset from the two column height fix, plus accommodate footer */
3184      }
3185  
3186      #plugin-information .fyi h3,
3187      #plugin-information .fyi small {
3188          display: none;
3189      }
3190  
3191      #plugin-information-footer {
3192          padding: 12px 16px 0;
3193          height: 46px;
3194      }
3195  }
3196  
3197  /* Thickbox for the Plugin details modal. */
3198  #TB_window.plugin-details-modal {
3199      background: #fff;
3200  }
3201  
3202  #TB_window.plugin-details-modal.thickbox-loading:before {
3203      content: "";
3204      display: block;
3205      width: 20px;
3206      height: 20px;
3207      position: absolute;
3208      left: 50%;
3209      top: 50%;
3210      z-index: -1;
3211      margin: -10px 0 0 -10px;
3212      background: #fff url(../images/spinner.gif) no-repeat center;
3213      background-size: 20px 20px;
3214      transform: translateZ(0);
3215  }
3216  
3217  @media print,
3218      (min-resolution: 120dpi) {
3219  
3220      #TB_window.plugin-details-modal.thickbox-loading:before {
3221          background-image: url(../images/spinner-2x.gif);
3222      }
3223  }
3224  
3225  .plugin-details-modal #TB_title {
3226      float: left;
3227      height: 1px;
3228  }
3229  
3230  .plugin-details-modal #TB_ajaxWindowTitle {
3231      display: none;
3232  }
3233  
3234  .plugin-details-modal #TB_closeWindowButton {
3235      left: auto;
3236      right: -30px;
3237      color: #f0f0f1;
3238  }
3239  
3240  .plugin-details-modal #TB_closeWindowButton:hover,
3241  .plugin-details-modal #TB_closeWindowButton:focus {
3242      outline: none;
3243      box-shadow: none;
3244  }
3245  
3246  .plugin-details-modal #TB_closeWindowButton:hover::after,
3247  .plugin-details-modal #TB_closeWindowButton:focus::after {
3248      outline: 2px solid;
3249      outline-offset: -4px;
3250      border-radius: 4px;
3251  }
3252  
3253  .plugin-details-modal .tb-close-icon {
3254      display: none;
3255  }
3256  
3257  .plugin-details-modal #TB_closeWindowButton:after {
3258      content: "\f335";
3259      content: "\f335" / '';
3260      font: normal 32px/29px 'dashicons';
3261      -webkit-font-smoothing: antialiased;
3262      -moz-osx-font-smoothing: grayscale;
3263  }
3264  
3265  /* move plugin install close icon to top on narrow screens */
3266  @media screen and (max-width: 830px) {
3267      .plugin-details-modal #TB_closeWindowButton {
3268          right: 0;
3269          top: -30px;
3270      }
3271  }
3272  
3273  /* @todo: move this. */
3274  img {
3275      border: none;
3276  }
3277  
3278  /* Metabox collapse arrow indicators */
3279  .sidebar-name .toggle-indicator::before,
3280  .meta-box-sortables .postbox .toggle-indicator::before,
3281  .meta-box-sortables .postbox .order-higher-indicator::before,
3282  .meta-box-sortables .postbox .order-lower-indicator::before,
3283  .bulk-action-notice .toggle-indicator::before,
3284  .privacy-text-box .toggle-indicator::before {
3285      content: "\f142";
3286      content: "\f142" / '';
3287      display: inline-block;
3288      font: normal 20px/1 dashicons;
3289      -webkit-font-smoothing: antialiased;
3290      -moz-osx-font-smoothing: grayscale;
3291      text-decoration: none;
3292  }
3293  
3294  .js .widgets-holder-wrap.closed .toggle-indicator::before,
3295  .meta-box-sortables .postbox.closed .handlediv .toggle-indicator::before,
3296  .bulk-action-notice .bulk-action-errors-collapsed .toggle-indicator::before,
3297  .privacy-text-box.closed .toggle-indicator::before {
3298      content: "\f140";
3299      content: "\f140" / '';
3300  }
3301  
3302  .postbox .handle-order-higher .order-higher-indicator::before {
3303      content: "\f343";
3304      content: "\f343" / '';
3305      color: inherit;
3306  }
3307  
3308  .postbox .handle-order-lower .order-lower-indicator::before {
3309      content: "\f347";
3310      content: "\f347" / '';
3311      color: inherit;
3312  }
3313  
3314  .postbox .handle-order-higher .order-higher-indicator::before,
3315  .postbox .handle-order-lower .order-lower-indicator::before {
3316      position: relative;
3317      top: 0.11rem;
3318      width: 20px;
3319      height: 20px;
3320  }
3321  
3322  .postbox .handlediv .toggle-indicator::before {
3323      width: 20px;
3324      border-radius: 50%;
3325  }
3326  
3327  .postbox .handlediv .toggle-indicator::before {
3328      position: relative;
3329      top: 0.05rem;
3330      text-indent: -1px; /* account for the dashicon glyph uneven horizontal alignment */
3331  }
3332  
3333  .rtl .postbox .handlediv .toggle-indicator::before {
3334      text-indent: 1px; /* account for the dashicon glyph uneven horizontal alignment */
3335  }
3336  
3337  .bulk-action-notice .toggle-indicator::before {
3338      line-height: 16px;
3339      vertical-align: top;
3340      color: #787c82;
3341  }
3342  
3343  .postbox .handle-order-higher:focus,
3344  .postbox .handle-order-lower:focus,
3345  .postbox .handlediv:focus {
3346      box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus, 1.5px) var(--wp-admin-theme-color);
3347      border-radius: 50%;
3348      /* Only visible in Windows High Contrast mode */
3349      outline: 2px solid transparent;
3350  }
3351  
3352  .postbox .handle-order-higher:focus .order-higher-indicator::before,
3353  .postbox .handle-order-lower:focus .order-lower-indicator::before,
3354  .postbox .handlediv:focus .toggle-indicator::before {
3355      box-shadow: none;
3356      /* Only visible in Windows High Contrast mode */
3357      outline: 1px solid transparent;
3358  }
3359  
3360  /* @todo: appears to be Press This only and overridden */
3361  #photo-add-url-div input[type="text"] {
3362      width: 300px;
3363  }
3364  
3365  /* Theme/Plugin file editor */
3366  .alignleft h2 {
3367      margin: 0;
3368  }
3369  
3370  #template textarea {
3371      font-family: Consolas, Monaco, monospace;
3372      font-size: 13px;
3373      background: #f6f7f7;
3374      tab-size: 4;
3375  }
3376  
3377  #template textarea,
3378  #template .CodeMirror {
3379      width: 100%;
3380      min-height: 60vh;
3381      height: calc( 100vh - 295px );
3382      border: 1px solid #dcdcde;
3383      box-sizing: border-box;
3384  }
3385  
3386  #templateside > h2 {
3387      padding-top: 6px;
3388      padding-bottom: 7px;
3389      margin: 0;
3390  }
3391  
3392  #templateside ol,
3393  #templateside ul {
3394      margin: 0;
3395      padding: 0;
3396  }
3397  #templateside > ul {
3398      box-sizing: border-box;
3399      margin-top: 0;
3400      overflow: auto;
3401      padding: 0;
3402      min-height: 60vh;
3403      height: calc(100vh - 295px);
3404      background-color: #f6f7f7;
3405      border: 1px solid #dcdcde;
3406      border-left: none;
3407  }
3408  #templateside ul ul {
3409      padding-left: 12px;
3410  }
3411  #templateside > ul > li > ul[role=group] {
3412      padding-left: 0;
3413  }
3414  
3415  /*
3416   * Styles for Theme and Plugin file editors.
3417   */
3418  
3419  /* Hide collapsed items. */
3420  [role="treeitem"][aria-expanded="false"] > ul {
3421      display: none;
3422  }
3423  
3424  /* Use arrow dashicons for folder states, but hide from screen readers. */
3425  [role="treeitem"] span[aria-hidden] {
3426      display: inline;
3427      font-family: dashicons;
3428      font-size: 20px;
3429      position: absolute;
3430      pointer-events: none;
3431  }
3432  [role="treeitem"][aria-expanded="false"] > .folder-label .icon:after {
3433      content: "\f139";
3434      content: "\f139" / '';
3435  }
3436  [role="treeitem"][aria-expanded="true"] > .folder-label .icon:after {
3437      content: "\f140";
3438      content: "\f140" / '';
3439  }
3440  [role="treeitem"] .folder-label {
3441      display: block;
3442      padding: 3px 3px 3px 12px;
3443      cursor: pointer;
3444  }
3445  
3446  /* Remove outline, and create our own focus and hover styles */
3447  [role="treeitem"] {
3448      outline: 0;
3449  }
3450  
3451  [role="treeitem"] a:focus,
3452  [role="treeitem"] .folder-label.focus {
3453      color: #043959;
3454      /* Reset default focus style. */
3455      box-shadow: none;
3456      /* Use an inset outline instead, so it's visible also over the current file item. */
3457      outline: 2px solid var(--wp-admin-theme-color, #3858e9);
3458      outline-offset: -2px;
3459  }
3460  
3461  [role="treeitem"].hover,
3462  [role="treeitem"] .folder-label.hover {
3463      background-color: #f0f0f1;
3464  }
3465  
3466  .tree-folder {
3467      margin: 0;
3468      position: relative;
3469  }
3470  [role="treeitem"] li {
3471      position: relative;
3472  }
3473  
3474  /* Styles for folder indicators/depth */
3475  .tree-folder .tree-folder::after {
3476      content: "";
3477      display: block;
3478      position: absolute;
3479      left: 2px;
3480      border-left: 1px solid #c3c4c7;
3481      top: -13px;
3482      bottom: 10px;
3483  }
3484  .tree-folder > li::before {
3485      content: "";
3486      position: absolute;
3487      display: block;
3488      border-left: 1px solid #c3c4c7;
3489      left: 2px;
3490      top: -5px;
3491      height: 18px;
3492      width: 7px;
3493      border-bottom: 1px solid #c3c4c7;
3494  }
3495  .tree-folder > li::after {
3496      content: "";
3497      position: absolute;
3498      display: block;
3499      border-left: 1px solid #c3c4c7;
3500      left: 2px;
3501      bottom: -7px;
3502      top: 0;
3503  }
3504  
3505  /* current-file needs to adjustment for .notice styles */
3506  #templateside .current-file {
3507      margin: -4px 0 -2px;
3508  }
3509  .tree-folder > .current-file::before {
3510      left: 4px;
3511      height: 15px;
3512      width: 0;
3513      border-left: none;
3514      top: 3px;
3515  }
3516  .tree-folder > .current-file::after {
3517      bottom: -4px;
3518      height: 7px;
3519      left: 2px;
3520      top: auto;
3521  }
3522  
3523  /* Lines shouldn't continue on last item */
3524  .tree-folder > li:last-child::after,
3525  .tree-folder li:last-child > .tree-folder::after {
3526      display: none;
3527  }
3528  
3529  #theme-plugin-editor-selector,
3530  #theme-plugin-editor-label,
3531  #documentation label {
3532      font-weight: 600;
3533  }
3534  
3535  #theme-plugin-editor-label {
3536      display: inline-block;
3537      margin-bottom: 1em;
3538  }
3539  
3540  /* rtl:ignore */
3541  #template textarea,
3542  #docs-list {
3543      direction: ltr;
3544  }
3545  
3546  .fileedit-sub #theme,
3547  .fileedit-sub #plugin {
3548      max-width: 40%;
3549  }
3550  .fileedit-sub .alignright {
3551      text-align: right;
3552  }
3553  
3554  #template p {
3555      width: 97%;
3556  }
3557  
3558  #file-editor-linting-error {
3559      margin-top: 1em;
3560      margin-bottom: 1em;
3561  }
3562  #file-editor-linting-error > .notice {
3563      margin: 0;
3564      display: inline-block;
3565  }
3566  #file-editor-linting-error > .notice > p {
3567      width: auto;
3568  }
3569  #template .submit {
3570      margin-top: 1em;
3571      padding: 0;
3572  }
3573  
3574  #template .submit input[type=submit][disabled] {
3575      cursor: not-allowed;
3576  }
3577  #templateside {
3578      float: right;
3579      width: 16em;
3580      word-wrap: break-word;
3581  }
3582  
3583  #postcustomstuff p.submit {
3584      margin: 0;
3585  }
3586  
3587  #templateside h4 {
3588      margin: 1em 0 0;
3589  }
3590  
3591  #templateside li {
3592      margin: 4px 0;
3593  }
3594  
3595  #templateside li:not(.howto) a,
3596  .theme-editor-php .highlight {
3597      display: block;
3598      padding: 3px 0 3px 12px;
3599      text-decoration: none;
3600  }
3601  
3602  #templateside li.current-file > a {
3603      padding-bottom: 0;
3604  }
3605  
3606  #templateside li:not(.howto) > a:first-of-type {
3607      padding-top: 0;
3608  }
3609  
3610  #templateside li.howto {
3611      padding: 6px 12px 12px;
3612  }
3613  
3614  .theme-editor-php .highlight {
3615      margin: -3px 3px -3px -12px;
3616  }
3617  
3618  #templateside .highlight {
3619      border: none;
3620      font-weight: 600;
3621  }
3622  
3623  .nonessential {
3624      color: #646970;
3625      font-size: 11px;
3626      font-style: italic;
3627      padding-left: 12px;
3628  }
3629  
3630  #documentation {
3631      margin-top: 10px;
3632  }
3633  
3634  #documentation label {
3635      line-height: 1.8;
3636      vertical-align: baseline;
3637  }
3638  
3639  .fileedit-sub {
3640      padding: 10px 0 8px;
3641      line-height: 180%;
3642  }
3643  
3644  #file-editor-warning .file-editor-warning-content {
3645      margin: 25px;
3646  }
3647  
3648  /* @todo: can we use a common class for these? */
3649  .nav-menus-php .item-edit:before,
3650  .wp-customizer .control-section .accordion-section-title:after,
3651  .wp-customizer .accordion-section-title:after,
3652  .widget-top .widget-action .toggle-indicator:before {
3653      content: "\f140";
3654      content: "\f140" / '';
3655      font: normal 20px/1 dashicons;
3656      display: block;
3657      -webkit-font-smoothing: antialiased;
3658      -moz-osx-font-smoothing: grayscale;
3659      text-decoration: none;
3660  }
3661  
3662  .widget-top .widget-action .toggle-indicator:before {
3663      padding: 1px 2px 1px 0;
3664      border-radius: 50%;
3665  }
3666  
3667  .handlediv,
3668  .postbox .handlediv.button-link,
3669  .item-edit,
3670  .toggle-indicator {
3671      color: #646970;
3672  }
3673  
3674  .widget-action {
3675      color: #50575e; /* #fafafa background in the Widgets screen */
3676  }
3677  
3678  .widget-top:hover .widget-action,
3679  .widget-action:focus,
3680  .handlediv:hover,
3681  .handlediv:focus,
3682  .postbox .handlediv.button-link:hover,
3683  .postbox .handlediv.button-link:focus,
3684  .item-edit:hover,
3685  .item-edit:focus,
3686  .sidebar-name:hover .toggle-indicator {
3687      color: #1d2327;
3688      /* Only visible in Windows High Contrast mode */
3689      outline: 2px solid transparent;
3690  }
3691  
3692  .widget-top .widget-action:focus .toggle-indicator:before {
3693      box-shadow: 0 0 0 var(--wp-admin-border-width-focus, 1.5px) var(--wp-admin-theme-color, #3858e9);
3694      /* Only visible in Windows High Contrast mode */
3695      outline: 2px solid transparent;
3696  }
3697  
3698  #customize-info.open .accordion-section-title:after,
3699  .nav-menus-php .menu-item-edit-active .item-edit:before,
3700  .widget.open .widget-top .widget-action .toggle-indicator:before,
3701  .widget.widget-in-question .widget-top .widget-action .toggle-indicator:before {
3702      content: "\f142";
3703      content: "\f142" / '';
3704  }
3705  
3706  /*!
3707   * jQuery UI Draggable/Sortable 1.11.4
3708   * http://jqueryui.com
3709   *
3710   * Copyright jQuery Foundation and other contributors
3711   * Released under the MIT license.
3712   * http://jquery.org/license
3713   */
3714  .ui-draggable-handle,
3715  .ui-sortable-handle {
3716      touch-action: none;
3717  }
3718  
3719  /* Accordion */
3720  .accordion-section {
3721      border-bottom: 1px solid #dcdcde;
3722      margin: 0;
3723  }
3724  
3725  .accordion-section.open .accordion-section-content,
3726  .no-js .accordion-section .accordion-section-content {
3727      display: block;
3728  }
3729  
3730  .accordion-section.open:hover {
3731      border-bottom-color: #dcdcde;
3732  }
3733  
3734  .accordion-section-content {
3735      display: none;
3736      padding: 10px 20px 15px;
3737      overflow: hidden;
3738      background: #fff;
3739  }
3740  
3741  .accordion-section-title {
3742      margin: 0;
3743      position: relative;
3744      border-left: 1px solid #dcdcde;
3745      border-right: 1px solid #dcdcde;
3746      -webkit-user-select: none;
3747      user-select: none;
3748  }
3749  
3750  .js .accordion-section-title {
3751      cursor: pointer;
3752  }
3753  
3754  .js .accordion-section-title:after {
3755      position: absolute;
3756      top: 12px;
3757      right: 10px;
3758      z-index: 1;
3759  }
3760  
3761  .accordion-section-title:focus {
3762      /* Only visible in Windows High Contrast mode */
3763      outline: 1px solid transparent;
3764  }
3765  
3766  .accordion-section-title:hover:after,
3767  .accordion-section-title:focus:after {
3768      border-color: #a7aaad transparent;
3769      /* Only visible in Windows High Contrast mode */
3770      outline: 1px solid transparent;
3771  }
3772  
3773  .cannot-expand .accordion-section-title {
3774      cursor: auto;
3775  }
3776  
3777  .cannot-expand .accordion-section-title:after {
3778      display: none;
3779  }
3780  
3781  .control-section .accordion-section-title,
3782  .customize-pane-child .accordion-section-title {
3783      border-left: none;
3784      border-right: none;
3785      padding: 10px 10px 11px 14px;
3786      line-height: 1.55;
3787      background: #fff;
3788  }
3789  
3790  .control-section .accordion-section-title:after,
3791  .customize-pane-child .accordion-section-title:after {
3792      top: calc(50% - 10px); /* Arrow height is 20px, so use half of that to vertically center */
3793  }
3794  
3795  .js .control-section:hover .accordion-section-title,
3796  .js .control-section .accordion-section-title:hover,
3797  .js .control-section.open .accordion-section-title,
3798  .js .control-section .accordion-section-title:focus {
3799      color: #1d2327;
3800      background: #f6f7f7;
3801  }
3802  
3803  .control-section.open .accordion-section-title {
3804      /* When expanded */
3805      border-bottom: 1px solid #dcdcde;
3806  }
3807  
3808  /* Edit Site */
3809  .network-admin .edit-site-actions {
3810      margin-top: 0;
3811  }
3812  
3813  /* My Sites */
3814  .my-sites {
3815      display: block;
3816      overflow: auto;
3817      zoom: 1;
3818  }
3819  
3820  .my-sites li {
3821      display: block;
3822      padding: 8px 3%;
3823      min-height: 130px;
3824      margin: 0;
3825  }
3826  
3827  @media only screen and (max-width: 599px) {
3828      .my-sites li {
3829          min-height: 0;
3830      }
3831  }
3832  
3833  @media only screen and (min-width: 600px) {
3834      .my-sites.striped li {
3835          background-color: #fff;
3836          position: relative;
3837      }
3838      .my-sites.striped li:after {
3839          content: "";
3840          width: 1px;
3841          height: 100%;
3842          position: absolute;
3843          top: 0;
3844          right: 0;
3845          background: #c3c4c7;
3846      }
3847  
3848  }
3849  @media only screen and (min-width: 600px) and (max-width: 699px) {
3850      .my-sites li{
3851          float: left;
3852          width: 44%;
3853      }
3854      .my-sites.striped li {
3855          background-color: #fff;
3856      }
3857      .my-sites.striped li:nth-of-type(2n+1) {
3858          clear: left;
3859      }
3860      .my-sites.striped li:nth-of-type(2n+2):after {
3861          content: none;
3862      }
3863      .my-sites li:nth-of-type(4n+1),
3864      .my-sites li:nth-of-type(4n+2) {
3865          background-color: #f6f7f7;
3866      }
3867  
3868  }
3869  
3870  @media only screen and (min-width: 700px) and (max-width: 1199px) {
3871      .my-sites li {
3872          float: left;
3873          width: 27.333333%;
3874          background-color: #fff;
3875      }
3876      .my-sites.striped li:nth-of-type(3n+3):after {
3877          content: none;
3878      }
3879      .my-sites li:nth-of-type(6n+1),
3880      .my-sites li:nth-of-type(6n+2),
3881      .my-sites li:nth-of-type(6n+3) {
3882          background-color: #f6f7f7;
3883      }
3884  }
3885  
3886  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
3887      .my-sites li {
3888          float: left;
3889          width: 21%;
3890          padding: 8px 2%;
3891          background-color: #fff;
3892      }
3893      .my-sites.striped li:nth-of-type(4n+1) {
3894          clear: left;
3895      }
3896      .my-sites.striped li:nth-of-type(4n+4):after {
3897          content: none;
3898      }
3899      .my-sites li:nth-of-type(8n+1),
3900      .my-sites li:nth-of-type(8n+2),
3901      .my-sites li:nth-of-type(8n+3),
3902      .my-sites li:nth-of-type(8n+4) {
3903          background-color: #f6f7f7;
3904      }
3905  }
3906  
3907  @media only screen and (min-width: 1400px) and (max-width: 1599px) {
3908      .my-sites li {
3909          float: left;
3910          width: 16%;
3911          padding: 8px 2%;
3912          background-color: #fff;
3913      }
3914      .my-sites.striped li:nth-of-type(5n+1) {
3915          clear: left;
3916      }
3917      .my-sites.striped li:nth-of-type(5n+5):after {
3918          content: none;
3919      }
3920      .my-sites li:nth-of-type(10n+1),
3921      .my-sites li:nth-of-type(10n+2),
3922      .my-sites li:nth-of-type(10n+3),
3923      .my-sites li:nth-of-type(10n+4),
3924      .my-sites li:nth-of-type(10n+5) {
3925          background-color: #f6f7f7;
3926      }
3927  }
3928  
3929  @media only screen and (min-width: 1600px) {
3930      .my-sites li {
3931          float: left;
3932          width: 12.666666%;
3933          padding: 8px 2%;
3934          background-color: #fff;
3935      }
3936      .my-sites.striped li:nth-of-type(6n+1) {
3937          clear: left;
3938      }
3939      .my-sites.striped li:nth-of-type(6n+6):after {
3940          content: none;
3941      }
3942      .my-sites li:nth-of-type(12n+1),
3943      .my-sites li:nth-of-type(12n+2),
3944      .my-sites li:nth-of-type(12n+3),
3945      .my-sites li:nth-of-type(12n+4),
3946      .my-sites li:nth-of-type(12n+5),
3947      .my-sites li:nth-of-type(12n+6) {
3948          background-color: #f6f7f7;
3949      }
3950  }
3951  
3952  .my-sites li a {
3953      text-decoration: none;
3954  }
3955  
3956  /* =Media Queries
3957  -------------------------------------------------------------- */
3958  
3959  /**
3960   * HiDPI Displays
3961   */
3962  @media print,
3963    (min-resolution: 120dpi) {
3964      /* Back-compat for pre-3.8 */
3965      div.star-holder,
3966      div.star-holder .star-rating {
3967          background: url(../images/stars-2x.png?ver=20121108) repeat-x bottom left;
3968          background-size: 21px 37px;
3969      }
3970  
3971      .spinner {
3972          background-image: url(../images/spinner-2x.gif);
3973      }
3974  
3975  }
3976  
3977  @media screen and (max-width: 782px) {
3978      html.wp-toolbar {
3979          padding-top: var(--wp-admin--admin-bar--height);
3980      }
3981  
3982      .screen-reader-shortcut:focus {
3983          top: -39px;
3984      }
3985  
3986      .block-editor-page .screen-reader-shortcut:focus {
3987          top: 7px;
3988      }
3989  
3990      .screen-reader-shortcut[href="#wp-toolbar"] {
3991          display: none;
3992      }
3993  
3994      body {
3995          min-width: 240px;
3996          overflow-x: hidden;
3997      }
3998  
3999      body * {
4000          -webkit-tap-highlight-color: rgba(0, 0, 0, 0) !important;
4001      }
4002  
4003      #wpcontent {
4004          position: relative;
4005          margin-left: 0;
4006          padding-left: 10px;
4007      }
4008  
4009      #wpbody-content {
4010          padding-bottom: 100px;
4011      }
4012  
4013      .wrap {
4014          clear: both;
4015          margin-right: 12px;
4016          margin-left: 0;
4017      }
4018  
4019      /* categories */
4020      #col-left,
4021      #col-right {
4022          float: none;
4023          width: auto;
4024      }
4025  
4026      #col-left .col-wrap,
4027      #col-right .col-wrap {
4028          padding: 0;
4029      }
4030  
4031      /* Hidden Elements */
4032      #collapse-menu,
4033      .post-format-select {
4034          display: none !important;
4035      }
4036  
4037      .wrap h1.wp-heading-inline {
4038          margin-bottom: 0.5em;
4039      }
4040  
4041      .wrap .add-new-h2, /* deprecated */
4042      .wrap .add-new-h2:active, /* deprecated */
4043      .wrap .page-title-action,
4044      .wrap .page-title-action:active {
4045          padding: 0 14px;
4046          font-size: 14px;
4047          white-space: nowrap;
4048          min-height: 40px;
4049          line-height: 2.71428571;
4050          vertical-align: middle;
4051      }
4052  
4053      /* Feedback Messages */
4054      .notice,
4055      .wrap div.updated,
4056      .wrap div.error,
4057      .media-upload-form div.error {
4058          margin: 20px 0 10px;
4059          padding: 5px 10px;
4060          font-size: 14px;
4061          line-height: 175%;
4062      }
4063  
4064      .wp-core-ui .notice.is-dismissible {
4065          padding-right: 46px;
4066      }
4067  
4068      .notice-dismiss {
4069          padding: 13px;
4070      }
4071  
4072      .wrap .icon32 + h2 {
4073          margin-top: -2px;
4074      }
4075  
4076      .wp-responsive-open #wpbody {
4077          right: -16em;
4078      }
4079  
4080      code {
4081          word-wrap: break-word;
4082          word-wrap: anywhere; /* Firefox. Allow breaking long words anywhere */
4083          word-break: break-word; /* Webkit: Treated similarly to word-wrap: break-word */
4084      }
4085  
4086      /* General Metabox */
4087      .postbox {
4088          font-size: 14px;
4089      }
4090  
4091      .metabox-holder h3.hndle, /* Back-compat for pre-4.4 */
4092      .metabox-holder .stuffbox > h3, /* Back-compat for pre-4.4 */
4093      .metabox-holder .postbox > h3, /* Back-compat for pre-4.4 */
4094      .metabox-holder h2 {
4095          padding: 12px;
4096      }
4097  
4098      .nav-menus-php .metabox-holder h3 {
4099          padding: 0;
4100      }
4101  
4102      .postbox .handlediv {
4103          margin-top: 3px;
4104      }
4105  
4106      /* Subsubsub Nav */
4107      .subsubsub {
4108          font-size: 16px;
4109          text-align: center;
4110          margin-bottom: 15px;
4111      }
4112  
4113      /* Theme/Plugin File Editor */
4114  
4115      #template textarea,
4116      #template .CodeMirror {
4117          box-sizing: border-box;
4118      }
4119  
4120      #templateside {
4121          float: none;
4122          width: auto;
4123      }
4124  
4125      #templateside > ul {
4126          border-left: 1px solid #dcdcde;
4127      }
4128  
4129      #templateside li {
4130          margin: 0;
4131      }
4132  
4133      #templateside li:not(.howto) a {
4134          display: block;
4135          padding: 5px;
4136      }
4137      #templateside li.howto {
4138          padding: 12px;
4139      }
4140  
4141      #templateside .highlight {
4142          padding: 5px;
4143          margin-left: -5px;
4144          margin-top: -5px;
4145      }
4146  
4147      #template > div,
4148      #template .notice {
4149          float: none;
4150          margin: 1em 0;
4151          width: auto;
4152      }
4153  
4154      #template .CodeMirror,
4155      #template textarea {
4156          width: 100%;
4157      }
4158  
4159      #templateside ul ul {
4160          padding-left: 1.5em;
4161      }
4162      [role="treeitem"] .folder-label {
4163          display: block;
4164          padding: 5px;
4165      }
4166      .tree-folder > li::before,
4167      .tree-folder > li::after,
4168      .tree-folder .tree-folder::after {
4169          left: -8px;
4170      }
4171      .tree-folder > li::before {
4172          top: 0;
4173          height: 13px;
4174      }
4175      .tree-folder > .current-file::before {
4176          left: -5px;
4177          top: 7px;
4178          width: 4px;
4179      }
4180      .tree-folder > .current-file::after {
4181          height: 9px;
4182          left: -8px;
4183      }
4184      .wrap #templateside span.notice {
4185          margin-left: -5px;
4186          width: 100%;
4187      }
4188  
4189      .fileedit-sub .alignright {
4190          float: left;
4191          margin-top: 15px;
4192          width: 100%;
4193          text-align: left;
4194      }
4195  
4196      .fileedit-sub .alignright label {
4197          display: block;
4198      }
4199  
4200      .fileedit-sub #theme,
4201      .fileedit-sub #plugin {
4202          margin-left: 0;
4203          max-width: 70%;
4204      }
4205  
4206      .fileedit-sub input[type="submit"] {
4207          margin-bottom: 0;
4208      }
4209  
4210      #documentation label[for="docs-list"] {
4211          display: block;
4212      }
4213  
4214      #documentation select[name="docs-list"] {
4215          margin-left: 0;
4216          max-width: 60%;
4217      }
4218  
4219      #documentation input[type="button"] {
4220          margin-bottom: 0;
4221      }
4222  
4223      #wpfooter {
4224          display: none;
4225      }
4226  
4227      #comments-form .checkforspam {
4228          display: none;
4229      }
4230  
4231      .edit-comment-author {
4232          margin: 2px 0 0;
4233      }
4234  
4235      .filter-drawer .filter-group-feature input,
4236      .filter-drawer .filter-group-feature label {
4237          line-height: 2.1;
4238      }
4239  
4240      .filter-drawer .filter-group-feature label {
4241          margin-left: 32px;
4242      }
4243  
4244      .wp-filter .button.drawer-toggle {
4245          font-size: 13px;
4246          line-height: 2;
4247          height: 28px;
4248      }
4249  
4250      /* Fix help tab columns for smaller screens */
4251      #screen-meta #contextual-help-wrap {
4252          overflow: visible;
4253      }
4254  
4255      #screen-meta #contextual-help-back,
4256      #screen-meta .contextual-help-sidebar {
4257          display: none;
4258      }
4259  
4260      #screen-meta .contextual-help-tabs {
4261          clear: both;
4262          width: 100%;
4263          float: none;
4264      }
4265  
4266      #screen-meta .contextual-help-tabs ul {
4267          margin: 0 0 1em;
4268          padding: 1em 0 0;
4269      }
4270  
4271      #screen-meta .contextual-help-tabs .active {
4272          margin: 0;
4273      }
4274  
4275      #screen-meta .contextual-help-tabs-wrap {
4276          clear: both;
4277          max-width: 100%;
4278          float: none;
4279      }
4280  
4281      #screen-meta,
4282      #screen-meta-links {
4283          margin-right: 10px;
4284      }
4285  
4286      #screen-meta-links {
4287          margin-bottom: 20px; /* Add margins beneath links for better spacing between boxes and elements */
4288      }
4289  
4290      #screen-meta-links .show-settings:after {
4291          line-height: 1.9;
4292      }
4293  
4294      .wp-filter .search-form input[type="search"] {
4295          font-size: 1rem;
4296      }
4297  
4298      .wp-filter .search-form.search-plugins {
4299          /* This element is a flex item. */
4300          min-width: 100%;
4301      }
4302  }
4303  
4304  /* Smartphone */
4305  @media screen and (max-width: 600px) {
4306      /* Disable horizontal scroll when responsive menu is open
4307         since we push the main content off to the right. */
4308      #wpwrap.wp-responsive-open {
4309          overflow-x: hidden;
4310      }
4311  
4312      html.wp-toolbar {
4313          padding-top: 0;
4314      }
4315  
4316      .screen-reader-shortcut:focus {
4317          top: 7px;
4318      }
4319  
4320      #wpbody {
4321          padding-top: 46px;
4322      }
4323  
4324      /* Keep full-width boxes on Edit Post page from causing horizontal scroll */
4325      div#post-body.metabox-holder.columns-1 {
4326          overflow-x: hidden;
4327      }
4328  
4329      h1.nav-tab-wrapper,
4330      .wrap h2.nav-tab-wrapper,
4331      .nav-tab-wrapper {
4332          border-bottom: 0;
4333      }
4334  
4335      h1 .nav-tab,
4336      h2 .nav-tab,
4337      h3 .nav-tab,
4338      nav .nav-tab {
4339          margin: 10px 10px 0 0;
4340          border-bottom: 1px solid #c3c4c7;
4341      }
4342  
4343      .nav-tab-active:hover,
4344      .nav-tab-active:focus,
4345      .nav-tab-active:focus:active {
4346          border-bottom: 1px solid #c3c4c7;
4347      }
4348  
4349      .wp-filter .search-form.search-plugins label {
4350          width: 100%;
4351      }
4352  }
4353  
4354  @media screen and (max-width: 480px) {
4355      .metabox-prefs-container {
4356          display: grid;
4357      }
4358  
4359      .metabox-prefs-container > * {
4360          display: inline-block;
4361          padding: 2px;
4362      }
4363  }
4364  
4365  @media screen and (max-width: 320px) {
4366      /* Prevent default center alignment and larger font for the Right Now widget when
4367         the network dashboard is viewed on a small mobile device. */
4368      #network_dashboard_right_now .subsubsub {
4369          font-size: 14px;
4370          text-align: left;
4371      }
4372  }
PHP Cross Reference of WordPress Trunk (Updated Daily)

/wp-admin/css/ -> common.css (source)
