gg-y-ui/lib/button/style/style.css

An enterprise-class UI design language and Vue-based implementation for web

.y-button{font-size:13px;line-height:18px;padding:7px 15px;border:1px solid #e6ebee;border-radius:4px;background-color:transparent;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;outline:0;user-select:none}.y-button-default{color:#1d1d1d;border-color:#e6ebee}.y-button-default:hover:not(.y-button-disabled):not(.y-button-loading){border-color:rgba(244,246,250,0);background-color:#f4f6fa}.y-button-default:active:not(.y-button-disabled):not(.y-button-loading){border-color:#f1f4f9;background-color:#f1f4f9}.y-button-primary{color:#fff;border-color:#4598f0;background-color:#4598f0}.y-button-primary:hover:not(.y-button-disabled):not(.y-button-loading){border-color:rgba(69,152,240,0);background-color:rgba(69,152,240,.8)}.y-button-primary:active:not(.y-button-disabled):not(.y-button-loading){border-color:#418cdb;background-color:#418cdb}.y-button-minor{color:#4598f0;border-color:#4598f0}.y-button-minor:hover:not(.y-button-disabled):not(.y-button-loading){background-color:rgba(69,152,240,.1)}.y-button-minor:active:not(.y-button-disabled):not(.y-button-loading){background-color:rgba(69,152,240,.2)}.y-button-danger{color:#fff;border-color:#ea5e56;background-color:#ea5e56}.y-button-danger:hover:not(.y-button-disabled):not(.y-button-loading){border-color:rgba(234,94,86,0);background-color:rgba(234,94,86,.8)}.y-button-danger:active:not(.y-button-disabled):not(.y-button-loading){border-color:#dd4e45;background-color:#dd4e45}.y-button-link{color:#4598f0;border-color:transparent}.y-button-link:hover:not(.y-button-disabled):not(.y-button-loading){opacity:.8}.y-button-link:active:not(.y-button-disabled):not(.y-button-loading){opacity:1}.y-button-plain{color:#1d1d1d;border-color:transparent}.y-button-plain:hover:not(.y-button-disabled):not(.y-button-loading){color:#ea5e56}.y-button-plain:active:not(.y-button-disabled):not(.y-button-loading){color:#dd4e45}.y-button-icon-only{min-width:48px}.y-button-small{font-size:12px;line-height:16px;padding:3px 7px;min-width:64px}.y-button-block{display:flex;width:100%}.y-button-loading{opacity:.5;cursor:default}.y-button-disabled{opacity:.5;cursor:not-allowed}.y-button>.y-icon+span,.y-button>span+.y-icon{margin-left:4px}.y-button>i{line-height:1}