You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
63 lines
1.6 KiB
63 lines
1.6 KiB
@import "mixins/mixins"; |
|
@import "common/var"; |
|
@import "common/transition"; |
|
|
|
@include b(collapse) { |
|
border-top: 1px solid $--collapse-border-color; |
|
border-bottom: 1px solid $--collapse-border-color; |
|
} |
|
@include b(collapse-item) { |
|
@include when(disabled) { |
|
.el-collapse-item__header { |
|
color: $--font-color-disabled-base; |
|
cursor: not-allowed; |
|
} |
|
} |
|
@include e(header) { |
|
display: flex; |
|
align-items: center; |
|
height: $--collapse-header-height; |
|
line-height: $--collapse-header-height; |
|
background-color: $--collapse-header-background-color; |
|
color: $--collapse-header-font-color; |
|
cursor: pointer; |
|
border-bottom: 1px solid $--collapse-border-color; |
|
font-size: $--collapse-header-font-size; |
|
font-weight: 500; |
|
transition: border-bottom-color .3s; |
|
outline: none; |
|
@include e(arrow) { |
|
margin: 0 8px 0 auto; |
|
transition: transform .3s; |
|
font-weight: 300; |
|
@include when(active) { |
|
transform: rotate(90deg); |
|
} |
|
} |
|
&.focusing:focus:not(:hover){ |
|
color: $--color-primary; |
|
} |
|
@include when(active) { |
|
border-bottom-color: transparent; |
|
} |
|
} |
|
|
|
@include e(wrap) { |
|
will-change: height; |
|
background-color: $--collapse-content-background-color; |
|
overflow: hidden; |
|
box-sizing: border-box; |
|
border-bottom: 1px solid $--collapse-border-color; |
|
} |
|
|
|
@include e(content) { |
|
padding-bottom: 25px; |
|
font-size: $--collapse-content-font-size; |
|
color: $--collapse-content-font-color; |
|
line-height: 1.769230769230769; |
|
} |
|
|
|
&:last-child { |
|
margin-bottom: -1px; |
|
} |
|
}
|
|
|