139 lines
2.8 KiB
Plaintext
139 lines
2.8 KiB
Plaintext
@import '../common/index.less';
|
|
|
|
.hairline-common() {
|
|
position: absolute;
|
|
box-sizing: border-box;
|
|
transform-origin: center; /* cover wechat button:after default transforn-origin */
|
|
content: ' ';
|
|
pointer-events: none;
|
|
}
|
|
|
|
.hairline(@border-color: #eee) {
|
|
.hairline-common();
|
|
top: -50%;
|
|
right: -50%;
|
|
bottom: -50%;
|
|
left: -50%;
|
|
border: 0 solid @border-color;
|
|
transform: scale(0.5);
|
|
}
|
|
|
|
.hairline-bottom(@border-color: #eee, @left: 0) {
|
|
.hairline-common();
|
|
top: auto;
|
|
right: 0;
|
|
bottom: 0;
|
|
left: @left;
|
|
border-bottom: 1px solid @border-color;
|
|
transform: scaleY(0.5);
|
|
}
|
|
|
|
@collapse-header-text-color: @text-level-1-color;
|
|
@collapse-content-text-color: @text-level-1-color;
|
|
@collapse-header-text-diabled-color: @text-level-4-color;
|
|
@collapse-list-content-text-color: @text-level-1-color;
|
|
|
|
// font-size
|
|
@collapse-title-font-size: @font-size * 1.6;
|
|
@collapse-extra-font-size: @font-size * 1.6;
|
|
@collapse-content-font-size: @font-size * 1.4;
|
|
|
|
@collapse-header-height: 96rpx;
|
|
@collapse-horizontal-padding: 32rpx;
|
|
@collapse-content-padding: 32rpx;
|
|
@collapse-content-line-height: 1.5;
|
|
|
|
@collapse-border: 1px solid #eee;
|
|
@collapse-shadow-bottom: inset 0 -1px 0 0 #eeeeee;
|
|
|
|
.@{prefix}-collapse-panel {
|
|
// height: @collapse-header-height;
|
|
overflow: hidden;
|
|
transition: height 200ms ease-in-out;
|
|
box-shadow: @collapse-shadow-bottom;
|
|
background-color: #fff;
|
|
|
|
&--active {
|
|
height: auto;
|
|
}
|
|
|
|
&--disabled {
|
|
pointer-events: none;
|
|
|
|
.@{prefix}-collapse-panel__content,
|
|
.@{prefix}-collapse-panel__header {
|
|
opacity: 0.3;
|
|
}
|
|
}
|
|
|
|
&__header {
|
|
position: relative;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
padding-left: @collapse-horizontal-padding;
|
|
height: @collapse-header-height;
|
|
box-shadow: @collapse-shadow-bottom;
|
|
color: @collapse-header-text-color;
|
|
}
|
|
|
|
&__header-right {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
height: 100%;
|
|
}
|
|
|
|
// &__header-extra {
|
|
// }
|
|
|
|
&__header-icon {
|
|
// 增大热区
|
|
height: 100%;
|
|
padding-left: 8px;
|
|
width: 44px;
|
|
padding-right: 8px;
|
|
color: rgba(0, 0, 0, 40%);
|
|
}
|
|
|
|
&__extra {
|
|
font-size: @collapse-extra-font-size;
|
|
}
|
|
|
|
&__body {
|
|
box-shadow: @collapse-shadow-bottom;
|
|
}
|
|
|
|
&__wrapper {
|
|
transition: height 200ms ease-in-out;
|
|
}
|
|
|
|
&__content {
|
|
color: @collapse-content-text-color;
|
|
font-size: @collapse-content-font-size;
|
|
padding: @collapse-content-padding;
|
|
line-height: @collapse-content-line-height;
|
|
}
|
|
}
|
|
|
|
.class {
|
|
&-title {
|
|
font-size: @collapse-title-font-size;
|
|
|
|
&--disabled {
|
|
color: @text-disabled-color;
|
|
}
|
|
}
|
|
|
|
&-note {
|
|
&--disabled {
|
|
color: @text-disabled-color !important;
|
|
}
|
|
}
|
|
|
|
&-right-icon {
|
|
&--disabled {
|
|
color: @text-disabled-color !important;
|
|
}
|
|
}
|
|
}
|