[Summary view] [Print] [Text view]

   1  .revisions-control-frame,
   2  .revisions-diff-frame {
   3      position: relative;
   4  }
   5  
   6  .revisions-diff-frame {
   7      top: 10px;
   8  }
   9  
  10  .revisions-controls {
  11      padding-top: 40px;
  12      z-index: 1;
  13  }
  14  
  15  .revisions-controls input[type="checkbox"] {
  16      position: relative;
  17      top: -1px;
  18      vertical-align: text-bottom;
  19  }
  20  
  21  .revisions.pinned .revisions-controls {
  22      position: fixed;
  23      top: 0;
  24      height: 82px;
  25      background: #fff;
  26      box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  27  }
  28  
  29  .revisions-tickmarks {
  30      position: relative;
  31      margin: 0 auto;
  32      height: 0.7em;
  33      top: 7px;
  34      max-width: 70%;
  35      box-sizing: border-box;
  36      background-color: #fff;
  37  }
  38  
  39  .revisions-tickmarks > div {
  40      position: absolute;
  41      height: 100%;
  42      border-left: 1px solid #a7aaad;
  43      box-sizing: border-box;
  44  }
  45  
  46  .revisions-tickmarks > div:first-child {
  47      border-width: 0;
  48  }
  49  
  50  .comparing-two-revisions .revisions-controls {
  51      height: 140px;
  52  }
  53  
  54  .comparing-two-revisions.pinned .revisions-controls {
  55      height: 124px;
  56  }
  57  
  58  .revisions .diff-error {
  59      position: absolute;
  60      text-align: center;
  61      margin: 0 auto;
  62      width: 100%;
  63      display: none;
  64  }
  65  
  66  .revisions.diff-error .diff-error {
  67      display: block;
  68  }
  69  
  70  .revisions .loading-indicator {
  71      position: absolute;
  72      vertical-align: middle;
  73      opacity: 0;
  74      width: 100%;
  75      width: calc(100% - 30px);
  76      top: 50%;
  77      top: calc(50% - 10px);
  78      transition: opacity 0.5s;
  79  }
  80  
  81  body.folded .revisions .loading-indicator {
  82      margin-left: -32px;
  83  }
  84  
  85  .revisions .loading-indicator span.spinner {
  86      display: block;
  87      margin: 0 auto;
  88      float: none;
  89  }
  90  
  91  .revisions.loading .loading-indicator {
  92      opacity: 1;
  93  }
  94  
  95  .revisions .diff {
  96      transition: opacity 0.5s;
  97  }
  98  
  99  .revisions.loading .diff {
 100      opacity: 0.5;
 101  }
 102  
 103  .revisions.diff-error .diff {
 104      visibility: hidden;
 105  }
 106  
 107  .revisions-meta {
 108      margin-top: 20px;
 109      background-color: #fff;
 110      box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
 111      overflow: hidden;
 112  }
 113  
 114  .revisions.pinned .revisions-meta {
 115      box-shadow: none;
 116  }
 117  
 118  .revision-toggle-compare-mode {
 119      position: absolute;
 120      top: 0;
 121      right: 0;
 122  }
 123  
 124  .comparing-two-revisions .revisions-previous,
 125  .comparing-two-revisions .revisions-next,
 126  .revisions-meta .diff-meta-to strong {
 127      display: none;
 128  }
 129  
 130  .revisions-controls .author-card .date {
 131      color: #646970;
 132  }
 133  
 134  .revisions-controls .author-card.autosave {
 135      color: #d63638;
 136  }
 137  
 138  .revisions-controls .author-card .author-name {
 139      font-weight: 600;
 140  }
 141  
 142  .comparing-two-revisions .diff-meta-to strong {
 143      display: block;
 144  }
 145  
 146  .revisions.pinned .revisions-buttons {
 147      padding: 0 11px;
 148  }
 149  
 150  .revisions-previous,
 151  .revisions-next {
 152      position: relative;
 153      z-index: 1;
 154  }
 155  
 156  .revisions-previous {
 157      float: left;
 158  }
 159  
 160  .revisions-next {
 161      float: right;
 162  }
 163  
 164  .revisions-controls .wp-slider {
 165      max-width: 70%;
 166      margin: 0 auto;
 167      top: -3px;
 168  }
 169  
 170  .revisions-diff {
 171      padding: 15px;
 172      background-color: #fff;
 173      box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
 174  }
 175  
 176  .revisions-diff h3:first-child {
 177      margin-top: 0;
 178  }
 179  
 180  /* Revision meta box */
 181  .post-revisions li img,
 182  #revisions-meta-restored img {
 183      vertical-align: middle;
 184  }
 185  
 186  table.diff {
 187      table-layout: fixed;
 188      width: 100%;
 189      white-space: pre-wrap;
 190  }
 191  
 192  table.diff col.content {
 193      width: auto;
 194  }
 195  
 196  table.diff col.content.diffsplit {
 197      width: 48%;
 198  }
 199  
 200  table.diff col.diffsplit.middle {
 201      width: auto;
 202  }
 203  
 204  table.diff col.ltype {
 205      width: 30px;
 206  }
 207  
 208  table.diff tr {
 209      background-color: transparent;
 210  }
 211  
 212  table.diff td,
 213  table.diff th {
 214      font-family: Consolas, Monaco, monospace;
 215      font-size: 14px;
 216      line-height: 1.57142857;
 217      padding: 0.5em 0.5em 0.5em 2em;
 218      vertical-align: top;
 219      word-wrap: break-word;
 220  }
 221  
 222  table.diff td h1,
 223  table.diff td h2,
 224  table.diff td h3,
 225  table.diff td h4,
 226  table.diff td h5,
 227  table.diff td h6 {
 228      margin: 0;
 229  }
 230  
 231  table.diff .diff-deletedline del,
 232  table.diff .diff-addedline ins {
 233      text-decoration: none;
 234  }
 235  
 236  table.diff .diff-deletedline {
 237      position: relative;
 238      background-color: #fcf0f1;
 239  }
 240  
 241  table.diff .diff-deletedline del {
 242      background-color: #ffabaf;
 243  }
 244  
 245  table.diff .diff-addedline {
 246      position: relative;
 247      background-color: #edfaef;
 248  }
 249  
 250  table.diff .diff-deletedline .dashicons,
 251  table.diff .diff-addedline .dashicons {
 252      position: absolute;
 253      top: 0.85714286em;
 254      left: 0.5em;
 255      width: 1em;
 256      height: 1em;
 257      font-size: 1em;
 258      line-height: 1;
 259  }
 260  
 261  table.diff .diff-addedline .dashicons {
 262      /* Compensate the vertically non-centered plus glyph. */
 263      top: 0.92857143em;
 264  }
 265  
 266  table.diff .diff-addedline ins {
 267      background-color: #68de7c;
 268  }
 269  
 270  .diff-meta {
 271      padding: 5px;
 272      clear: both;
 273      min-height: 32px;
 274  }
 275  
 276  .diff-title strong {
 277      line-height: 2.46153846;
 278      min-width: 60px;
 279      text-align: right;
 280      float: left;
 281      margin-right: 5px;
 282  }
 283  
 284  .revisions-controls .author-card .author-info {
 285      font-size: 12px;
 286      line-height: 1.33333333;
 287  }
 288  
 289  .revisions-controls .author-card .avatar,
 290  .revisions-controls .author-card .author-info {
 291      float: left;
 292      margin-left: 6px;
 293      margin-right: 6px;
 294  }
 295  
 296  .revisions-controls .author-card .byline {
 297      display: block;
 298      font-size: 12px;
 299  }
 300  
 301  .revisions-controls .author-card .avatar {
 302      vertical-align: middle;
 303  }
 304  
 305  .diff-meta input.restore-revision {
 306      float: right;
 307      margin-left: 6px;
 308      margin-right: 6px;
 309  }
 310  
 311  .diff-meta-from {
 312      display: none;
 313  }
 314  
 315  .comparing-two-revisions .diff-meta-from {
 316      display: block;
 317  }
 318  
 319  .revisions-tooltip {
 320      position: absolute;
 321      bottom: 105px;
 322      margin-right: 0;
 323      margin-left: -69px;
 324      z-index: 0;
 325      max-width: 350px;
 326      min-width: 130px;
 327      padding: 8px 4px;
 328      display: none;
 329      opacity: 0;
 330  }
 331  
 332  .revisions-tooltip.flipped {
 333      margin-left: 0;
 334      margin-right: -70px;
 335  }
 336  
 337  .revisions.pinned .revisions-tooltip {
 338      display: none !important;
 339  }
 340  
 341  .comparing-two-revisions .revisions-tooltip {
 342      bottom: 145px;
 343  }
 344  
 345  .revisions-tooltip-arrow {
 346      width: 70px;
 347      height: 15px;
 348      overflow: hidden;
 349      position: absolute;
 350      left: 0;
 351      margin-left: 35px;
 352      bottom: -15px;
 353  }
 354  
 355  .revisions-tooltip.flipped .revisions-tooltip-arrow {
 356      margin-left: 0;
 357      margin-right: 35px;
 358      left: auto;
 359      right: 0;
 360  }
 361  
 362  .revisions-tooltip-arrow > span {
 363      content: "";
 364      position: absolute;
 365      left: 20px;
 366      top: -20px;
 367      width: 25px;
 368      height: 25px;
 369      transform: rotate(45deg);
 370  }
 371  
 372  .revisions-tooltip.flipped .revisions-tooltip-arrow > span {
 373      left: auto;
 374      right: 20px;
 375  }
 376  
 377  .revisions-tooltip,
 378  .revisions-tooltip-arrow > span {
 379      border: 1px solid #dcdcde;
 380      background-color: #fff;
 381  }
 382  
 383  .arrow {
 384      width: 70px;
 385      height: 16px;
 386      overflow: hidden;
 387      position: absolute;
 388      left: 0;
 389      margin-left: -35px;
 390      bottom: 90px;
 391      z-index: 10000;
 392  }
 393  
 394  .arrow::after {
 395      content: "";
 396      position: absolute;
 397      left: 20px;
 398      top: -20px;
 399      width: 25px;
 400      height: 25px;
 401      transform: rotate(45deg);
 402      z-index: 9999;
 403      background-color: #fff;
 404      box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
 405  }
 406  
 407  .arrow.top {
 408      top: -16px;
 409      bottom: auto;
 410  }
 411  
 412  .arrow.left {
 413      left: 20%;
 414  }
 415  
 416  .revisions-tooltip,
 417  .revisions-tooltip-arrow::after {
 418      border-width: 1px;
 419      border-style: solid;
 420  }
 421  
 422  div.revisions-controls > .wp-slider > .ui-slider-handle {
 423      margin-left: -10px;
 424  }
 425  
 426  .rtl div.revisions-controls > .wp-slider > .ui-slider-handle {
 427      margin-right: -10px;
 428  }
 429  
 430  /* jQuery UI Slider */
 431  .wp-slider.ui-slider {
 432      position: relative;
 433      border: 1px solid #dcdcde;
 434      text-align: left;
 435      cursor: pointer;
 436  }
 437  
 438  .wp-slider .ui-slider-handle {
 439      border-radius: 50%;
 440      height: 18px;
 441      margin-top: -5px;
 442      outline: none;
 443      padding: 2px;
 444      position: absolute;
 445      width: 18px;
 446      z-index: 2;
 447      touch-action: none;
 448      background: #f6f7f7;
 449      border: 1px solid #c3c4c7;
 450      box-shadow: 0 1px 0 #c3c4c7;
 451  }
 452  
 453  .wp-slider .ui-slider-handle:hover,
 454  .wp-slider .ui-slider-handle.ui-state-hover {
 455      background: #f6f7f7;
 456      border-color: #8c8f94;
 457  }
 458  
 459  .wp-slider .ui-slider-handle:active,
 460  .wp-slider .ui-slider-handle.ui-state-active {
 461      background: #f0f0f1;
 462      border-color: #8c8f94;
 463      box-shadow: inset 0 2px 5px -3px rgba(0, 0, 0, 0.5);
 464      transform: translateY(1px);
 465  }
 466  
 467  .wp-slider .ui-slider-handle:focus,
 468  .wp-slider .ui-slider-handle.ui-state-focus {
 469      background: #f0f0f1;
 470      border-color: #8c8f94;
 471      box-shadow: 0 0 0 var(--wp-admin-border-width-focus, 1.5px) var(--wp-admin-theme-color, #3858e9);
 472      /* Only visible in Windows High Contrast mode */
 473      outline: 2px solid transparent;
 474  }
 475  
 476  .wp-slider .ui-slider-handle::before {
 477      background: none;
 478      position: absolute;
 479      top: 2px;
 480      left: 2px;
 481      color: #50575e;
 482      content: "\f229";
 483      content: "\f229" / "";
 484      font: 400 18px/1 dashicons;
 485      -webkit-font-smoothing: antialiased;
 486      -moz-osx-font-smoothing: grayscale;
 487  }
 488  
 489  .wp-slider .ui-slider-handle:hover::before,
 490  .wp-slider .ui-slider-handle.ui-state-hover::before {
 491      color: #1d2327;
 492  }
 493  
 494  .wp-slider .ui-slider-handle.from-handle::before,
 495  .wp-slider .ui-slider-handle.to-handle::before {
 496      font-size: 20px !important;
 497      margin: -1px 0 0 -1px;
 498  }
 499  
 500  .wp-slider .ui-slider-handle.from-handle::before {
 501      content: "\f139";
 502      content: "\f139" / "";
 503  }
 504  
 505  .wp-slider .ui-slider-handle.to-handle::before {
 506      content: "\f141";
 507      content: "\f141" / "";
 508  }
 509  
 510  .rtl .wp-slider .ui-slider-handle.from-handle::before {
 511      content: "\f141";
 512      content: "\f141" / "";
 513  }
 514  
 515  .rtl .wp-slider .ui-slider-handle.to-handle::before {
 516      content: "\f139";
 517      content: "\f139" / "";
 518      right: -1px;
 519  }
 520  
 521  .wp-slider .ui-slider-range {
 522      position: absolute;
 523      font-size: 0.7em;
 524      display: block;
 525      border: 0;
 526      background-color: transparent;
 527      background-image: none;
 528  }
 529  
 530  .wp-slider.ui-slider-horizontal {
 531      height: 0.7em;
 532  }
 533  
 534  .wp-slider.ui-slider-horizontal .ui-slider-handle {
 535      top: -0.25em;
 536      margin-left: -0.6em;
 537  }
 538  
 539  .wp-slider.ui-slider-horizontal .ui-slider-range {
 540      top: 0;
 541      height: 100%;
 542  }
 543  
 544  .wp-slider.ui-slider-horizontal .ui-slider-range-min {
 545      left: 0;
 546  }
 547  
 548  .wp-slider.ui-slider-horizontal .ui-slider-range-max {
 549      right: 0;
 550  }
 551  
 552  /**
 553   * Media Queries
 554   */
 555  @media print, (min-resolution: 120dpi) {
 556      .revision-tick.completed-false {
 557          background-image: url(../images/spinner-2x.gif);
 558      }
 559  }
 560  
 561  @media screen and (max-width: 600px) {
 562      .revisions-meta .author-card:not(.comparing-two-revisions .author-card) {
 563          display: flex;
 564          flex-direction: column;
 565          width: fit-content;
 566          gap: 16px;
 567      }
 568  
 569      .comparing-two-revisions .revisions-meta .restore-revision {
 570          margin-top: 16px;
 571      }
 572  
 573      .revisions-controls {
 574          padding-top: 0;
 575      }
 576  
 577      .revision-toggle-compare-mode {
 578          position: relative;
 579          padding: 1rem 0;
 580      }
 581  }
 582  
 583  @media screen and (max-width: 782px) {
 584      #diff-next-revision,
 585      #diff-previous-revision {
 586          margin-top: -1em;
 587      }
 588  
 589      .revisions-buttons {
 590          overflow: hidden;
 591          margin-bottom: 15px;
 592      }
 593  
 594      .revisions-controls,
 595      .comparing-two-revisions .revisions-controls {
 596          height: fit-content;
 597      }
 598  
 599      .revisions-tooltip {
 600          bottom: 155px;
 601          z-index: 2;
 602      }
 603  
 604      .comparing-two-revisions .revisions-tooltip {
 605          bottom: 200px;
 606      }
 607  
 608      .diff-meta {
 609          overflow: hidden;
 610      }
 611  
 612      table.diff {
 613          -ms-word-break: break-all;
 614          word-break: break-all;
 615          word-wrap: break-word;
 616      }
 617  }