alexzherdev/foosballtracker

View on GitHub
src/css/scores.scss

Summary

Maintainability
Test Coverage
.new-score {
  input[type=text] {
    width: 3em;
  }

  .dropdown-toggle, .dropdown-menu {
    width: 100%;
  }

  .dropdown-menu li {
    text-align: center;
  }

  .row:first-child {
    margin-bottom: 1rem;
  }

  .player-picker:first-child {
    margin-bottom: 1rem;
  }

  .dash {
    font-size: 2.5rem;
    font-weight: bold;
    margin: 0 1rem;
    vertical-align: middle;
  }
}

.scores {
  td {
    text-align: center;

    .score-container {
      position: relative;

      .team-1 {
        position: absolute;
        text-align: right;
        right: 8px;
        width: 200px;
      }

      .team-2 {
        position: absolute;
        text-align: left;
        left: 8px;
        width: 200px;
      }
    }

    .delete-score {
      cursor: pointer;
      position: absolute;
      right: 20px;
      display: none;
    }

    &:hover .delete-score {
      display: inline;
    }
  }
}