Morph a plus icon into a minus icon for accordians and menus

plus_to_minus_css_animation.scss

/*
<div class = "plus-to-minus">
  <span></span>
  <span></span>
</div>
*/

.question-container {
    .plus-to-minus {
      width: 50px;
      height: 50px;
      font-size: 1.5em;
      position: relative;
      span {
        position: absolute;
        transition: 300ms;
        background: $purple;
        border-radius: 2px;
        &:first-child {
          top: 25%;
          bottom: 25%;
          width: 10%;
          left: 45%;  
        }
        &:last-child {
          left: 25%;
          right: 25%;
          height: 10%;
          top: 45%;  
        }
      }
    }
    a[aria-expanded="true"] {
      .plus-to-minus {
        span {
          transform: rotate(90deg);
          &:last-child {
            left: 50%;
            right: 50%; 
          }  
        }
      }
    }
  }