Here’s a simple pure CSS, plus to minus icon transition. The code is a mixin in SCSS, and currently transitions on :hover, but the :hover can be changed to a class like .is-minus.

Here’s the codepen as well: https://codepen.io/anon/pen/JNywpQ

@mixin plusMinus($width, $lineWidth, $color) {
  box-sizing: border-box;
  transition: transform 0.3s;
  width: $width;
  height: $width;
  transform: rotate(180deg);
  position: relative;

  &:hover {
    transform: rotate(0deg);
  }
  &::before {
    content: '';
    display: block;
    width: $width;
    height:0px;
    border-bottom: solid $lineWidth $color;
    position: absolute;
    bottom:$width /2 - $lineWidth/2;
    transform: rotate(90deg);
    transition: width 0.3s;
  }
  &:hover::before {
    content: '';
    display: block;
    width: 0px;
    height:0px;
    border-bottom: solid $lineWidth $color;
    position: absolute;
    bottom:$width /2 - $lineWidth/2;
    transform: rotate(90deg);
  }
  &::after {
    content: '';
    display: block;
    width: $width;
    height:0px;
    border-bottom: solid $lineWidth $color;
    position: absolute;
    bottom:$width /2 - $lineWidth/2;
  }
}

.icon {
  @include plusMinus(24px, 2px, #a1a1a1);
}