drip-ui/packages/drip-css/src/collapse.css

Lightweight Mobile UI Components built on Vue

@import './common/var.css';

.drip-collapse-item {
  &__title {
    .drip-cell__right-icon::before {
      transition: .3s;
      transform: rotate(90deg);
    }

    &::after {
      visibility: hidden;
    }

    &--expanded {
      .drip-cell__right-icon::before {
        transform: rotate(-90deg);
      }

      &::after {
        visibility: visible;
      }
    }

    &--disabled {
      &,
      & .drip-cell__right-icon {
        color: $gray;
      }

      &:active {
        background-color: $white;
      }
    }
  }

  &__wrapper {
    overflow: hidden;
    will-change: height;
    transition: height .3s ease-in-out;
  }

  &__content {
    padding: 15px;
    background-color: $white;
  }
}