document_version.scss

.thumbnails {
  max-width: 10rem;
  width: 10rem;
  overflow: scroll;

  .thumbnail {
    margin: 1rem;
    img {
      width: 6rem;
    }
  }
}

.pages {
  overflow: scroll;
  width: 100%;
  .page {
    img {
      width: 100%;
    }
  }
}

svg.ocr_status {
    /* Use the current text color as the icon’s fill color. */
    fill: currentColor;
    /* Inherit the text’s size too. Also allows sizing the icon by changing its font-size. */
    width: 1em;
    height: 1em;
    /* The default vertical-align is `baseline`, which leaves a few pixels of space below the icon. Using `center` prevents this. For icons shown alongside text, you may want to use a more precise value, e.g. `vertical-align: -4px` or `vertical-align: -0.15em`. */
    vertical-align: middle;
    /* Paths and strokes that overflow the viewBox can show in IE11. */
    overflow: hidden;
}

svg.unknown {
    fill: #aaa;
}

svg.received {
    fill: orange;
}

svg.started {
    fill: None;
    animation: rotate_svg 1s linear infinite;
}

svg.succeeded {
    fill: #0aa70a;
}

svg.failed {
    fill: #e22e2e;;
}

@keyframes rotate_svg {
  to {
    transform: rotate(360deg);
  }
}