index.less 1.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667
  1. @import '../style/var';
  2. @import '../style/mixins/hairline';
  3. .van-collapse-item {
  4. position: relative;
  5. &--border {
  6. &::after {
  7. .hairline-top(@cell-border-color, @padding-md, @padding-md);
  8. }
  9. }
  10. &__title {
  11. .van-cell__right-icon::before {
  12. transform: rotate(90deg);
  13. transition: transform @collapse-item-transition-duration;
  14. }
  15. &::after {
  16. right: @padding-md;
  17. display: none;
  18. }
  19. &--expanded {
  20. .van-cell__right-icon::before {
  21. transform: rotate(-90deg);
  22. }
  23. &::after {
  24. display: block;
  25. }
  26. }
  27. &--borderless {
  28. &::after {
  29. display: none;
  30. }
  31. }
  32. &--disabled {
  33. cursor: not-allowed;
  34. &,
  35. & .van-cell__right-icon {
  36. color: @collapse-item-title-disabled-color;
  37. }
  38. &:active {
  39. background-color: @white;
  40. }
  41. }
  42. }
  43. &__wrapper {
  44. overflow: hidden;
  45. transition: height @collapse-item-transition-duration ease-in-out;
  46. will-change: height;
  47. }
  48. &__content {
  49. padding: @collapse-item-content-padding;
  50. color: @collapse-item-content-text-color;
  51. font-size: @collapse-item-content-font-size;
  52. line-height: @collapse-item-content-line-height;
  53. background-color: @collapse-item-content-background-color;
  54. }
  55. }