title: Bootstrap 4 - Is it bad practice to override a Bootstrap class?
body: <p>For example: <code>form-control</code> <a href="https://getbootstrap.com/docs/4.0/components/forms/#form-controls" rel="nofollow noreferrer">looks like this</a></p>
  
  <p>Is it bad practice for me to add this scss? </p>
  
  <pre><code>.form-control {
      -webkit-transition: all 0.30s ease-in-out;
      -moz-transition: all 0.30s ease-in-out;
      -ms-transition: all 0.30s ease-in-out;
      -o-transition: all 0.30s ease-in-out;
      outline: none;
      width: 100%;
      padding: 7px 20px;
      margin: 0;
      border: 2px solid $mdc-grey-400;
      box-sizing: border-box;
      border-radius:2rem;
  }
  form-control:focus, textarea:focus {
      box-shadow: 0 0 10px $mdc-orange-300;
      border: 2px solid $mdc-orange-500;
  }
  </code></pre>