uccser/cs-field-guide

View on GitHub
csfieldguide/static/interactives/awful-calculator/scss/awful-calculator.scss

Summary

Maintainability
Test Coverage
#interactive-awful-calculator {
  /* General Calculator Styling */
  .calculator {
    border: 2px solid #D0D0D0;
    border-radius: 2px;
    margin-top: 1rem;
    padding: 0.6rem !important;
    margin: 0.3rem;
  }
  button {
    width: 100%;
    padding: 0;
    margin: 2px;
    color: white;
  }
  .calculator-input {
    margin: 0;
    padding: 0 0.3rem;
    width: 100%;
    flex: 0 0 75%;
    background-color: #EFEFEF;
    color: #000;
    text-align: right;
    font-size: 1rem;
    border: 1px solid #D0D0D0;
    border-radius: 2px;
  }

  /* Awful Calculator */
  #calculator-awful {
    button {
      background-color: #512da8;
    }
    button:hover {
      -ms-transform: scale(1.8, 1.8);
      -webkit-transform: scale(1.8, 1.8);
      -moz-transform: scale(1.8, 1.8);
      transform: scale(1.8, 1.8);
    }
  }
}