lixin-web
Version:
vue and bootstrap
738 lines (726 loc) • 17.6 kB
CSS
.el-button-group:before, .el-button-group:after{
display: table;
content: "";
}
.el-button-group:after{
clear: both;
}@charset "UTF-8";
:root{
/* Transition
-------------------------- */
/* Colors
-------------------------- */
/* Link
-------------------------- */
/* Border
-------------------------- */
/* Box-shadow
-------------------------- */
/* Fill
-------------------------- */
/* Font
-------------------------- */
/* Size
-------------------------- */
/* z-index
-------------------------- */
/* Disable base
-------------------------- */
/* Icon
-------------------------- */
/* Checkbox
-------------------------- */
/* Radio
-------------------------- */
/* Select
-------------------------- */
/* Alert
-------------------------- */
/* Message Box
-------------------------- */
/* Message
-------------------------- */
/* Notification
-------------------------- */
/* Input
-------------------------- */
/* Cascader
-------------------------- */
/* Group
-------------------------- */
/* Tab
-------------------------- */
/* Button
-------------------------- */
/* cascader
-------------------------- */
/* Switch
-------------------------- */
/* Dialog
-------------------------- */
/* Table
-------------------------- */
/* Pagination
-------------------------- */
/* Popover
-------------------------- */
/* Tooltip
-------------------------- */
/* Tag
-------------------------- */
/* Dropdown
-------------------------- */
/* Badge
-------------------------- */
/* Card
--------------------------*/
/* Slider
--------------------------*/
/* Steps
--------------------------*/
/* Menu
--------------------------*/
/* Rate
--------------------------*/
/* DatePicker
--------------------------*/
/* Loading
--------------------------*/
/* Scrollbar
--------------------------*/
/* Carousel
--------------------------*/
/* Collapse
--------------------------*/
/* Transfer
--------------------------*/
}
@charset "UTF-8";
:root{
/* Transition
-------------------------- */
/* Colors
-------------------------- */
/* Link
-------------------------- */
/* Border
-------------------------- */
/* Box-shadow
-------------------------- */
/* Fill
-------------------------- */
/* Font
-------------------------- */
/* Size
-------------------------- */
/* z-index
-------------------------- */
/* Disable base
-------------------------- */
/* Icon
-------------------------- */
/* Checkbox
-------------------------- */
/* Radio
-------------------------- */
/* Select
-------------------------- */
/* Alert
-------------------------- */
/* Message Box
-------------------------- */
/* Message
-------------------------- */
/* Notification
-------------------------- */
/* Input
-------------------------- */
/* Cascader
-------------------------- */
/* Group
-------------------------- */
/* Tab
-------------------------- */
/* Button
-------------------------- */
/* cascader
-------------------------- */
/* Switch
-------------------------- */
/* Dialog
-------------------------- */
/* Table
-------------------------- */
/* Pagination
-------------------------- */
/* Popover
-------------------------- */
/* Tooltip
-------------------------- */
/* Tag
-------------------------- */
/* Dropdown
-------------------------- */
/* Badge
-------------------------- */
/* Card
--------------------------*/
/* Slider
--------------------------*/
/* Steps
--------------------------*/
/* Menu
--------------------------*/
/* Rate
--------------------------*/
/* DatePicker
--------------------------*/
/* Loading
--------------------------*/
/* Scrollbar
--------------------------*/
/* Carousel
--------------------------*/
/* Collapse
--------------------------*/
/* Transfer
--------------------------*/
}
.el-button{
display: inline-block;
line-height: 1;
white-space: nowrap;
cursor: pointer;
background: #fff;
border: 1px solid #d5d5d5;
border-color: #c4c4c4;
color: rgb(31, 48, 61);
-webkit-appearance: none;
text-align: center;
box-sizing: border-box;
outline: none;
margin: 0;
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
padding: 8px 15px;
font-size: 14px;
border-radius: 4px;
}
.el-button + .el-button{
margin-left: 10px;
}
.el-button:hover, .el-button:focus{
color: #2ba7e7;
border-color: #2ba7e7;
}
.el-button:active{
color: rgb(39, 150, 208);
border-color: rgb(39, 150, 208);
outline: none;
}
.el-button::-moz-focus-inner{
border: 0;
}
.el-button [class*="el-icon-"]{}
.el-button [class*="el-icon-"] + span{
margin-left: 5px;
}
.el-button.is-loading{
position: relative;
pointer-events: none;
}
.el-button.is-loading:before{
pointer-events: none;
content: '';
position: absolute;
left: -1px;
top: -1px;
right: -1px;
bottom: -1px;
border-radius: inherit;
background-color: rgba(255,255,255,.35);
}
.el-button.is-disabled{}
.el-button.is-disabled, .el-button.is-disabled:hover, .el-button.is-disabled:focus{
color: #d5d5d5;
cursor: not-allowed;
background-image: none;
background-color: rgb(238, 242, 246);
border-color: rgb(209, 221, 229);
}
.el-button.is-disabled.el-button--text{
background-color: transparent;
}
.el-button.is-disabled.is-plain{}
.el-button.is-disabled.is-plain, .el-button.is-disabled.is-plain:hover, .el-button.is-disabled.is-plain:focus{
background-color: #fff;
border-color: rgb(209, 221, 229);
color: #d5d5d5;
}
.el-button.is-active{
color: rgb(39, 150, 208);
border-color: rgb(39, 150, 208);
}
.el-button.is-plain{}
.el-button.is-plain:hover, .el-button.is-plain:focus{
background: #fff;
border-color: #2ba7e7;
color: #2ba7e7;
}
.el-button.is-plain:active{
background: #fff;
border-color: rgb(39, 150, 208);
color: rgb(39, 150, 208);
outline: none;
}
.el-button--primary{
color: #fff;
background-color: #2ba7e7;
border-color: #2ba7e7;
}
.el-button--primary:hover, .el-button--primary:focus{
background: rgb(85, 185, 236);
border-color: rgb(85, 185, 236);
color: #fff;
}
.el-button--primary:active{
background: rgb(39, 150, 208);
border-color: rgb(39, 150, 208);
color: #fff;
outline: none;
}
.el-button--primary.is-active{
background: rgb(39, 150, 208);
border-color: rgb(39, 150, 208);
color: #fff;
}
.el-button--primary.is-plain{
background: #fff;
border: 1px solid #d5d5d5;
color: rgb(31, 48, 61);
}
.el-button--primary.is-plain:hover, .el-button--primary.is-plain:focus{
background: #fff;
border-color: #2ba7e7;
color: #2ba7e7;
}
.el-button--primary.is-plain:active{
background: #fff;
border-color: rgb(39, 150, 208);
color: rgb(39, 150, 208);
outline: none;
}
.el-button--success{
color: #fff;
background-color: #78d640;
border-color: #78d640;
}
.el-button--success:hover, .el-button--success:focus{
background: rgb(147, 222, 102);
border-color: rgb(147, 222, 102);
color: #fff;
}
.el-button--success:active{
background: rgb(108, 193, 58);
border-color: rgb(108, 193, 58);
color: #fff;
outline: none;
}
.el-button--success.is-active{
background: rgb(108, 193, 58);
border-color: rgb(108, 193, 58);
color: #fff;
}
.el-button--success.is-plain{
background: #fff;
border: 1px solid #d5d5d5;
color: rgb(31, 48, 61);
}
.el-button--success.is-plain:hover, .el-button--success.is-plain:focus{
background: #fff;
border-color: #78d640;
color: #78d640;
}
.el-button--success.is-plain:active{
background: #fff;
border-color: rgb(108, 193, 58);
color: rgb(108, 193, 58);
outline: none;
}
.el-button--warning{
color: #fff;
background-color: #64c4c9;
border-color: #64c4c9;
}
.el-button--warning:hover, .el-button--warning:focus{
background: rgb(131, 208, 212);
border-color: rgb(131, 208, 212);
color: #fff;
}
.el-button--warning:active{
background: rgb(90, 176, 181);
border-color: rgb(90, 176, 181);
color: #fff;
outline: none;
}
.el-button--warning.is-active{
background: rgb(90, 176, 181);
border-color: rgb(90, 176, 181);
color: #fff;
}
.el-button--warning.is-plain{
background: #fff;
border: 1px solid #d5d5d5;
color: rgb(31, 48, 61);
}
.el-button--warning.is-plain:hover, .el-button--warning.is-plain:focus{
background: #fff;
border-color: #64c4c9;
color: #64c4c9;
}
.el-button--warning.is-plain:active{
background: #fff;
border-color: rgb(90, 176, 181);
color: rgb(90, 176, 181);
outline: none;
}
.el-button--danger{
color: #fff;
background-color: #fe5307;
border-color: #fe5307;
}
.el-button--danger:hover, .el-button--danger:focus{
background: rgb(254, 117, 57);
border-color: rgb(254, 117, 57);
color: #fff;
}
.el-button--danger:active{
background: rgb(229, 75, 6);
border-color: rgb(229, 75, 6);
color: #fff;
outline: none;
}
.el-button--danger.is-active{
background: rgb(229, 75, 6);
border-color: rgb(229, 75, 6);
color: #fff;
}
.el-button--danger.is-plain{
background: #fff;
border: 1px solid #d5d5d5;
color: rgb(31, 48, 61);
}
.el-button--danger.is-plain:hover, .el-button--danger.is-plain:focus{
background: #fff;
border-color: #fe5307;
color: #fe5307;
}
.el-button--danger.is-plain:active{
background: #fff;
border-color: rgb(229, 75, 6);
color: rgb(229, 75, 6);
outline: none;
}
.el-button--info{
color: #fff;
background-color: #d7a1e9;
border-color: #d7a1e9;
}
.el-button--info:hover, .el-button--info:focus{
background: rgb(223, 180, 237);
border-color: rgb(223, 180, 237);
color: #fff;
}
.el-button--info:active{
background: rgb(194, 145, 210);
border-color: rgb(194, 145, 210);
color: #fff;
outline: none;
}
.el-button--info.is-active{
background: rgb(194, 145, 210);
border-color: rgb(194, 145, 210);
color: #fff;
}
.el-button--info.is-plain{
background: #fff;
border: 1px solid #d5d5d5;
color: rgb(31, 48, 61);
}
.el-button--info.is-plain:hover, .el-button--info.is-plain:focus{
background: #fff;
border-color: #d7a1e9;
color: #d7a1e9;
}
.el-button--info.is-plain:active{
background: #fff;
border-color: rgb(194, 145, 210);
color: rgb(194, 145, 210);
outline: none;
}
.el-button--large{
padding: 11px 19px;
font-size: 16px;
border-radius: 4px;
}
.el-button--small{
padding: 7px 9px;
font-size: 12px;
border-radius: 4px;
}
.el-button--mini{
padding: 4px 4px;
font-size: 12px;
border-radius: 4px;
}
.el-button--text{
border: none;
color: #2ba7e7;
background: transparent;
padding-left: 0;
padding-right: 0;
}
.el-button--text:hover, .el-button--text:focus{
color: rgb(85, 185, 236);
}
.el-button--text:active{
color: rgb(39, 150, 208);
}
.el-button-group{
display: inline-block;
vertical-align: middle;
}
.el-button-group .el-button--primary{}
.el-button-group .el-button--primary:first-child{
border-right-color: rgba(255, 255, 255, 0.5);
}
.el-button-group .el-button--primary:last-child{
border-left-color: rgba(255, 255, 255, 0.5);
}
.el-button-group .el-button--primary:not(:first-child):not(:last-child){
border-left-color: rgba(255, 255, 255, 0.5);
border-right-color: rgba(255, 255, 255, 0.5);
}
.el-button-group .el-button--success{}
.el-button-group .el-button--success:first-child{
border-right-color: rgba(255, 255, 255, 0.5);
}
.el-button-group .el-button--success:last-child{
border-left-color: rgba(255, 255, 255, 0.5);
}
.el-button-group .el-button--success:not(:first-child):not(:last-child){
border-left-color: rgba(255, 255, 255, 0.5);
border-right-color: rgba(255, 255, 255, 0.5);
}
.el-button-group .el-button--warning{}
.el-button-group .el-button--warning:first-child{
border-right-color: rgba(255, 255, 255, 0.5);
}
.el-button-group .el-button--warning:last-child{
border-left-color: rgba(255, 255, 255, 0.5);
}
.el-button-group .el-button--warning:not(:first-child):not(:last-child){
border-left-color: rgba(255, 255, 255, 0.5);
border-right-color: rgba(255, 255, 255, 0.5);
}
.el-button-group .el-button--danger{}
.el-button-group .el-button--danger:first-child{
border-right-color: rgba(255, 255, 255, 0.5);
}
.el-button-group .el-button--danger:last-child{
border-left-color: rgba(255, 255, 255, 0.5);
}
.el-button-group .el-button--danger:not(:first-child):not(:last-child){
border-left-color: rgba(255, 255, 255, 0.5);
border-right-color: rgba(255, 255, 255, 0.5);
}
.el-button-group .el-button--info{}
.el-button-group .el-button--info:first-child{
border-right-color: rgba(255, 255, 255, 0.5);
}
.el-button-group .el-button--info:last-child{
border-left-color: rgba(255, 255, 255, 0.5);
}
.el-button-group .el-button--info:not(:first-child):not(:last-child){
border-left-color: rgba(255, 255, 255, 0.5);
border-right-color: rgba(255, 255, 255, 0.5);
}
.el-button-group .el-button{
float: left;
position: relative;
}
.el-button-group .el-button + .el-button{
margin-left: 0;
}
.el-button-group .el-button:first-child{
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
.el-button-group .el-button:last-child{
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.el-button-group .el-button:not(:first-child):not(:last-child){
border-radius: 0;
}
.el-button-group .el-button:not(:last-child){
margin-right: -1px;
}
.el-button-group .el-button:hover, .el-button-group .el-button:focus, .el-button-group .el-button:active{
z-index: 1;
}
.el-button-group .el-button.is-active{
z-index: 1;
}
.el-dropdown{
display: inline-block;
position: relative;
color: rgb(72, 90, 106);
font-size: 14px;
}
.el-dropdown .el-button-group{
display: block;
}
.el-dropdown .el-button-group .el-button{
float: none;
}
.el-dropdown .el-dropdown__caret-button{
padding-right: 5px;
padding-left: 5px;
}
.el-dropdown .el-dropdown__caret-button .el-dropdown__icon{
padding-left: 0;
}
.el-dropdown__icon{
font-size: 12px;
margin: 0 3px;
}
.el-dropdown-menu{
margin: 5px 0;
background-color: #fff;
border: 1px solid rgb(209, 221, 229);
box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .12);
padding: 6px 0;
z-index: 10;
position: absolute;
top: 0;
left: 0;
min-width: 100px;
}
.el-dropdown-menu__item{
list-style: none;
line-height: 36px;
padding: 0 10px;
margin: 0;
cursor: pointer;
}
.el-dropdown-menu__item:not(.is-disabled):hover{
background-color: #eff8f9;
color: #2ba7e7;
}
.el-dropdown-menu__item.is-disabled{
cursor: default;
color: #d5d5d5;
pointer-events: none;
}
.el-dropdown-menu__item--divided{
position: relative;
margin-top: 6px;
border-top: 1px solid rgb(209, 221, 229);
}
.el-dropdown-menu__item--divided:before{
content: '';
height: 6px;
display: block;
margin: 0 -10px;
background-color: #fff;
}
:root{
/* Transition
-------------------------- */
/* Colors
-------------------------- */
/* Link
-------------------------- */
/* Border
-------------------------- */
/* Box-shadow
-------------------------- */
/* Fill
-------------------------- */
/* Font
-------------------------- */
/* Size
-------------------------- */
/* z-index
-------------------------- */
/* Disable base
-------------------------- */
/* Icon
-------------------------- */
/* Checkbox
-------------------------- */
/* Radio
-------------------------- */
/* Select
-------------------------- */
/* Alert
-------------------------- */
/* Message Box
-------------------------- */
/* Message
-------------------------- */
/* Notification
-------------------------- */
/* Input
-------------------------- */
/* Cascader
-------------------------- */
/* Group
-------------------------- */
/* Tab
-------------------------- */
/* Button
-------------------------- */
/* cascader
-------------------------- */
/* Switch
-------------------------- */
/* Dialog
-------------------------- */
/* Table
-------------------------- */
/* Pagination
-------------------------- */
/* Popover
-------------------------- */
/* Tooltip
-------------------------- */
/* Tag
-------------------------- */
/* Dropdown
-------------------------- */
/* Badge
-------------------------- */
/* Card
--------------------------*/
/* Slider
--------------------------*/
/* Steps
--------------------------*/
/* Steps
--------------------------*/
/* Rate
--------------------------*/
/* DatePicker
--------------------------*/
/* Loading
--------------------------*/
/* Scrollbar
--------------------------*/
/* Carousel
--------------------------*/
/* Collapse
--------------------------*/
}