ten-design-vue
Version:
ten-vue
188 lines (187 loc) • 3.98 kB
CSS
/* dependencies input,icon,loading,popup */
/**
* 文字部分
* size 大小,line 行高, color 颜色
*/
/* button */
/* input */
/* transfer */
/* alert */
/* menu */
/* message */
/* modal */
/* badge */
/* tag */
/* progress */
/* popup */
/* tooltip */
/* loading */
/* tabs */
/* check */
/* mention */
/* popup */
/* steps */
/* tabs */
/* modal */
/* form */
/* table */
/* pagination */
/* upload */
/* collapse */
/* anchor */
/* list */
.vue-recycle-scroller {
position: relative;
}
.vue-recycle-scroller.direction-vertical:not(.page-mode) {
overflow-y: auto;
}
.vue-recycle-scroller.direction-horizontal:not(.page-mode) {
overflow-x: auto;
}
.vue-recycle-scroller.direction-horizontal {
display: flex;
}
.vue-recycle-scroller__slot {
flex: auto 0 0;
}
.vue-recycle-scroller__item-wrapper {
flex: 1;
box-sizing: border-box;
overflow: hidden;
position: relative;
}
.vue-recycle-scroller.ready .vue-recycle-scroller__item-view {
position: absolute;
top: 0;
left: 0;
will-change: transform;
}
.vue-recycle-scroller.direction-vertical .vue-recycle-scroller__item-wrapper {
width: 100%;
}
.vue-recycle-scroller.direction-horizontal .vue-recycle-scroller__item-wrapper {
height: 100%;
}
.vue-recycle-scroller.ready.direction-vertical .vue-recycle-scroller__item-view {
width: 100%;
}
.vue-recycle-scroller.ready.direction-horizontal .vue-recycle-scroller__item-view {
height: 100%;
}
.resize-observer[data-v-b329ee4c] {
position: absolute;
top: 0;
left: 0;
z-index: -1;
width: 100%;
height: 100%;
border: none;
background-color: transparent;
pointer-events: none;
display: block;
overflow: hidden;
opacity: 0;
}
.resize-observer[data-v-b329ee4c] object {
display: block;
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
overflow: hidden;
pointer-events: none;
z-index: -1;
}
.ten-select {
cursor: pointer;
}
.ten-select-input {
cursor: pointer;
}
.ten-select-input .ten-input__input-input:not(:disabled):-moz-read-only {
cursor: pointer;
}
.ten-select-input .ten-input__input-input:not(:disabled):read-only {
cursor: pointer;
}
.ten-select-input .ten-input__input-icon {
font-size: 14px;
}
.ten-select-input .ten-input__input-icon .ten-icon--carret_down {
transition: -webkit-transform 0.3s;
transition: transform 0.3s;
transition: transform 0.3s, -webkit-transform 0.3s;
}
.ten-select-input--popupshow .ten-input__input-icon .ten-icon--carret_down {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}
.ten-select-options {
max-height: 400px;
overflow-y: auto;
outline: none;
}
.ten-select-option {
padding: 13px 10px;
line-height: 22px;
cursor: pointer;
word-break: break-all;
}
.ten-select-option .ten-checkbox {
margin-right: 8px;
}
.ten-select-option--selected {
color: #0052d9;
}
.ten-select-option:hover:not(.ten-select-option--disabled),
.ten-select-option:focus:not(.ten-select-option--disabled),
.ten-select-option.ten-select-option--focused:not(.ten-select-option--disabled) {
background: #e8f1ff;
}
.ten-select-option--disabled {
color: #c0c0c0;
cursor: not-allowed;
}
.ten-select__popup-content {
position: relative;
}
.ten-select__popup.ten-popup {
padding: 0;
}
.ten-select__popup--size-small .ten-select-option {
min-height: 40px;
line-height: 40px;
}
.ten-select__popup--loading .ten-select__popup-content {
min-height: 48px;
}
.ten-select__popup .ten-select__empty {
text-align: center;
color: #999;
line-height: 48px;
}
.ten-select-group__title {
font-size: 14px;
padding: 13px 10px;
line-height: 22px;
color: #999;
}
/**
* 紧凑版变量覆写
* 如发现需要用到的变量没有定义,先在样式文件中抽出来在 vars.less 中添加该变量
* 变量命名方式 组件名-属性-修饰 如 button-fontsize-small
*/
/* input */
/* check */
/* select */
/* popup */
/* menu */
/* steps */
/* tabs */
/* modal */
/* table */
/* pagination */
/* upload */
/* form */