index.less 1.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869
  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. // using translateZ to fix safari rendering issues
  13. // see: https://github.com/vant-ui/vant/issues/8608
  14. transform: rotate(90deg) translateZ(0);
  15. transition: transform @collapse-item-transition-duration;
  16. }
  17. &::after {
  18. right: @padding-md;
  19. display: none;
  20. }
  21. &--expanded {
  22. .van-cell__right-icon::before {
  23. transform: rotate(-90deg);
  24. }
  25. &::after {
  26. display: block;
  27. }
  28. }
  29. &--borderless {
  30. &::after {
  31. display: none;
  32. }
  33. }
  34. &--disabled {
  35. cursor: not-allowed;
  36. &,
  37. & .van-cell__right-icon {
  38. color: @collapse-item-title-disabled-color;
  39. }
  40. &:active {
  41. background-color: @white;
  42. }
  43. }
  44. }
  45. &__wrapper {
  46. overflow: hidden;
  47. transition: height @collapse-item-transition-duration ease-in-out;
  48. will-change: height;
  49. }
  50. &__content {
  51. padding: @collapse-item-content-padding;
  52. color: @collapse-item-content-text-color;
  53. font-size: @collapse-item-content-font-size;
  54. line-height: @collapse-item-content-line-height;
  55. background-color: @collapse-item-content-background-color;
  56. }
  57. }