[Summary view] [Print] [Text view]

   1  /*! This file is auto-generated */
   2  #wpbody-content #dashboard-widgets.columns-1 .postbox-container {
   3      width: 100%;
   4  }
   5  
   6  #wpbody-content #dashboard-widgets.columns-2 .postbox-container {
   7      width: 49.5%;
   8  }
   9  
  10  #wpbody-content #dashboard-widgets.columns-2 #postbox-container-2,
  11  #wpbody-content #dashboard-widgets.columns-2 #postbox-container-3,
  12  #wpbody-content #dashboard-widgets.columns-2 #postbox-container-4 {
  13      float: left;
  14      width: 50.5%;
  15  }
  16  
  17  #wpbody-content #dashboard-widgets.columns-3 .postbox-container {
  18      width: 33.5%;
  19  }
  20  
  21  #wpbody-content #dashboard-widgets.columns-3 #postbox-container-1 {
  22      width: 33%;
  23  }
  24  
  25  #wpbody-content #dashboard-widgets.columns-3 #postbox-container-3,
  26  #wpbody-content #dashboard-widgets.columns-3 #postbox-container-4 {
  27      float: left;
  28  }
  29  
  30  #wpbody-content #dashboard-widgets.columns-4 .postbox-container {
  31      width: 25%;
  32  }
  33  
  34  #dashboard-widgets .postbox-container {
  35      width: 25%;
  36  }
  37  
  38  #dashboard-widgets-wrap .columns-3 #postbox-container-4 .empty-container {
  39      border: none !important;
  40  }
  41  
  42  #dashboard-widgets-wrap {
  43      overflow: hidden;
  44      margin: 0 -8px;
  45  }
  46  
  47  #dashboard-widgets .postbox {
  48      border-radius: 8px;
  49  }
  50  
  51  #dashboard-widgets .postbox-header .hndle {
  52      padding: 12px 16px;
  53  }
  54  
  55  #dashboard-widgets .postbox .inside {
  56      margin-bottom: 0;
  57  }
  58  
  59  #dashboard-widgets .meta-box-sortables {
  60      display: flow-root; /* avoid margin collapsing between parent and first/last child elements */
  61      /* Required min-height to make the jQuery UI Sortable drop zone work. */
  62      min-height: 0;
  63      margin: 0 8px 20px;
  64  }
  65  
  66  #dashboard-widgets .meta-box-sortables:not(:empty) {
  67      margin-bottom: 16px;
  68  }
  69  
  70  #dashboard-widgets .postbox-container .empty-container {
  71      outline: 2px dashed rgba(0, 0, 0, 0.15);
  72      outline-offset: -2px;
  73      border-radius: 8px;
  74      height: 250px;
  75      margin: 4px;
  76  }
  77  
  78  /* Only highlight drop zones when dragging. */
  79  .is-dragging-metaboxes #dashboard-widgets .meta-box-sortables {
  80      border-radius: 8px;
  81      background: rgba(var(--wp-admin-theme-color--rgb), 0.04);
  82      min-height: 100px;
  83  }
  84  
  85  .is-dragging-metaboxes #dashboard-widgets .postbox-container .empty-container {
  86      background: rgba(0, 0, 0, 0.01);
  87  }
  88  
  89  #dashboard-widgets .postbox-container .empty-container::after {
  90      content: attr(data-emptystring);
  91      margin: auto;
  92      position: absolute;
  93      top: 50%;
  94      right: 0;
  95      left: 0;
  96      transform: translateY(-50%);
  97      padding: 0 2em;
  98      text-align: center;
  99      color: #646970;
 100      font-size: 16px;
 101      line-height: 1.5;
 102      display: none;
 103  }
 104  
 105  /* @todo: this was originally in this section, but likely belongs elsewhere */
 106  #the-comment-list td.comment p.comment-author {
 107      margin-top: 0;
 108      margin-right: 0;
 109  }
 110  
 111  #the-comment-list p.comment-author img {
 112      float: right;
 113      margin-left: 8px;
 114  }
 115  
 116  #the-comment-list p.comment-author strong a {
 117      border: none;
 118  }
 119  
 120  #the-comment-list td {
 121      vertical-align: top;
 122  }
 123  
 124  #the-comment-list td.comment {
 125      word-wrap: break-word;
 126  }
 127  
 128  #the-comment-list td.comment img {
 129      max-width: 100%;
 130  }
 131  
 132  /* Screen meta exception for when the "Dashboard" heading is missing or located below the Welcome Panel. */
 133  .index-php #screen-meta-links {
 134      margin: 0 0 8px 20px;
 135  }
 136  
 137  /* Welcome Panel */
 138  .welcome-panel {
 139      position: relative;
 140      overflow: auto;
 141      margin: 16px 0;
 142      border-radius: 8px;
 143      font-size: 14px;
 144      line-height: 1.3;
 145      clear: both;
 146  }
 147  
 148  .welcome-panel h2 {
 149      margin: 0;
 150      font-size: 48px;
 151      font-weight: 600;
 152      line-height: 1.25;
 153  }
 154  
 155  .welcome-panel h3 {
 156      margin: 0;
 157      font-size: 20px;
 158      font-weight: 400;
 159      line-height: 1.4;
 160  }
 161  
 162  .welcome-panel p {
 163      font-size: inherit;
 164      line-height: inherit;
 165  }
 166  
 167  .welcome-panel-header {
 168      box-sizing: border-box;
 169      margin-right: auto;
 170      margin-left: auto;
 171      max-width: 1500px;
 172      width: 100%;
 173      padding: 48px 48px 80px 0;
 174      position: relative;
 175      color: #fff;
 176  }
 177  
 178  .welcome-panel-header-image {
 179      position: absolute !important;
 180      top: 0;
 181      left: 0;
 182      bottom: 0;
 183      right: 0;
 184      z-index: 0 !important;
 185      overflow: hidden;
 186  }
 187  
 188  .welcome-panel-header-image svg {
 189      display: block;
 190      margin: auto;
 191      width: 100%;
 192      height: 100%;
 193  }
 194  
 195  .rtl .welcome-panel-header-image svg {
 196      transform: scaleX(-1);
 197  }
 198  
 199  .welcome-panel-header * {
 200      color: inherit;
 201      position: relative;
 202      z-index: 1;
 203  }
 204  
 205  .welcome-panel-header a:focus,
 206  .welcome-panel-header a:hover {
 207      color: inherit;
 208      text-decoration: none;
 209  }
 210  
 211  .welcome-panel-header a:focus,
 212  .welcome-panel .welcome-panel-close:focus {
 213      outline-color: currentColor;
 214      outline-offset: 1px;
 215      box-shadow: none;
 216  }
 217  
 218  .welcome-panel-header p {
 219      margin: 0.5em 0 0;
 220      font-size: 20px;
 221      line-height: 1.4;
 222  }
 223  
 224  .welcome-panel .welcome-panel-close {
 225      display: flex;
 226      align-items: center;
 227      position: absolute;
 228      top: 10px;
 229      left: 10px;
 230      padding: 10px 15px;
 231      font-size: 13px;
 232      line-height: 1.23076923; /* Chrome rounding, needs to be 16px equivalent */
 233      text-decoration: none;
 234      z-index: 1; /* Raise above the version image. */
 235      color: #fff;
 236  }
 237  
 238  .welcome-panel .welcome-panel-close::before {
 239      transition: all 0.1s ease-in-out;
 240      content: "\f335";
 241      font-size: 24px;
 242      color: #fff;
 243  }
 244  
 245  .welcome-panel .welcome-panel-close:hover,
 246  .welcome-panel .welcome-panel-close:focus,
 247  .welcome-panel .welcome-panel-close:hover::before,
 248  .welcome-panel .welcome-panel-close:focus::before {
 249      color: #fff972;
 250  }
 251  
 252  /* @deprecated 5.9.0 -- Button removed from panel. */
 253  .wp-core-ui .welcome-panel .button.button-hero {
 254      margin: 15px 0 3px 13px;
 255      padding: 12px 36px;
 256      height: auto;
 257      line-height: 1.4285714;
 258      white-space: normal;
 259  }
 260  
 261  .welcome-panel-content {
 262      min-height: 400px;
 263      display: flex;
 264      flex-direction: column;
 265      justify-content: space-between;
 266  }
 267  
 268  .welcome-panel-header-wrap {
 269      background-color: #151515;
 270  }
 271  
 272  .welcome-panel .welcome-panel-column-container {
 273      box-sizing: border-box;
 274      width: 100%;
 275      clear: both;
 276      display: grid;
 277      z-index: 1;
 278      padding: 24px;
 279      grid-template-columns: repeat(3, 1fr);
 280      gap: 32px;
 281      align-self: flex-end;
 282      background: #fff;
 283      border: 1px solid #c3c4c7;
 284      border-top: 0;
 285      border-radius: 0 0 8px 8px;
 286  }
 287  
 288  [class*="welcome-panel-icon"] {
 289      height: 60px;
 290      width: 60px;
 291      background-position: center;
 292      background-size: 24px 24px;
 293      background-repeat: no-repeat;
 294      border-radius: 100%;
 295  }
 296  
 297  .welcome-panel-column > svg {
 298      margin-top: 4px;
 299  }
 300  
 301  .welcome-panel-column {
 302      display: grid;
 303      grid-template-columns: min-content 1fr;
 304      gap: 24px;
 305  }
 306  
 307  .welcome-panel-icon-pages {
 308      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M7 13.8h6v-1.5H7v1.5zM18 16V4c0-1.1-.9-2-2-2H6c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h10c1.1 0 2-.9 2-2zM5.5 16V4c0-.3.2-.5.5-.5h10c.3 0 .5.2.5.5v12c0 .3-.2.5-.5.5H6c-.3 0-.5-.2-.5-.5zM7 10.5h8V9H7v1.5zm0-3.3h8V5.8H7v1.4zM20.2 6v13c0 .7-.6 1.2-1.2 1.2H8v1.5h11c1.5 0 2.7-1.2 2.7-2.8V6h-1.5z' /%3E%3C/svg%3E");
 309  }
 310  
 311  .welcome-panel-icon-layout {
 312      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M18 5.5H6a.5.5 0 00-.5.5v3h13V6a.5.5 0 00-.5-.5zm.5 5H10v8h8a.5.5 0 00.5-.5v-7.5zm-10 0h-3V18a.5.5 0 00.5.5h2.5v-8zM6 4h12a2 2 0 012 2v12a2 2 0 01-2 2H6a2 2 0 01-2-2V6a2 2 0 012-2z' /%3E%3C/svg%3E");
 313  }
 314  
 315  .welcome-panel-icon-styles {
 316      background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23fff' d='M12 4c-4.4 0-8 3.6-8 8v.1c0 4.1 3.2 7.5 7.2 7.9h.8c4.4 0 8-3.6 8-8s-3.6-8-8-8zm0 15V5c3.9 0 7 3.1 7 7s-3.1 7-7 7z' /%3E%3C/svg%3E");
 317  }
 318  
 319  /* @deprecated 5.9.0 -- Section removed from welcome panel. */
 320  .welcome-panel .welcome-widgets-menus {
 321      line-height: 1.14285714;
 322  }
 323  
 324  /* @deprecated 5.9.0 -- Lists removed from welcome panel. */
 325  .welcome-panel .welcome-panel-column ul {
 326      margin: 0.8em 0 1em 1em;
 327  }
 328  
 329  /* @deprecated 5.9.0 -- Lists removed from welcome panel. */
 330  .welcome-panel li {
 331      font-size: 14px;
 332  }
 333  
 334  /* @deprecated 5.9.0 -- Lists removed from welcome panel. */
 335  .welcome-panel li a {
 336      text-decoration: none;
 337  }
 338  
 339  /* @deprecated 5.9.0 -- Lists removed from welcome panel. */
 340  .welcome-panel .welcome-panel-column li {
 341      line-height: 1.14285714;
 342      list-style-type: none;
 343      padding: 0 0 8px;
 344  }
 345  
 346  /* @deprecated 5.9.0 -- Icons removed from welcome panel. */
 347  .welcome-panel .welcome-icon {
 348      background: transparent !important;
 349  }
 350  
 351  /* Welcome Panel and Right Now common Icons style */
 352  
 353  /* @deprecated 5.9.0 -- Icons removed from welcome panel. */
 354  .welcome-panel .welcome-icon::before,
 355  #dashboard_right_now li a::before,
 356  #dashboard_right_now li span::before {
 357      color: #646970;
 358      font: 400 20px/1 dashicons;
 359      display: inline-block;
 360      padding: 0 0 0 10px;
 361      position: relative;
 362      -webkit-font-smoothing: antialiased;
 363      -moz-osx-font-smoothing: grayscale;
 364      text-decoration: none !important;
 365      vertical-align: top;
 366  }
 367  
 368  /* Welcome Panel specific Icons styles */
 369  
 370  /* @deprecated 5.9.0 -- Icons removed from welcome panel. */
 371  .welcome-panel .welcome-write-blog::before,
 372  .welcome-panel .welcome-edit-page::before {
 373      content: "\f119";
 374      content: "\f119" / "";
 375      top: -3px;
 376  }
 377  
 378  /* @deprecated 5.9.0 -- Icons removed from welcome panel. */
 379  .welcome-panel .welcome-add-page::before {
 380      content: "\f132";
 381      content: "\f132" / "";
 382      top: -1px;
 383  }
 384  
 385  /* @deprecated 5.9.0 -- Icons removed from welcome panel. */
 386  .welcome-panel .welcome-setup-home::before {
 387      content: "\f102";
 388      content: "\f102" / "";
 389      top: -1px;
 390  }
 391  
 392  /* @deprecated 5.9.0 -- Icons removed from welcome panel. */
 393  .welcome-panel .welcome-view-site::before {
 394      content: "\f115";
 395      content: "\f115" / "";
 396      top: -2px;
 397  }
 398  
 399  /* @deprecated 5.9.0 -- Icons removed from welcome panel. */
 400  .welcome-panel .welcome-widgets-menus::before {
 401      content: "\f116";
 402      content: "\f116" / "";
 403      top: -2px;
 404  }
 405  
 406  /* @deprecated 5.9.0 -- Icons removed from welcome panel. */
 407  .welcome-panel .welcome-widgets::before {
 408      content: "\f538";
 409      content: "\f538" / "";
 410      top: -2px;
 411  }
 412  
 413  /* @deprecated 5.9.0 -- Icons removed from welcome panel. */
 414  .welcome-panel .welcome-menus::before {
 415      content: "\f163";
 416      content: "\f163" / "";
 417      top: -2px;
 418  }
 419  
 420  /* @deprecated 5.9.0 -- Icons removed from welcome panel. */
 421  .welcome-panel .welcome-comments::before {
 422      content: "\f117";
 423      content: "\f117" / "";
 424      top: -1px;
 425  }
 426  
 427  /* @deprecated 5.9.0 -- Icons removed from welcome panel. */
 428  .welcome-panel .welcome-learn-more::before {
 429      content: "\f118";
 430      content: "\f118" / "";
 431      top: -1px;
 432  }
 433  
 434  /* Right Now specific Icons styles */
 435  
 436  #dashboard_right_now li a::before,
 437  #dashboard_right_now li > span::before {
 438      padding: 0 0 0 5px;
 439      /*
 440       * Default icon for plugin-added items: a copy of the core `asterisk` icon.
 441       * Plugins can still override `content` with a Dashicon.
 442       */
 443      content: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2024%2024%22%20style%3D%22fill%3A%20none%22%20stroke%3D%22%23646970%22%20stroke-width%3D%221.5%22%3E%3Cpath%20d%3D%22M5.72131%2015.625L12%2012M12%2012L18.2787%208.375M12%2012V4.75M12%2012L12%2019.25M12%2012L5.72131%208.375M12%2012L18.2787%2015.625%22%20stroke-linecap%3D%22square%22%20%2F%3E%3C%2Fsvg%3E");
 444      content: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2024%2024%22%20style%3D%22fill%3A%20none%22%20stroke%3D%22%23646970%22%20stroke-width%3D%221.5%22%3E%3Cpath%20d%3D%22M5.72131%2015.625L12%2012M12%2012L18.2787%208.375M12%2012V4.75M12%2012L12%2019.25M12%2012L5.72131%208.375M12%2012L18.2787%2015.625%22%20stroke-linecap%3D%22square%22%20%2F%3E%3C%2Fsvg%3E") / "";
 445  }
 446  
 447  #dashboard_right_now li a:has(> svg)::before,
 448  #dashboard_right_now li > span:has(> svg)::before {
 449      display: none;
 450  }
 451  
 452  #dashboard_right_now li a:has(> svg),
 453  #dashboard_right_now li > span:has(> svg),
 454  #dashboard_right_now .search-engines-info a {
 455      display: inline-flex;
 456      align-items: flex-start;
 457      gap: 5px;
 458      /* Match the height of ::before icon rows so the floated list items don't snag. */
 459      vertical-align: top;
 460  }
 461  
 462  #dashboard_right_now li a > svg,
 463  #dashboard_right_now li > span > svg,
 464  #dashboard_right_now .search-engines-info svg {
 465      flex: none;
 466      color: #646970;
 467  }
 468  
 469  #dashboard_right_now .warning a > svg,
 470  #dashboard_right_now .search-engines-info svg {
 471      color: #d63638;
 472  }
 473  
 474  /* Dashboard WordPress events */
 475  
 476  .community-events-errors {
 477      margin: 0;
 478  }
 479  
 480  .community-events-loading {
 481      padding: 10px 12px 8px;
 482  }
 483  
 484  .community-events {
 485      margin-bottom: 6px;
 486      padding: 0 12px;
 487  }
 488  
 489  .community-events .spinner {
 490      margin: 0 2px 0;
 491  }
 492  
 493  .community-events-errors[aria-hidden="true"],
 494  .community-events-errors [aria-hidden="true"],
 495  .community-events-loading[aria-hidden="true"],
 496  .community-events[aria-hidden="true"],
 497  .community-events form[aria-hidden="true"] {
 498      display: none;
 499  }
 500  
 501  .community-events .activity-block:first-child,
 502  .community-events h2 {
 503      padding-top: 12px;
 504      padding-bottom: 10px;
 505  }
 506  
 507  .community-events-form {
 508      margin: 15px 0 5px;
 509      display: flex;
 510      gap: 5px;
 511      align-items: center;
 512      flex-wrap: wrap;
 513  }
 514  
 515  .community-events-form .regular-text {
 516      width: 40%;
 517      margin: 0;
 518      min-height: 32px;
 519      padding: 0 8px;
 520  }
 521  
 522  #dashboard-widgets .community-events-form .button {
 523      min-height: 32px;
 524      line-height: 2.30769231;
 525      padding: 0 12px;
 526  }
 527  
 528  .community-events li.event-none {
 529      border-right: 4px solid var(--wp-admin-theme-color, #3858e9);
 530  }
 531  
 532  #dashboard-widgets .community-events li.event-none a {
 533      text-decoration: underline;
 534  }
 535  
 536  .community-events-form label {
 537      line-height: 2.14285714;
 538  }
 539  
 540  .community-events .activity-block > p {
 541      margin-bottom: 0;
 542      display: inline;
 543  }
 544  
 545  .community-events-toggle-location {
 546      vertical-align: middle;
 547  }
 548  
 549  /* Needs higher specificity than #dashboard-widgets .button-link */
 550  #dashboard-widgets .community-events-cancel.button-link {
 551      text-decoration: underline;
 552  }
 553  
 554  .community-events ul {
 555      background-color: rgba(var(--wp-admin-theme-color--rgb), 0.08);
 556      padding-right: 0;
 557      padding-left: 0;
 558      padding-bottom: 0;
 559  }
 560  
 561  .community-events li {
 562      margin: 0;
 563      padding: 8px 12px;
 564      color: #2c3338;
 565  }
 566  
 567  .community-events li:first-child {
 568      border-top: 1px solid #e9e9ed;
 569  }
 570  
 571  .community-events li ~ li {
 572      border-top: 1px solid #e9e9ed;
 573  }
 574  
 575  .community-events .activity-block.last {
 576      border-bottom: 1px solid #e9e9ed;
 577      padding-top: 0;
 578      margin-top: -1px;
 579  }
 580  
 581  .community-events .event-info {
 582      display: block;
 583  }
 584  
 585  .community-events .ce-separator::before {
 586      content: "\2022";
 587      content: "\2022" / "";
 588  }
 589  
 590  .event-icon {
 591      height: 18px;
 592      padding-left: 10px;
 593      width: 18px;
 594      display: none; /* Hide on smaller screens */
 595  }
 596  
 597  .event-icon::before {
 598      color: #646970;
 599      font-size: 18px;
 600  }
 601  
 602  .event-meetup .event-icon::before {
 603      content: "\f484";
 604      content: "\f484" / "";
 605  }
 606  
 607  .event-wordcamp .event-icon::before {
 608      content: "\f486";
 609      content: "\f486" / "";
 610  }
 611  
 612  .community-events .event-title {
 613      font-weight: 600;
 614      display: block;
 615  }
 616  
 617  .community-events .event-date,
 618  .community-events .event-time {
 619      display: block;
 620  }
 621  
 622  .community-events-footer {
 623      margin-top: 0;
 624      margin-bottom: 0;
 625      padding: 12px;
 626      border-top: 1px solid #f0f0f1;
 627      color: #646970;
 628  }
 629  
 630  /* Safari 10 + VoiceOver specific: without this, the hidden text gets read out before the link. */
 631  .community-events-footer .screen-reader-text {
 632      height: inherit;
 633      white-space: nowrap;
 634  }
 635  
 636  /* Dashboard WordPress news */
 637  
 638  #dashboard_primary .inside {
 639      margin: 0;
 640      padding: 0;
 641  }
 642  
 643  #dashboard_primary .widget-loading {
 644      padding: 12px 12px 0;
 645      margin-bottom: 1em !important; /* Needs to override `.postbox .inside > p:last-child` in common.css */
 646  }
 647  
 648  /* Notice when JS is off. */
 649  #dashboard_primary .inside .notice {
 650      margin: 0;
 651  }
 652  
 653  body #dashboard-widgets .postbox form .submit {
 654      margin: 0;
 655  }
 656  
 657  /* Used only for configurable widgets. */
 658  .dashboard-widget-control-form p {
 659      margin-top: 0;
 660  }
 661  
 662  /* stylelint-disable-next-line selector-class-pattern -- The class rssSummary can't be changed because of backward compatibility reasons. */
 663  .rssSummary {
 664      color: #646970;
 665      margin-top: 4px;
 666  }
 667  
 668  #dashboard_primary .rss-widget {
 669      font-size: 13px;
 670      padding: 0 12px;
 671  }
 672  
 673  #dashboard_primary .rss-widget:last-child {
 674      border-bottom: none;
 675      padding-bottom: 8px;
 676  }
 677  
 678  #dashboard_primary .rss-widget a {
 679      font-weight: 400;
 680  }
 681  
 682  #dashboard_primary .rss-widget span,
 683  #dashboard_primary .rss-widget span.rss-date {
 684      color: #646970;
 685  }
 686  
 687  #dashboard_primary .rss-widget span.rss-date {
 688      margin-right: 12px;
 689  }
 690  
 691  #dashboard_primary .rss-widget ul li {
 692      padding: 4px 0;
 693      margin: 0;
 694  }
 695  
 696  /* Dashboard right now */
 697  
 698  #dashboard_right_now ul {
 699      margin: 0;
 700      /* contain floats but don't use overflow: hidden */
 701      display: inline-block;
 702      width: 100%;
 703  }
 704  
 705  #dashboard_right_now li {
 706      width: 50%;
 707      float: right;
 708      margin-bottom: 10px;
 709  }
 710  
 711  #dashboard_right_now .main p {
 712      margin: 0;
 713  }
 714  
 715  #dashboard_right_now #wp-version-message {
 716      display: flex;
 717      flex-wrap: wrap;
 718      align-items: center;
 719      gap: 8px;
 720  }
 721  
 722  #dashboard_right_now #wp-version {
 723      flex: 1;
 724  }
 725  
 726  #dashboard_right_now #wp-version-message .button {
 727      margin-right: auto;
 728  }
 729  
 730  #dashboard_right_now p.search-engines-info {
 731      margin: 1em 0;
 732  }
 733  
 734  .mu-storage {
 735      overflow: hidden;
 736  }
 737  
 738  #dashboard-widgets h3.mu-storage {
 739      margin: 0 0 10px;
 740      padding: 0;
 741      font-size: 14px;
 742      font-weight: 400;
 743  }
 744  
 745  #network_dashboard_right_now p input {
 746      margin: 2px 1px;
 747      vertical-align: middle;
 748  }
 749  
 750  /* Dashboard right now - Colors */
 751  
 752  #dashboard_right_now .sub {
 753      color: #50575e;
 754      background: #f6f7f7;
 755      border-top: 1px solid #f0f0f1;
 756      padding: 10px 12px 6px;
 757  }
 758  
 759  #dashboard_right_now .sub h3 {
 760      color: #50575e;
 761  }
 762  
 763  #dashboard_right_now .sub p {
 764      margin: 0 0 1em;
 765  }
 766  
 767  #dashboard_right_now .warning a::before,
 768  #dashboard_right_now .warning span::before {
 769      color: #d63638;
 770  }
 771  
 772  /* Dashboard Quick Draft */
 773  
 774  #dashboard_quick_press .inside {
 775      margin: 0;
 776      padding: 0;
 777  }
 778  
 779  #dashboard_quick_press form {
 780      margin: 12px;
 781  }
 782  
 783  #dashboard_quick_press .drafts,
 784  #dashboard_quick_press .no-drafts {
 785      padding: 10px 0 0;
 786  }
 787  
 788  /* Dashboard Quick Draft - Form styling */
 789  
 790  #dashboard_quick_press label {
 791      display: inline-block;
 792      margin-bottom: 4px;
 793  }
 794  
 795  #dashboard_quick_press input,
 796  #dashboard_quick_press textarea {
 797      margin: 0;
 798  }
 799  
 800  #description-wrap {
 801      margin-top: 12px;
 802  }
 803  
 804  #quick-press textarea#content {
 805      min-height: 90px;
 806      max-height: 1300px;
 807      margin: 0 0 8px;
 808      padding: 8px 12px;
 809      resize: none;
 810  }
 811  
 812  /* Dashboard Quick Draft - Drafts list */
 813  
 814  .js #dashboard_quick_press .drafts,
 815  .js #dashboard_quick_press .no-drafts {
 816      border-top: 1px solid #f0f0f1;
 817  }
 818  
 819  #dashboard_quick_press .drafts abbr {
 820      border: none;
 821  }
 822  
 823  #dashboard_quick_press .drafts .view-all {
 824      float: left;
 825      margin: 0 0 0 12px;
 826  }
 827  
 828  #dashboard_primary a.rsswidget {
 829      font-weight: 400;
 830  }
 831  
 832  #dashboard_quick_press .drafts ul {
 833      margin: 0 12px;
 834  }
 835  
 836  #dashboard_quick_press .drafts li {
 837      margin-bottom: 1em;
 838  }
 839  
 840  #dashboard_quick_press .drafts li time {
 841      color: #646970;
 842  }
 843  
 844  #dashboard_quick_press .drafts .draft-content {
 845      margin: 0;
 846      word-wrap: break-word;
 847  }
 848  
 849  #dashboard_quick_press .draft-title {
 850      word-wrap: break-word;
 851  }
 852  
 853  #dashboard_quick_press .draft-title a,
 854  #dashboard_quick_press .draft-title time {
 855      margin: 0 0 0 5px;
 856  }
 857  
 858  /* Dashboard common styles */
 859  
 860  #dashboard-widgets h4, /* Back-compat for pre-4.4 */
 861  #dashboard-widgets h3,
 862  #dashboard_quick_press .drafts h2,
 863  #dashboard_quick_press .no-drafts p {
 864      margin: 0 12px 8px;
 865      padding: 0;
 866      font-size: 14px;
 867      font-weight: 400;
 868      color: #1d2327;
 869  }
 870  
 871  #dashboard_quick_press .drafts h2 {
 872      line-height: inherit;
 873  }
 874  
 875  #dashboard-widgets .inside h4, /* Back-compat for pre-4.4 */
 876  #dashboard-widgets .inside h3 {
 877      margin-right: 0;
 878      margin-left: 0;
 879  }
 880  
 881  /* Dashboard activity widget */
 882  
 883  #dashboard_recent_comments .comment-meta span.approve::before {
 884      content: "\f227";
 885      content: "\f227" / "";
 886      font: 20px/0.5 dashicons;
 887      margin-right: 5px;
 888      vertical-align: middle;
 889      position: relative;
 890      top: -1px;
 891      margin-left: 2px;
 892  }
 893  
 894  #dashboard_activity .inside,
 895  #dashboard_recent_comments .inside {
 896      margin: 0;
 897      padding: 0 12px;
 898  }
 899  
 900  #dashboard_activity .no-activity {
 901      overflow: hidden;
 902      padding: 12px 0;
 903      text-align: center;
 904  }
 905  
 906  #dashboard_activity .no-activity p {
 907      color: #646970;
 908      font-size: 16px;
 909  }
 910  
 911  #dashboard_recent_comments .subsubsub {
 912      float: none;
 913      border-top: 1px solid #f0f0f1;
 914      margin: 0 -12px;
 915      padding: 8px 12px 4px;
 916  }
 917  
 918  #dashboard_recent_comments .subsubsub a .count,
 919  #dashboard_recent_comments .subsubsub a.current .count {
 920      color: #646970; /* white background on the dashboard but #f0f0f1 on list tables */
 921  }
 922  
 923  #future-posts ul,
 924  #published-posts ul,
 925  #on-this-day-posts ul {
 926      margin: 8px -12px 0 -12px;
 927  }
 928  
 929  #future-posts li,
 930  #published-posts li,
 931  #on-this-day-posts li {
 932      display: grid;
 933      grid-template-columns: clamp(160px, calc(2vw + 140px), 200px) auto;
 934      column-gap: 10px;
 935      color: #646970;
 936      padding: 4px 12px;
 937  }
 938  
 939  #future-posts li:nth-child(odd),
 940  #published-posts li:nth-child(odd),
 941  #on-this-day-posts li:nth-child(odd) {
 942      background-color: #f6f7f7;
 943  }
 944  
 945  #on-this-day-posts .wp-on-this-day-post-author {
 946      color: #646970;
 947  }
 948  
 949  .activity-block {
 950      border-bottom: 1px solid #f0f0f1;
 951      margin: 0 -12px 6px -12px;
 952      padding: 8px 12px 4px;
 953  }
 954  
 955  .activity-block:last-child {
 956      border-bottom: none;
 957      margin-bottom: 0;
 958  }
 959  
 960  .activity-block .subsubsub li {
 961      color: #646970;
 962  }
 963  
 964  /* Dashboard activity widget - Comments */
 965  /* @todo: needs serious de-duplication */
 966  
 967  #dashboard_recent_comments #the-comment-list tr.undo,
 968  #dashboard_recent_comments #the-comment-list div.undo {
 969      background: none;
 970      padding: 6px 0;
 971      margin-right: 12px;
 972  }
 973  
 974  #dashboard_recent_comments #the-comment-list .comment-item {
 975      background: #f6f7f7;
 976      padding: 12px;
 977      position: relative;
 978  }
 979  
 980  #dashboard_recent_comments #the-comment-list .avatar {
 981      position: absolute;
 982      top: 12px;
 983  }
 984  
 985  #dashboard_recent_comments #the-comment-list .dashboard-comment-wrap.has-avatar {
 986      padding-right: 63px;
 987  }
 988  
 989  #dashboard_recent_comments #the-comment-list .dashboard-comment-wrap blockquote {
 990      margin: 1em 0;
 991  }
 992  
 993  #dashboard_recent_comments #the-comment-list .comment-item p.row-actions {
 994      margin: 4px 0 0;
 995  }
 996  
 997  #dashboard_recent_comments #the-comment-list .comment-item:first-child {
 998      border-top: 1px solid #f0f0f1;
 999  }
