choerodon-ui
Version:
An enterprise-class UI design language and React-based implementation
216 lines (215 loc) • 4.98 kB
CSS
/* stylelint-disable at-rule-empty-line-before,at-rule-name-space-after,at-rule-no-unknown */
/* stylelint-disable no-duplicate-selectors */
/* stylelint-disable declaration-bang-space-before,no-duplicate-selectors */
/* stylelint-disable declaration-bang-space-before,no-duplicate-selectors */
/* stylelint-disable at-rule-empty-line-before,at-rule-name-space-after,at-rule-no-unknown */
@-webkit-keyframes antCheckboxEffect {
0% {
-webkit-transform: scale(1);
transform: scale(1);
opacity: 0.5;
}
100% {
-webkit-transform: scale(1.6);
transform: scale(1.6);
opacity: 0;
}
}
@keyframes antCheckboxEffect {
0% {
-webkit-transform: scale(1);
transform: scale(1);
opacity: 0.5;
}
100% {
-webkit-transform: scale(1.6);
transform: scale(1.6);
opacity: 0;
}
}
.c7n-transfer {
-webkit-box-sizing: border-box;
box-sizing: border-box;
margin: 0;
padding: 0;
list-style: none;
position: relative;
}
.c7n-transfer-list {
position: relative;
display: inline-block;
width: 1.8rem;
height: 2rem;
padding-top: 0.34rem;
vertical-align: middle;
border: 0.01rem solid #e0e0e0;
border-radius: 0.02rem;
}
.c7n-transfer-list-with-footer {
padding-bottom: 0.34rem;
}
.c7n-transfer-list-search {
padding: 0 0.08rem;
}
.c7n-transfer-list-search-action {
position: absolute;
top: 0.04rem;
right: 0.04rem;
bottom: 0.04rem;
width: 0.28rem;
color: rgba(0, 0, 0, 0.25);
line-height: 0.3rem;
text-align: center;
}
.c7n-transfer-list-search-action .icon {
color: rgba(0, 0, 0, 0.25);
-webkit-transition: all 0.3s;
transition: all 0.3s;
}
.c7n-transfer-list-search-action .icon:hover {
color: rgba(0, 0, 0, 0.45);
}
span.c7n-transfer-list-search-action {
pointer-events: none;
}
.c7n-transfer-list-header {
position: absolute;
top: 0;
left: 0;
width: 100%;
padding: 0.06rem 0.12rem;
overflow: hidden;
color: #000000;
font-size: inherit;
line-height: 1.5;
background: #fff;
border-bottom: 0.01rem solid #e8e8e8;
border-radius: 0.02rem 0.02rem 0 0;
}
.c7n-transfer-list-header-title {
position: absolute;
right: 0.12rem;
font-weight: inherit;
}
.c7n-transfer-list-body {
position: relative;
height: 100%;
font-size: 0.13rem;
}
.c7n-transfer-list-body-search-wrapper {
position: absolute;
top: 0;
left: 0;
width: 100%;
padding: 0.04rem;
}
.c7n-transfer-list-body-with-search {
padding-top: calc(0.3rem + 0.08rem);
}
.c7n-transfer-list-content {
height: 100%;
margin: 0;
padding: 0rem;
overflow: auto;
list-style: none;
}
.c7n-transfer-list-content > .LazyLoad {
-webkit-animation: transferHighlightIn 1s;
animation: transferHighlightIn 1s;
}
.c7n-transfer-list-content-item {
min-height: 0.32rem;
margin: 0rem;
padding: 0.06rem 0.12rem;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
-webkit-transition: all 0.3s;
transition: all 0.3s;
}
.c7n-transfer-list-content-item > span {
padding-right: 0;
}
.c7n-transfer-list-content-item:not(.c7n-transfer-list-content-item-disabled):hover {
background-color: rgba(0, 0, 0, 0.04);
cursor: pointer;
}
.c7n-transfer-list-content-item-disabled {
color: rgba(0, 0, 0, 0.25);
cursor: not-allowed;
}
.c7n-transfer-list-content-item-highlight {
background-color: rgba(140, 158, 255, 0.12);
}
.c7n-transfer-list-body-not-found {
position: absolute;
top: 50%;
display: none;
width: 100%;
margin-top: -0.1rem;
padding-top: 0;
color: rgba(0, 0, 0, 0.25);
text-align: center;
}
.c7n-transfer-list-content:empty + .c7n-transfer-list-body-not-found {
display: block;
}
.c7n-transfer-list-footer {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
border-top: 0.01rem solid #e8e8e8;
border-radius: 0 0 0.02rem 0.02rem;
}
.c7n-transfer-operation,
.c7n-transfer-sort {
display: inline-block;
margin: 0 0.08rem;
overflow: hidden;
vertical-align: middle;
}
.c7n-transfer-operation .c7n-btn,
.c7n-transfer-sort .c7n-btn {
display: block;
}
.c7n-transfer-operation .c7n-btn:first-child,
.c7n-transfer-sort .c7n-btn:first-child {
margin-bottom: 0.04rem;
}
.c7n-transfer-operation .c7n-btn .icon,
.c7n-transfer-sort .c7n-btn .icon {
font-size: 0.12rem;
}
.c7n-transfer-operation .c7n-btn + .c7n-btn,
.c7n-transfer-sort .c7n-btn + .c7n-btn {
margin-left: 0;
}
.c7n-transfer-operation-custom-left-active,
.c7n-transfer-operation-custom-right-active,
.c7n-transfer-sort-custom-up-active,
.c7n-transfer-sort-custom-down-active {
cursor: pointer;
}
.c7n-transfer-operation-custom-left-disable,
.c7n-transfer-operation-custom-right-disable,
.c7n-transfer-sort-custom-up-disable,
.c7n-transfer-sort-custom-down-disable {
cursor: no-drop;
}
@-webkit-keyframes transferHighlightIn {
0% {
background: #dadee8;
}
100% {
background: transparent;
}
}
@keyframes transferHighlightIn {
0% {
background: #dadee8;
}
100% {
background: transparent;
}
}