| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153 | @import '../style/var';.van-tab {  position: relative;  display: flex;  flex: 1;  align-items: center;  justify-content: center;  box-sizing: border-box;  padding: 0 @padding-base;  color: @tab-text-color;  font-size: @tab-font-size;  line-height: @tab-line-height;  cursor: pointer;  &--active {    color: @tab-active-text-color;    font-weight: @font-weight-bold;  }  &--disabled {    color: @tab-disabled-text-color;    cursor: not-allowed;  }  &__text {    &--ellipsis {      display: -webkit-box;      overflow: hidden;      -webkit-line-clamp: 1;      -webkit-box-orient: vertical;    }  }  &__text-wrapper {    position: relative;  }}.van-tabs {  position: relative;  &__wrap {    overflow: hidden;    &--page-top {      position: fixed;    }    &--content-bottom {      top: auto;      bottom: 0;    }    &--scrollable {      .van-tab {        flex: 1 0 auto;        padding: 0 @padding-sm;      }      .van-tabs__nav {        overflow-x: auto;        overflow-y: hidden;        -webkit-overflow-scrolling: touch;        &::-webkit-scrollbar {          display: none;        }      }    }  }  &__nav {    position: relative;    display: flex;    background-color: @tabs-nav-background-color;    user-select: none;    &--line {      box-sizing: content-box;      height: 100%;      padding-bottom: 15px; /* 15px padding to hide scrollbar in mobile safari */    }    &--line&--complete {      padding-right: @padding-xs;      padding-left: @padding-xs;    }    &--card {      box-sizing: border-box;      height: @tabs-card-height;      margin: 0 @padding-md;      border: @border-width-base solid @tabs-default-color;      border-radius: @border-radius-sm;      .van-tab {        color: @tabs-default-color;        border-right: @border-width-base solid @tabs-default-color;        &:last-child {          border-right: none;        }        &.van-tab--active {          color: @white;          background-color: @tabs-default-color;        }        &--disabled {          color: @tab-disabled-text-color;        }      }    }  }  &__line {    position: absolute;    bottom: 15px;    left: 0;    z-index: 1;    width: @tabs-bottom-bar-width;    height: @tabs-bottom-bar-height;    background-color: @tabs-bottom-bar-color;    border-radius: @tabs-bottom-bar-height;  }  &__track {    position: relative;    display: flex;    width: 100%;    height: 100%;    will-change: left;  }  &__content {    &--animated {      overflow: hidden;    }  }  &--line {    .van-tabs__wrap {      height: @tabs-line-height;    }  }  &--card {    > .van-tabs__wrap {      height: @tabs-card-height;    }  }}
 |