File: src/css/app.scss

@use '~xterm/css/xterm.css';
@use '~bootstrap/dist/css/bootstrap.min.css';

:root {
  --bs-light: #eee;
}

.bg-light {
  background-color: var(--bs-light, #f8f9fa) !important;
}

h1 {
  font-size: 4em;
  font-weight: normal;

  .version {
    opacity: 0;
    font-size: 0.8em;
    font-family: monospace;
    letter-spacing: -5px;
    transition: 0.3s opacity linear;
  }

  &:hover .version {
    opacity: 0.3;
  }
}

.parser {
  .spinner-border {
    border-width: 0.1em;
    height: 1em;
    margin-left: 0.4em;
    width: 1em;
  }
}

pre {
  min-height: 2.65em;
  position: relative;

  a.btn {
    opacity: 0;
    position: absolute;
    right: 2px;
    top: 2px;
    transition: opacity 0.3s;
  }

  &:hover a.btn {
    opacity: 1;
  }

  &.copy-paste {
    max-height: 40vh;
  }
}

.jumbotron {
  background: var(--bs-light, #f8f9fa);
  margin-bottom: 1.5rem;
  padding: 3rem 0 1.5rem;
}

.contents {
  max-height: 40vh;
  overflow-x: hidden;
  overflow-y: auto;
}

.github-corner {
  .octo-arm {
    @media (max-width: 500px) {
      animation: octocat-wave 560ms ease-in-out
    }
  }

  &:hover .octo-arm {
    animation: octocat-wave 560ms ease-in-out;
    transform-origin: 130px 106px;

    @media (max-width: 500px) {
      animation: none
    }
  }
}

@keyframes octocat-wave {
  0%, 100% {
    transform: rotate(0)
  }
  20%, 60% {
    transform: rotate(-25deg)
  }
  40%, 80% {
    transform: rotate(10deg)
  }
}