porkchopclub/porkchop

View on GitHub
app/assets/stylesheets/scoreboard/_pre-match.scss

Summary

Maintainability
Test Coverage
.scoreboard-pre-match {
  opacity: 1;

  $color: shade($blue, 15%);
  @include radial-gradient(
    circle at 50% 50%,
    $color 40%,
    shade($color, 10%) 75%,
    shade($color, 35%)
  );
}

.pre-match-frame {
  position: absolute;
  top: 50%;
  width: 100%;
  @include transform(translateY(-50%));
  text-shadow: 0 0 15px rgba($dark-grey, 0.35);
  font-size: 45px;
  font-weight: bold;
  color: $off-white;
  text-align: center;
}

.pre-match-timer {
  font-size: 150px;
  margin-top: 82px;
  background-color: $off-white;
  color: $blue;
  display: inline-block;
  padding: 0 0.3em;
  border-radius: 38px;
}

.pre-match-player-names {
  font-size: 75px;
  margin-bottom: 48px;
}