/*font*/ /*size*/ /*icon*/ /*color*/ /*input/radio/checkbox*/ /*popup*/ /*table*/ /*filter*/ /*menu*/ /*loading*/ /*validate*/ /*grid*/ /*toolbar*/ /*tooltip*/ /*pager*/ /*modal*/ /*checkbox*/ /*radio*/ /*button*/ /*input*/ /*textarea*/ /*form*/ /*select*/ /*switch*/ /*pulldown*/ .vxe-button { position: relative; text-align: center; background-color: #fff; outline: 0; font-size: 14px; max-width: 500px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; white-space: nowrap; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; -webkit-transition: border 0.2s ease-in-out; transition: border 0.2s ease-in-out; } .vxe-button.is--disabled { color: #BFBFBF; } .vxe-button.is--disabled .vxe-button--icon.vxe-icon--zoomin { border-color: #BFBFBF; } .vxe-button.is--disabled:not(.is--loading) { cursor: no-drop; } .vxe-button:not(.is--disabled) { color: #606266; cursor: pointer; } .vxe-button:not(.is--disabled) .vxe-button--icon.vxe-icon--zoomin { border-color: #606266; } .vxe-button.is--loading:before { content: ""; position: absolute; left: -1px; top: -1px; right: -1px; bottom: -1px; border-radius: inherit; background-color: rgba(255, 255, 255, 0.35); pointer-events: none; } .vxe-button.type--text { text-decoration: none; border: 0; padding: 0.1em 0.5em; background-color: transparent; } .vxe-button.type--text:not(.is--disabled):focus { -webkit-box-shadow: 0 0 0.25em 0 #409eff; box-shadow: 0 0 0.25em 0 #409eff; } .vxe-button.type--text:not(.is--disabled):hover { color: #73b8ff; } .vxe-button.type--text.theme--primary { color: #409eff; } .vxe-button.type--text.theme--primary:not(.is--disabled):hover { color: #73b8ff; } .vxe-button.type--text.theme--primary.is--disabled { color: #a6d2ff; } .vxe-button.type--text.theme--success { color: #67c23a; } .vxe-button.type--text.theme--success:not(.is--disabled):hover { color: #85cf60; } .vxe-button.type--text.theme--success.is--disabled { color: #a3db87; } .vxe-button.type--text.theme--info { color: #909399; } .vxe-button.type--text.theme--info:not(.is--disabled):hover { color: #abadb1; } .vxe-button.type--text.theme--info.is--disabled { color: #c5c7ca; } .vxe-button.type--text.theme--warning { color: #e6a23c; } .vxe-button.type--text.theme--warning:not(.is--disabled):hover { color: #ecb869; } .vxe-button.type--text.theme--warning.is--disabled { color: #f2cd96; } .vxe-button.type--text.theme--danger { color: #f56c6c; } .vxe-button.type--text.theme--danger:not(.is--disabled):hover { color: #f89c9c; } .vxe-button.type--text.theme--danger.is--disabled { color: #fbcccc; } .vxe-button.type--text.theme--perfect { color: #f8f8f9; } .vxe-button.type--text.theme--perfect:not(.is--disabled):hover { color: white; } .vxe-button.type--text.theme--perfect.is--disabled { color: white; } .vxe-button.type--button { font-family: inherit; line-height: inherit; height: 34px; line-height: 1; border: 1px solid #dcdfe6; } .vxe-button.type--button.is--round { border-radius: 17px; } .vxe-button.type--button:not(.is--round) { border-radius: 4px; } .vxe-button.type--button.is--circle { padding: 0 0.5em; min-width: 34px; border-radius: 50%; } .vxe-button.type--button:not(.is--circle) { padding: 0 1em; } .vxe-button.type--button:not(.is--disabled):hover { color: #5faeff; } .vxe-button.type--button:not(.is--disabled):hover .vxe-button--icon.vxe-icon--zoomin { border-color: #5faeff; } .vxe-button.type--button:not(.is--disabled):focus { border-color: #409eff; -webkit-box-shadow: 0 0 0.25em 0 #409eff; box-shadow: 0 0 0.25em 0 #409eff; } .vxe-button.type--button:not(.is--disabled):active { color: #3196ff; border-color: #3196ff; background-color: #f7f7f7; } .vxe-button.type--button:not(.is--disabled):active .vxe-button--icon.vxe-icon--zoomin { background-color: #f7f7f7; } .vxe-button.type--button:not(.is--disabled):active .vxe-button--icon.vxe-icon--zoomout:after { background-color: #f7f7f7; } .vxe-button.type--button.theme--primary { color: #fff; } .vxe-button.type--button.theme--primary .vxe-button--icon.vxe-icon--zoomin { border-color: #fff; } .vxe-button.type--button.theme--primary:not(.is--disabled) { border-color: #409eff; background-color: #409eff; } .vxe-button.type--button.theme--primary:not(.is--disabled):hover { color: #fff; background-color: #5faeff; border-color: #5faeff; } .vxe-button.type--button.theme--primary:not(.is--disabled):hover .vxe-button--icon.vxe-icon--zoomin { border-color: #5faeff; } .vxe-button.type--button.theme--primary:not(.is--disabled):active { color: #fff; background-color: #3196ff; border-color: #3196ff; } .vxe-button.type--button.theme--primary:not(.is--disabled):active.vxe-icon--zoomin { background-color: #3196ff; } .vxe-button.type--button.theme--primary:not(.is--disabled):active.vxe-icon--zoomout:after { background-color: #3196ff; } .vxe-button.type--button.theme--primary.is--disabled { border-color: #a6d2ff; background-color: #a6d2ff; } .vxe-button.type--button.theme--primary.is--loading { border-color: #409eff; background-color: #409eff; } .vxe-button.type--button.theme--success { color: #fff; } .vxe-button.type--button.theme--success .vxe-button--icon.vxe-icon--zoomin { border-color: #fff; } .vxe-button.type--button.theme--success:not(.is--disabled) { border-color: #67c23a; background-color: #67c23a; } .vxe-button.type--button.theme--success:not(.is--disabled):hover { color: #fff; background-color: #79cb50; border-color: #79cb50; } .vxe-button.type--button.theme--success:not(.is--disabled):hover .vxe-button--icon.vxe-icon--zoomin { border-color: #79cb50; } .vxe-button.type--button.theme--success:not(.is--disabled):active { color: #fff; background-color: #61b636; border-color: #61b636; } .vxe-button.type--button.theme--success:not(.is--disabled):active.vxe-icon--zoomin { background-color: #61b636; } .vxe-button.type--button.theme--success:not(.is--disabled):active.vxe-icon--zoomout:after { background-color: #61b636; } .vxe-button.type--button.theme--success.is--disabled { border-color: #a3db87; background-color: #a3db87; } .vxe-button.type--button.theme--success.is--loading { border-color: #67c23a; background-color: #67c23a; } .vxe-button.type--button.theme--info { color: #fff; } .vxe-button.type--button.theme--info .vxe-button--icon.vxe-icon--zoomin { border-color: #fff; } .vxe-button.type--button.theme--info:not(.is--disabled) { border-color: #909399; background-color: #909399; } .vxe-button.type--button.theme--info:not(.is--disabled):hover { color: #fff; background-color: #a0a3a8; border-color: #a0a3a8; } .vxe-button.type--button.theme--info:not(.is--disabled):hover .vxe-button--icon.vxe-icon--zoomin { border-color: #a0a3a8; } .vxe-button.type--button.theme--info:not(.is--disabled):active { color: #fff; background-color: #888b92; border-color: #888b92; } .vxe-button.type--button.theme--info:not(.is--disabled):active.vxe-icon--zoomin { background-color: #888b92; } .vxe-button.type--button.theme--info:not(.is--disabled):active.vxe-icon--zoomout:after { background-color: #888b92; } .vxe-button.type--button.theme--info.is--disabled { border-color: #c5c7ca; background-color: #c5c7ca; } .vxe-button.type--button.theme--info.is--loading { border-color: #909399; background-color: #909399; } .vxe-button.type--button.theme--warning { color: #fff; } .vxe-button.type--button.theme--warning .vxe-button--icon.vxe-icon--zoomin { border-color: #fff; } .vxe-button.type--button.theme--warning:not(.is--disabled) { border-color: #e6a23c; background-color: #e6a23c; } .vxe-button.type--button.theme--warning:not(.is--disabled):hover { color: #fff; background-color: #e9af57; border-color: #e9af57; } .vxe-button.type--button.theme--warning:not(.is--disabled):hover .vxe-button--icon.vxe-icon--zoomin { border-color: #e9af57; } .vxe-button.type--button.theme--warning:not(.is--disabled):active { color: #fff; background-color: #e49c2e; border-color: #e49c2e; } .vxe-button.type--button.theme--warning:not(.is--disabled):active.vxe-icon--zoomin { background-color: #e49c2e; } .vxe-button.type--button.theme--warning:not(.is--disabled):active.vxe-icon--zoomout:after { background-color: #e49c2e; } .vxe-button.type--button.theme--warning.is--disabled { border-color: #f2cd96; background-color: #f2cd96; } .vxe-button.type--button.theme--warning.is--loading { border-color: #e6a23c; background-color: #e6a23c; } .vxe-button.type--button.theme--danger { color: #fff; } .vxe-button.type--button.theme--danger .vxe-button--icon.vxe-icon--zoomin { border-color: #fff; } .vxe-button.type--button.theme--danger:not(.is--disabled) { border-color: #f56c6c; background-color: #f56c6c; } .vxe-button.type--button.theme--danger:not(.is--disabled):hover { color: #fff; background-color: #f78989; border-color: #f78989; } .vxe-button.type--button.theme--danger:not(.is--disabled):hover .vxe-button--icon.vxe-icon--zoomin { border-color: #f78989; } .vxe-button.type--button.theme--danger:not(.is--disabled):active { color: #fff; background-color: #f45e5e; border-color: #f45e5e; } .vxe-button.type--button.theme--danger:not(.is--disabled):active.vxe-icon--zoomin { background-color: #f45e5e; } .vxe-button.type--button.theme--danger:not(.is--disabled):active.vxe-icon--zoomout:after { background-color: #f45e5e; } .vxe-button.type--button.theme--danger.is--disabled { border-color: #fbcccc; background-color: #fbcccc; } .vxe-button.type--button.theme--danger.is--loading { border-color: #f56c6c; background-color: #f56c6c; } .vxe-button.type--button.theme--perfect { color: #606266; } .vxe-button.type--button.theme--perfect .vxe-button--icon.vxe-icon--zoomin { border-color: #606266; } .vxe-button.type--button.theme--perfect:not(.is--disabled) { border-color: #f8f8f9; background-color: #f8f8f9; } .vxe-button.type--button.theme--perfect:not(.is--disabled):hover { color: #606266; background-color: white; border-color: white; } .vxe-button.type--button.theme--perfect:not(.is--disabled):hover .vxe-button--icon.vxe-icon--zoomin { border-color: white; } .vxe-button.type--button.theme--perfect:not(.is--disabled):active { color: #606266; background-color: #f0f0f2; border-color: #f0f0f2; } .vxe-button.type--button.theme--perfect:not(.is--disabled):active.vxe-icon--zoomin { background-color: #f0f0f2; } .vxe-button.type--button.theme--perfect:not(.is--disabled):active.vxe-icon--zoomout:after { background-color: #f0f0f2; } .vxe-button.type--button.theme--perfect.is--disabled { border-color: white; background-color: white; } .vxe-button.type--button.theme--perfect.is--loading { border-color: #f8f8f9; background-color: #f8f8f9; } .vxe-button.size--medium { font-size: 14px; } .vxe-button.size--medium.type--button { height: 32px; } .vxe-button.size--medium.type--button.is--circle { min-width: 32px; } .vxe-button.size--medium.type--button.is--round { border-radius: 16px; } .vxe-button.size--medium .vxe-button--loading-icon, .vxe-button.size--medium .vxe-button--icon { min-width: 14px; } .vxe-button.size--small { font-size: 13px; } .vxe-button.size--small.type--button { height: 30px; } .vxe-button.size--small.type--button.is--circle { min-width: 30px; } .vxe-button.size--small.type--button.is--round { border-radius: 15px; } .vxe-button.size--small .vxe-button--loading-icon, .vxe-button.size--small .vxe-button--icon { min-width: 13px; } .vxe-button.size--mini { font-size: 12px; } .vxe-button.size--mini.type--button { height: 28px; } .vxe-button.size--mini.type--button.is--circle { min-width: 28px; } .vxe-button.size--mini.type--button.is--round { border-radius: 14px; } .vxe-button.size--mini .vxe-button--loading-icon, .vxe-button.size--mini .vxe-button--icon { min-width: 12px; } .vxe-input + .vxe-button, .vxe-input + .vxe-button--dropdown, .vxe-button + .vxe-button, .vxe-button + .vxe-button--dropdown { margin-left: 12px; } .vxe-button--loading-icon, .vxe-button--icon, .vxe-button--content { vertical-align: middle; } .vxe-button--loading-icon, .vxe-button--icon { min-width: 14px; } .vxe-button--loading-icon + .vxe-button--content, .vxe-button--icon + .vxe-button--content { margin-left: 4px; } .vxe-button--wrapper, .vxe-button--dropdown { display: inline-block; } .vxe-button--dropdown { position: relative; } .vxe-button--dropdown + .vxe-button, .vxe-button--dropdown + .vxe-button--dropdown { margin-left: 12px; } .vxe-button--dropdown > .vxe-button.type--button.theme--primary { color: #fff; } .vxe-button--dropdown > .vxe-button.type--button.theme--success { color: #fff; } .vxe-button--dropdown > .vxe-button.type--button.theme--info { color: #fff; } .vxe-button--dropdown > .vxe-button.type--button.theme--warning { color: #fff; } .vxe-button--dropdown > .vxe-button.type--button.theme--danger { color: #fff; } .vxe-button--dropdown > .vxe-button.type--button.theme--perfect { color: #606266; } .vxe-button--dropdown.is--active > .vxe-button:not(.is--disabled) { color: #5faeff; } .vxe-button--dropdown.is--active > .vxe-button.type--text.theme--primary { color: #73b8ff; } .vxe-button--dropdown.is--active > .vxe-button.type--text.theme--success { color: #85cf60; } .vxe-button--dropdown.is--active > .vxe-button.type--text.theme--info { color: #abadb1; } .vxe-button--dropdown.is--active > .vxe-button.type--text.theme--warning { color: #ecb869; } .vxe-button--dropdown.is--active > .vxe-button.type--text.theme--danger { color: #f89c9c; } .vxe-button--dropdown.is--active > .vxe-button.type--text.theme--perfect { color: white; } .vxe-button--dropdown.is--active > .vxe-button.type--button.theme--primary { color: #fff; background-color: #5faeff; border-color: #5faeff; } .vxe-button--dropdown.is--active > .vxe-button.type--button.theme--success { color: #fff; background-color: #79cb50; border-color: #79cb50; } .vxe-button--dropdown.is--active > .vxe-button.type--button.theme--info { color: #fff; background-color: #a0a3a8; border-color: #a0a3a8; } .vxe-button--dropdown.is--active > .vxe-button.type--button.theme--warning { color: #fff; background-color: #e9af57; border-color: #e9af57; } .vxe-button--dropdown.is--active > .vxe-button.type--button.theme--danger { color: #fff; background-color: #f78989; border-color: #f78989; } .vxe-button--dropdown.is--active > .vxe-button.type--button.theme--perfect { color: #606266; background-color: white; border-color: white; } .vxe-button--dropdown.is--active .vxe-button--dropdown-arrow { -webkit-transform: rotate(180deg); transform: rotate(180deg); } .vxe-button--dropdown-arrow { font-size: 12px; margin-left: 4px; -webkit-transition: -webkit-transform 0.2s ease-in-out; transition: -webkit-transform 0.2s ease-in-out; transition: transform 0.2s ease-in-out; transition: transform 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out; } .vxe-button--dropdown-panel { display: none; position: absolute; right: 0; padding: 4px 0; } .vxe-button--dropdown-panel.animat--leave { display: block; opacity: 0; -webkit-transform: scaleY(0.5); transform: scaleY(0.5); -webkit-transition: opacity 0.3s cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 0.3s cubic-bezier(0.23, 1, 0.32, 1); transition: opacity 0.3s cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 0.3s cubic-bezier(0.23, 1, 0.32, 1); transition: transform 0.3s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.3s cubic-bezier(0.23, 1, 0.32, 1); transition: transform 0.3s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.3s cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 0.3s cubic-bezier(0.23, 1, 0.32, 1); -webkit-transform-origin: center top; transform-origin: center top; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; } .vxe-button--dropdown-panel.animat--leave[placement="top"] { -webkit-transform-origin: center bottom; transform-origin: center bottom; } .vxe-button--dropdown-panel.animat--enter { opacity: 1; -webkit-transform: scaleY(1); transform: scaleY(1); } .vxe-button--dropdown-wrapper { padding: 5px; background-color: #fff; border-radius: 4px; border: 1px solid #dcdfe6; -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.2); box-shadow: 0 1px 6px rgba(0, 0, 0, 0.2); } .vxe-button--dropdown-wrapper > .vxe-button { margin: 2px 0; display: block; width: 100%; border: 0; } .vxe-button--dropdown-wrapper > .vxe-button.type--text { padding: 2px 8px; } .vxe-button--dropdown-wrapper > .vxe-button:first-child { margin-top: 0; } .vxe-button--dropdown-wrapper > .vxe-button:last-child { margin-bottom: 0; }