1000  
1001  #dashboard_recent_comments #the-comment-list .unapproved {
1002      background-color: #fcf9e8;
1003  }
1004  
1005  #dashboard_recent_comments #the-comment-list .unapproved::before {
1006      content: "";
1007      display: block;
1008      position: absolute;
1009      right: 0;
1010      top: 0;
1011      bottom: 0;
1012      background: #d63638;
1013      width: 4px;
1014  }
1015  
1016  #dashboard_recent_comments #the-comment-list .spam-undo-inside .avatar,
1017  #dashboard_recent_comments #the-comment-list .trash-undo-inside .avatar {
1018      position: relative;
1019      top: 0;
1020  }
1021  
1022  /* Browse happy box */
1023  
1024  #dashboard-widgets #dashboard_browser_nag.postbox .inside {
1025      margin: 10px;
1026  }
1027  
1028  .postbox .button-link .edit-box {
1029      display: none;
1030  }
1031  
1032  .edit-box {
1033      opacity: 0;
1034  }
1035  
1036  .hndle:hover .edit-box,
1037  .edit-box:focus {
1038      opacity: 1;
1039  }
1040  
1041  #dashboard-widgets form .input-text-wrap input {
1042      width: 100%;
1043  }
1044  
1045  #dashboard-widgets form .textarea-wrap textarea {
1046      width: 100%;
1047  }
1048  
1049  #dashboard-widgets .postbox form .submit {
1050      float: none;
1051      margin: 0.5em 0 0;
1052      padding: 0;
1053      border: none;
1054  }
1055  
1056  #dashboard-widgets-wrap #dashboard-widgets .postbox form .submit #publish {
1057      min-width: 0;
1058  }
1059  
1060  #dashboard-widgets li:not(.activity-block li):not(.comment) a,
1061  #dashboard-widgets .button-link,
1062  .community-events-footer a {
1063      text-decoration: none;
1064  }
1065  
1066  #dashboard-widgets h2 a {
1067      text-decoration: underline;
1068  }
1069  
1070  #dashboard-widgets .hndle .postbox-title-action {
1071      float: left;
1072      line-height: 1.2;
1073  }
1074  
1075  #dashboard_plugins h5 {
1076      font-size: 14px;
1077  }
1078  
1079  /* Recent Comments */
1080  
1081  #latest-comments #the-comment-list {
1082      position: relative;
1083      margin: 0 -12px;
1084  }
1085  
1086  #activity-widget #the-comment-list .comment,
1087  #activity-widget #the-comment-list .pingback {
1088      box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.06);
1089  }
1090  
1091  #activity-widget .comments #the-comment-list .alt {
1092      background-color: transparent;
1093  }
1094  
1095  #activity-widget #latest-comments #the-comment-list .comment-item {
1096      /* the row-actions paragraph is output only for users with 'edit_comment' capabilities,
1097         for other users this needs a min height equal to the gravatar image */
1098      min-height: 50px;
1099      margin: 0;
1100      padding: 12px;
1101  }
1102  
1103  #latest-comments #the-comment-list .pingback {
1104      padding-right: 12px !important;
1105  }
1106  
1107  #latest-comments #the-comment-list .comment-item:first-child {
1108      border-top: none;
1109  }
1110  
1111  #latest-comments #the-comment-list .comment-meta {
1112      line-height: 1.5;
1113      margin: 0;
1114      color: #646970;
1115  }
1116  
1117  #latest-comments #the-comment-list .comment-meta cite {
1118      font-style: normal;
1119      font-weight: 400;
1120  }
1121  
1122  #latest-comments #the-comment-list .comment-item blockquote,
1123  #latest-comments #the-comment-list .comment-item blockquote p {
1124      margin: 0;
1125      padding: 0;
1126      display: inline;
1127  }
1128  
1129  #latest-comments #the-comment-list .comment-item p.row-actions {
1130      margin: 3px 0 0;
1131      padding: 0;
1132      font-size: 13px;
1133  }
1134  
1135  /* Feeds */
1136  .rss-widget ul {
1137      margin: 0;
1138      padding: 0;
1139      list-style: none;
1140  }
1141  
1142  a.rsswidget {
1143      font-size: 13px;
1144      font-weight: 600;
1145      line-height: 1.4;
1146  }
1147  
1148  .rss-widget ul li {
1149      line-height: 1.5;
1150      margin-bottom: 12px;
1151  }
1152  
1153  .rss-widget span.rss-date {
1154      color: #646970;
1155      font-size: 13px;
1156      margin-right: 3px;
1157  }
1158  
1159  .rss-widget cite {
1160      display: block;
1161      text-align: left;
1162      margin: 0 0 1em;
1163      padding: 0;
1164  }
1165  
1166  .rss-widget cite::before {
1167      content: "\2014";
1168      content: "\2014" / "";
1169  }
1170  
1171  .dashboard-comment-wrap {
1172      word-wrap: break-word;
1173  }
1174  
1175  /* Browser Nag */
1176  #dashboard_browser_nag a.update-browser-link {
1177      font-size: 1.2em;
1178      font-weight: 600;
1179  }
1180  
1181  #dashboard_browser_nag a {
1182      text-decoration: underline;
1183      color: #fff;
1184  }
1185  
1186  #dashboard_browser_nag p.browser-update-nag.has-browser-icon {
1187      padding-left: 128px;
1188  }
1189  
1190  #dashboard_browser_nag .browser-icon {
1191      margin-top: -32px;
1192  }
1193  
1194  #dashboard_browser_nag.postbox {
1195      background-color: #b32d2e;
1196      background-image: none;
1197      border-color: #b32d2e;
1198      color: #fff;
1199      box-shadow: none;
1200  }
1201  
1202  #dashboard_browser_nag.postbox h2 {
1203      border-bottom-color: transparent;
1204      background: transparent none;
1205      color: #fff;
1206      box-shadow: none;
1207  }
1208  
1209  #dashboard_browser_nag.postbox .postbox-header {
1210      border-color: transparent;
1211  }
1212  
1213  #dashboard_browser_nag h2.hndle {
1214      border: none;
1215      font-weight: 600;
1216      font-size: 20px;
1217      padding-top: 10px;
1218  }
1219  
1220  .postbox#dashboard_browser_nag p a.dismiss {
1221      font-size: 14px;
1222  }
1223  
1224  .postbox#dashboard_browser_nag p,
1225  .postbox#dashboard_browser_nag a,
1226  .postbox#dashboard_browser_nag p.browser-update-nag {
1227      font-size: 16px;
1228  }
1229  
1230  /* PHP Nag */
1231  #dashboard_php_nag .dashicons-warning {
1232      color: #dba617;
1233      padding-left: 6px;
1234  }
1235  
1236  #dashboard_php_nag.php-no-security-updates .dashicons-warning,
1237  #dashboard_php_nag.php-version-lower-than-future-minimum .dashicons-warning {
1238      color: #d63638;
1239  }
1240  
1241  #dashboard_php_nag h2 {
1242      display: inline-block;
1243  }
1244  
1245  #dashboard_php_nag p {
1246      margin: 12px 0;
1247  }
1248  
1249  .bigger-bolder-text {
1250      font-weight: 600;
1251      font-size: 14px;
1252  }
1253  
1254  /* =Media Queries
1255  -------------------------------------------------------------- */
1256  
1257  @media only screen and (min-width: 1600px) {
1258      .welcome-panel .welcome-panel-column-container {
1259          display: flex;
1260          justify-content: center;
1261      }
1262  
1263      .welcome-panel-column {
1264          width: 100%;
1265          max-width: 460px;
1266      }
1267  }
1268  
1269  /* one column on the dash */
1270  @media only screen and (max-width: 799px) {
1271      #wpbody-content #dashboard-widgets .postbox-container {
1272          width: 100%;
1273      }
1274  
1275      #dashboard-widgets .meta-box-sortables {
1276          min-height: 0;
1277      }
1278  
1279      .is-dragging-metaboxes #dashboard-widgets .meta-box-sortables {
1280          min-height: 100px;
1281      }
1282  
1283      #dashboard-widgets .meta-box-sortables.empty-container {
1284          margin-bottom: 0;
1285      }
1286  }
1287  
1288  /* two columns on the dash, but keep the setting if one is selected */
1289  @media only screen and (min-width: 800px) and (max-width: 1499px) {
1290      #wpbody-content #dashboard-widgets .postbox-container {
1291          width: 49.5%;
1292      }
1293  
1294      #wpbody-content #dashboard-widgets #postbox-container-2,
1295      #wpbody-content #dashboard-widgets #postbox-container-3,
1296      #wpbody-content #dashboard-widgets #postbox-container-4 {
1297          float: left;
1298          width: 50.5%;
1299      }
1300  
1301      #dashboard-widgets #postbox-container-3 .empty-container,
1302      #dashboard-widgets #postbox-container-4 .empty-container {
1303          border: none;
1304          height: 0;
1305          min-height: 0;
1306          margin-bottom: 0;
1307          display: none;
1308      }
1309  
1310      #dashboard-widgets #postbox-container-3 .empty-container::after,
1311      #dashboard-widgets #postbox-container-4 .empty-container::after {
1312          display: none;
1313      }
1314  
1315      #wpbody #wpbody-content #dashboard-widgets.columns-1 .postbox-container {
1316          width: 100%;
1317      }
1318  
1319      #wpbody #dashboard-widgets .metabox-holder.columns-1 .postbox-container .empty-container {
1320          border: none;
1321          height: 0;
1322          min-height: 0;
1323          margin-bottom: 0;
1324      }
1325  
1326      /* show the radio buttons for column prefs only for one or two columns */
1327      .index-php .screen-layout,
1328      .index-php .columns-prefs {
1329          display: block;
1330      }
1331  
1332      .columns-prefs .columns-prefs-3,
1333      .columns-prefs .columns-prefs-4 {
1334          display: none;
1335      }
1336  
1337      #dashboard-widgets .postbox-container .empty-container::after {
1338          display: block;
1339      }
1340  }
1341  
1342  /* three columns on the dash */
1343  @media only screen and (min-width: 1500px) and (max-width: 1800px) {
1344      #wpbody-content #dashboard-widgets .postbox-container {
1345          width: 33.5%;
1346      }
1347  
1348      #wpbody-content #dashboard-widgets #postbox-container-1 {
1349          width: 33%;
1350      }
1351  
1352      #wpbody-content #dashboard-widgets #postbox-container-3,
1353      #wpbody-content #dashboard-widgets #postbox-container-4 {
1354          float: left;
1355      }
1356  
1357      #dashboard-widgets #postbox-container-4 .empty-container {
1358          border: none;
1359          height: 0;
1360          min-height: 0;
1361          margin-bottom: 0;
1362          display: none;
1363      }
1364  
1365      #dashboard-widgets #postbox-container-4 .empty-container::after {
1366          display: none;
1367      }
1368  
1369      #dashboard-widgets .postbox-container .empty-container::after {
1370          display: block;
1371      }
1372  }
1373  
1374  /* Always show the "Drag boxes here" CSS generated content on large screens. */
1375  @media only screen and (min-width: 1801px) {
1376      #dashboard-widgets .postbox-container .empty-container::after {
1377          display: block;
1378      }
1379  }
1380  
1381  .js.meta-box-reordering-disabled #dashboard-widgets .postbox-container .empty-container {
1382      display: none;
1383  }
1384  
1385  @media screen and (max-width: 870px) {
1386      /* @deprecated 5.9.0 -- Lists removed from welcome panel. */
1387      .welcome-panel .welcome-panel-column li {
1388          display: inline-block;
1389          margin-left: 13px;
1390      }
1391  
1392      /* @deprecated 5.9.0 -- Lists removed from welcome panel. */
1393      .welcome-panel .welcome-panel-column ul {
1394          margin: 0.4em 0 0;
1395      }
1396  
1397  }
1398  
1399  @media screen and (max-width: 1180px) and (min-width: 783px) {
1400      .welcome-panel-column {
1401          grid-template-columns: 1fr;
1402      }
1403  
1404      [class*="welcome-panel-icon"],
1405      .welcome-panel-column > svg {
1406          display: none;
1407      }
1408  }
1409  
1410  @media screen and (max-width: 782px) {
1411      .welcome-panel .welcome-panel-column-container {
1412          grid-template-columns: 1fr;
1413          box-sizing: border-box;
1414          padding: 32px;
1415          width: 100%;
1416      }
1417  
1418      .welcome-panel .welcome-panel-column-content {
1419          max-width: 520px;
1420      }
1421  
1422      /* Keep the close icon from overlapping the Welcome text. */
1423      .welcome-panel .welcome-panel-close {
1424          overflow: hidden;
1425          text-indent: 40px;
1426          white-space: nowrap;
1427          width: 20px;
1428          height: 20px;
1429          padding: 5px;
1430          top: 5px;
1431          left: 5px;
1432      }
1433  
1434      .welcome-panel .welcome-panel-close::before {
1435          position: absolute;
1436          top: 5px;
1437          right: -35px;
1438      }
1439  
1440      #dashboard-widgets h2 {
1441          padding: 12px;
1442      }
1443  
1444      #dashboard_recent_comments #the-comment-list .comment-item .avatar {
1445          height: 30px;
1446          width: 30px;
1447          margin: 4px 0 5px 10px;
1448      }
1449  
1450      .community-events-toggle-location {
1451          height: 38px;
1452          vertical-align: baseline;
1453      }
1454  
1455      #community-events-submit {
1456          margin-bottom: 0;
1457      }
1458  
1459      .community-events-form label,
1460      #dashboard-widgets .community-events-cancel.button-link {
1461          /* Same properties as the submit button for cross-browsers alignment. */
1462          font-size: 14px;
1463          line-height: normal;
1464          padding: 6px 0;
1465          border: 1px solid transparent;
1466      }
1467  }
1468  
1469  /* Smartphone */
1470  @media screen and (max-width: 600px) {
1471      .welcome-panel-header {
1472          padding: 32px 32px 64px;
1473      }
1474  
1475      .welcome-panel-header-image {
1476          display: none;
1477      }
1478  }
1479  
1480  @media screen and (max-width: 480px) {
1481      .welcome-panel-column {
1482          gap: 16px;
1483      }
1484  }
1485  
1486  @media screen and (max-width: 360px) {
1487      .welcome-panel-column {
1488          grid-template-columns: 1fr;
1489      }
1490  
1491      [class*="welcome-panel-icon"],
1492      .welcome-panel-column > svg {
1493          display: none;
1494      }
1495  }
1496  
1497  @media screen and (min-width: 355px) {
1498      .community-events .event-info {
1499          display: table-row;
1500          float: right;
1501          max-width: 59%;
1502      }
1503  
1504      .event-icon,
1505      .event-icon[aria-hidden="true"] {
1506          display: table-cell;
1507      }
1508  
1509      .event-info-inner {
1510          display: table-cell;
1511      }
1512  
1513      .community-events .event-date-time {
1514          float: left;
1515          max-width: 39%;
1516      }
1517  
1518      .community-events .event-date,
1519      .community-events .event-time {
1520          text-align: left;
1521      }
1522  }