UNPKG

ten-design-vue

Version:

ten-vue

49 lines (46 loc) 1.24 kB
@import "../vars.less"; @import "../mixins/index.less"; .ten-collapse { background: @collapse-bg; &-item { color: #000; font-size: @font-size; &__head { position: relative; margin-left: @collapse-margin-left; padding-left: @collapse-icon-right + @collapse-icon-width; font-size: @text-level-1-size; line-height: @text-level-1-line; padding-top: @collapse-title-padding-ver; padding-bottom: @collapse-title-padding-ver; color: @text-color; border-bottom: @border-main-2; cursor: pointer; &-icon { position: absolute; top: 50%; left: 0; transform: translateY(-50%); transition: transform .2s; color: @icon-color; font-size: @collapse-icon-width; } } &__content { background: @collapse-item-bg; line-height: @text-level-1-line; &-item { margin-left: @collapse-margin-left; padding: @collapse-item-padding; margin-left: @collapse-margin-left; border-bottom: @border-main-2; color: @text-color-lighter-1; } } &--active &__head { &-icon { transform: translateY(-50%) rotate(90deg); } } } }