discourse/app/assets/stylesheets/common/base/history.scss

// styles that apply to the popup that appears when you show the edit history of a post

.modal.history-modal {
  .modal-body:not(.theme-change-modal-body) {
    max-height: 70vh;
  }

  #revision-numbers {
    display: inline-block;
    min-width: 96px;
    text-align: center;
  }

  #revision {
    display: flex;
    justify-content: space-between;
    padding-bottom: 0.5em;
    align-items: center;
    overflow: auto;
    border-bottom: 3px solid var(--primary-low);
  }

  #revision-details {
    display: flex;
    align-items: baseline;
    gap: 0.5em;
    .d-icon {
      align-self: center;
    }
  }

  .revision__title,
  .body-diff,
  table.markdown > tbody > tr,
  .-tag-revisions {
    --gap-width: 1rem;
    display: flex;
    gap: 0 var(--gap-width);
  }

  .revision__title {
    margin: 0;
    line-height: var(--line-height-medium);
  }

  .-tag-revisions span,
  .revision-content {
    flex: 0 0 calc(50% - (var(--gap-width) / 2));
  }

  table.markdown {
    tbody {
      border: none;
    }
  }

  #revision-controls {
    display: flex;
    align-items: center;
    .btn {
      margin: 0;
    }
  }

  [class^="revision-controls--"] {
    display: flex;
    gap: 0 1em;
  }

  #revisions {
    .row:first-of-type {
      margin-top: 10px;
    }
    .revision-content table {
      thead {
        th {
          padding-bottom: 2px;
          font-weight: bold;
          color: var(--primary);
        }
      }

      td {
        padding: 3px 3px 3px 0.5em;
        img {
          max-width: none;
        }
      }
    }
  }

  #revision-footer-buttons {
    display: flex;
    gap: 0.5em;
    button {
      margin: 0;
    }
  }

  ins,
  .diff-ins {
    code,
    img {
      border: 2px solid var(--success);
    }
    img {
      opacity: 0.75;
      filter: alpha(opacity=75);
    }
    a {
      color: var(--success);
      text-decoration: none;
    }
  }
  img.diff-ins,
  code.diff-ins {
    border: 2px solid var(--success);
  }
  img.diff-ins {
    opacity: 0.75;
    filter: alpha(opacity=75);
  }
  .diff-ins {
    color: var(--primary);
    background: var(--success-low);
  }
  ins {
    color: var(--primary);
    background: var(--success-low);
    text-decoration: none;
  }
  del,
  .diff-del {
    code,
    img {
      border: 2px solid var(--danger);
    }
    img {
      opacity: 0.5;
      filter: alpha(opacity=50);
    }
    a {
      color: var(--danger);
      text-decoration: none;
    }
  }
  img.diff-del,
  code.diff-del {
    border: 2px solid var(--danger);
  }
  img.diff-del {
    opacity: 0.5;
    filter: alpha(opacity=50);
  }
  .diff-del {
    color: var(--primary);
    background: var(--danger-low);
    text-decoration: none;
  }
  del {
    color: var(--primary);
    background: var(--danger-low);
    text-decoration: none;
  }
  span.date {
    font-weight: bold;
  }
  span.edit-reason {
    background-color: var(--highlight-bg);
    padding: 3px 5px 5px 5px;
  }
  .d-icon-ban {
    color: var(--danger);
  }
  .hidden-revision-either {
    opacity: 0.5;
  }
  .hidden-revision-previous .row {
    div:nth-of-type(1),
    td:nth-of-type(1) {
      opacity: 0.5;
    }
  }
  .hidden-revision-current .row {
    div:nth-of-type(2),
    td:nth-of-type(2) {
      opacity: 0.5;
    }
  }
}