@import "../../common/constants";

.VersionHistoryWindow {
  .version-container {
    flex: 1;
    display: flex;
    flex-direction: column;

    .version {
      flex: 1 0;
      display: flex;
      justify-content: center;
      align-items: center;
      position: relative;

      &:after {
        content: '';
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        background-color: rgba(black, .2);
        opacity: 0;
        transition: opacity $anim-duration;
      }

      &:hover {
        &:after {
          opacity: 1;
        }
      }

      &.version-0 {
        background-color: #80CBC4;
        color: #004D40;

        &:before {
          content: 'Version 0'
        }
      }

      &.version-1 {
        background-color: white;
        color: black;

        &:before {
          content: 'Version 1'
        }
      }

      &.version-2 {
        background-color: black;
        color: white;

        &:before {
          content: 'Version 2'
        }
      }
    }
  }
}
