| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169 |
- .pear-btn {
- display: inline-block;
- line-height: 38px;
- white-space: nowrap;
- cursor: pointer;
- text-align: center;
- box-sizing: border-box;
- outline: none;
- transition: 0.1s;
- font-weight: 500;
- padding: 0 18px;
- height: 38px;
- font-size: 14px;
- background-color: white;
- border: 1px solid #dcdfe6;
- border-radius: 2px;
- }
- .pear-btn i {
- font-size: 13px;
- }
- .pear-btn:hover {
- opacity: .8;
- filter: alpha(opacity=80);
- color: #409eff;
- background-color: #ECF5FF;
- }
- .pear-btn-danger,
- .pear-btn-warming,
- .pear-btn-success,
- .pear-btn-primary {
- height: 37px;
- line-height: 37px;
- color: #fff !important
- }
- /** Button 主题 */
- .pear-btn-primary {
- border: 1px solid #2D8CF0;
- background-color: #2D8CF0 !important;
- }
- .pear-btn-danger {
- border: 1px solid #f56c6c;
- background-color: #f56c6c !important;
- }
- .pear-btn-warming {
- border: 1px solid #f6ad55;
- background-color: #f6ad55 !important;
- }
- .pear-btn-success {
- border: 1px solid #36b368;
- background-color: #36b368 !important;
- }
- .pear-btn[round] {
- border-radius: 50px;
- }
- .pear-btn-primary[plain] {
- color: #409eff !important;
- background: #ecf5ff 10% !important;
- }
- .pear-btn-primary[plain]:hover {
- color: #fff !important;
- background-color: #2d8cf0!important
- }
- .pear-btn-success[plain] {
- color: #36b368 !important;
- background: #f0f9eb !important;
- }
- .pear-btn-success[plain]:hover {
- color: white !important;
- background-color: #36b368 !important
- }
- .pear-btn-warming[plain] {
- color: #e6a23c !important;
- background: #fdf6ec !important;
- }
- .pear-btn-warming[plain]:hover {
- color: white !important;
- background-color: #e6a23c !important
- }
- .pear-btn-danger[plain] {
- color: #f56c6c !important;
- background: #fef0f0 !important;
- }
- .pear-btn-danger[plain]:hover {
- color: white !important;
- background-color: #f56c6c !important
- }
- /** Button Group */
- .pear-btn-group {
- display: inline-block;
- vertical-align: middle;
- }
- .pear-btn-group .pear-btn {
- float: left;
- position: relative;
- border-radius: 0px;
- margin-left: 1px;
- margin-right: 1px;
- }
- .pear-btn-md {
- height: 34px;
- line-height: 34px;
- padding: 0 10px;
- font-size: 12.5px;
- }
- .pear-btn-group .pear-btn:first-child {
- border-top-left-radius: 4px !important;
- border-bottom-left-radius: 4px !important;
- }
- .pear-btn-group .pear-btn:last-child {
- border-top-right-radius: 4px !important;
- border-bottom-right-radius: 4px !important;
- }
- .pear-btn-group .pear-btn[round]:first-child {
- border-top-left-radius: 50px !important;
- border-bottom-left-radius: 50px !important;
- }
- .pear-btn-group .pear-btn[round]:last-child {
- border-top-right-radius: 50px !important;
- border-bottom-right-radius: 50px !important;
- }
- /** Button Size*/
- .pear-btn-sm {
- height: 32px;
- line-height: 32px;
- padding: 0 10px;
- font-size: 12px;
- }
- .pear-btn-xs {
- height: 28px;
- line-height: 28px;
- padding: 0 8px;
- font-size: 12px;
- }
- .pear-btn-md {
- height: 34px;
- line-height: 34px;
- padding: 0 10px;
- font-size: 12.5px;
- }
- .pear-btn-lg {
- height: 44px;
- line-height: 44px;
- padding: 0 25px;
- font-size: 16px;
- }
|