UNPKG

@syncfusion/ej2-buttons

Version:

A package of feature-rich Essential JS 2 components such as Button, CheckBox, RadioButton and Switch.

1,464 lines (1,436 loc) 38.3 kB
.e-btn, .e-css.e-btn { /* stylelint-disable property-no-vendor-prefix */ -webkit-font-smoothing: antialiased; border: 1px solid; border-radius: 0; -webkit-box-sizing: border-box; box-sizing: border-box; cursor: pointer; display: inline-block; font-family: "Segoe UI", "GeezaPro", "DejaVu Serif", sans-serif, "-apple-system", "BlinkMacSystemFont"; font-size: 14px; font-weight: 600; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; line-height: 1.8572em; outline: none; padding: 2px 20px; text-align: center; text-decoration: none; text-transform: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; vertical-align: middle; white-space: nowrap; } .e-btn:disabled, .e-css.e-btn:disabled { cursor: default; } .e-btn:hover, .e-btn:focus, .e-css.e-btn:hover, .e-css.e-btn:focus { text-decoration: none; } .e-btn::-moz-focus-inner, .e-css.e-btn::-moz-focus-inner { border: 0; padding: 0; } .e-btn .e-btn-icon, .e-css.e-btn .e-btn-icon { display: inline-block; font-size: 14px; margin-top: -3px; vertical-align: middle; width: 1em; } .e-btn .e-btn-icon.e-icon-left, .e-css.e-btn .e-btn-icon.e-icon-left { margin-left: -0.5714em; width: 1.929em; } .e-btn .e-btn-icon.e-icon-right, .e-css.e-btn .e-btn-icon.e-icon-right { width: 1.929em; margin-right: -0.5714em; } .e-btn .e-btn-icon.e-icon-top, .e-css.e-btn .e-btn-icon.e-icon-top { padding-bottom: 8px; display: block; margin-top: 0; width: auto; } .e-btn .e-btn-icon.e-icon-bottom, .e-css.e-btn .e-btn-icon.e-icon-bottom { padding-top: 8px; display: block; margin-top: 0; width: auto; } .e-btn.e-icon-btn, .e-css.e-btn.e-icon-btn { padding: 2px 8px; } .e-btn.e-top-icon-btn, .e-btn.e-bottom-icon-btn, .e-css.e-btn.e-top-icon-btn, .e-css.e-btn.e-bottom-icon-btn { line-height: 1; padding: 8px 20px; } .e-btn.e-round, .e-css.e-btn.e-round { border-radius: 50%; height: 2.57143em; line-height: 1; padding: 0; width: 2.57143em; } .e-btn.e-round .e-btn-icon, .e-css.e-btn.e-round .e-btn-icon { font-size: 16px; line-height: 2.125em; margin-top: 0; width: auto; } .e-btn.e-rtl .e-icon-right, .e-css.e-btn.e-rtl .e-icon-right { margin-left: -0.5714em; margin-right: 0; } .e-btn.e-rtl .e-icon-left, .e-css.e-btn.e-rtl .e-icon-left { margin-left: 0; margin-right: -0.5714em; } .e-btn.e-flat, .e-css.e-btn.e-flat { border: 1px solid; } .e-btn.e-small, .e-css.e-btn.e-small { font-size: 12px; line-height: 1.5em; padding: 3px 16px; } .e-btn.e-small .e-btn-icon, .e-css.e-btn.e-small .e-btn-icon { font-size: 11px; width: 0.91em; } .e-btn.e-small .e-btn-icon.e-icon-left, .e-css.e-btn.e-small .e-btn-icon.e-icon-left { margin-left: -0.7273em; width: 2.182em; } .e-btn.e-small .e-btn-icon.e-icon-right, .e-css.e-btn.e-small .e-btn-icon.e-icon-right { margin-right: -0.7273em; width: 2.182em; } .e-btn.e-small .e-btn-icon.e-icon-top, .e-css.e-btn.e-small .e-btn-icon.e-icon-top { padding-bottom: 6px; width: auto; } .e-btn.e-small .e-btn-icon.e-icon-bottom, .e-css.e-btn.e-small .e-btn-icon.e-icon-bottom { padding-top: 6px; width: auto; } .e-btn.e-small.e-icon-btn, .e-css.e-btn.e-small.e-icon-btn { padding: 3px 6px; } .e-btn.e-small.e-top-icon-btn, .e-btn.e-small.e-bottom-icon-btn, .e-css.e-btn.e-small.e-top-icon-btn, .e-css.e-btn.e-small.e-bottom-icon-btn { line-height: 1; padding: 8px 20px; } .e-btn.e-small.e-round, .e-css.e-btn.e-small.e-round { height: 2.5em; line-height: 1; padding: 0; width: 2.5em; } .e-btn.e-small.e-round .e-btn-icon, .e-css.e-btn.e-small.e-round .e-btn-icon { font-size: 14px; line-height: 2em; width: auto; } .e-btn.e-small.e-rtl .e-icon-right, .e-css.e-btn.e-small.e-rtl .e-icon-right { margin-left: -0.7273em; margin-right: 0; } .e-btn.e-small.e-rtl .e-icon-left, .e-css.e-btn.e-small.e-rtl .e-icon-left { margin-left: 0; margin-right: -0.7273em; } .e-btn.e-block, .e-css.e-btn.e-block { display: block; width: 100%; } .e-small .e-btn, .e-small.e-btn, .e-small .e-css.e-btn, .e-small.e-css.e-btn { font-size: 12px; line-height: 1.5em; padding: 3px 16px; } .e-small .e-btn .e-btn-icon, .e-small.e-btn .e-btn-icon, .e-small .e-css.e-btn .e-btn-icon, .e-small.e-css.e-btn .e-btn-icon { font-size: 11px; width: 0.91em; } .e-small .e-btn .e-btn-icon.e-icon-left, .e-small.e-btn .e-btn-icon.e-icon-left, .e-small .e-css.e-btn .e-btn-icon.e-icon-left, .e-small.e-css.e-btn .e-btn-icon.e-icon-left { margin-left: -0.7273em; width: 2.182em; } .e-small .e-btn .e-btn-icon.e-icon-right, .e-small.e-btn .e-btn-icon.e-icon-right, .e-small .e-css.e-btn .e-btn-icon.e-icon-right, .e-small.e-css.e-btn .e-btn-icon.e-icon-right { margin-right: -0.7273em; width: 2.182em; } .e-small .e-btn .e-btn-icon.e-icon-top, .e-small.e-btn .e-btn-icon.e-icon-top, .e-small .e-css.e-btn .e-btn-icon.e-icon-top, .e-small.e-css.e-btn .e-btn-icon.e-icon-top { padding-bottom: 6px; width: auto; } .e-small .e-btn .e-btn-icon.e-icon-bottom, .e-small.e-btn .e-btn-icon.e-icon-bottom, .e-small .e-css.e-btn .e-btn-icon.e-icon-bottom, .e-small.e-css.e-btn .e-btn-icon.e-icon-bottom { padding-top: 6px; width: auto; } .e-small .e-btn.e-icon-btn, .e-small.e-btn.e-icon-btn, .e-small .e-css.e-btn.e-icon-btn, .e-small.e-css.e-btn.e-icon-btn { padding: 3px 6px; } .e-small .e-btn.e-top-icon-btn, .e-small .e-btn.e-bottom-icon-btn, .e-small.e-btn.e-top-icon-btn, .e-small.e-btn.e-bottom-icon-btn, .e-small .e-css.e-btn.e-top-icon-btn, .e-small .e-css.e-btn.e-bottom-icon-btn, .e-small.e-css.e-btn.e-top-icon-btn, .e-small.e-css.e-btn.e-bottom-icon-btn { line-height: 1; padding: 8px 20px; } .e-small .e-btn.e-round, .e-small.e-btn.e-round, .e-small .e-css.e-btn.e-round, .e-small.e-css.e-btn.e-round { height: 2.5em; line-height: 1; padding: 0; width: 2.5em; border-radius: 50%; } .e-small .e-btn.e-round .e-btn-icon, .e-small.e-btn.e-round .e-btn-icon, .e-small .e-css.e-btn.e-round .e-btn-icon, .e-small.e-css.e-btn.e-round .e-btn-icon { font-size: 14px; line-height: 2em; width: auto; } .e-small .e-btn.e-rtl .e-icon-right, .e-small.e-btn.e-rtl .e-icon-right, .e-small .e-css.e-btn.e-rtl .e-icon-right, .e-small.e-css.e-btn.e-rtl .e-icon-right { margin-left: -0.7273em; margin-right: 0; } .e-small .e-btn.e-rtl .e-icon-left, .e-small.e-btn.e-rtl .e-icon-left, .e-small .e-css.e-btn.e-rtl .e-icon-left, .e-small.e-css.e-btn.e-rtl .e-icon-left { margin-left: 0; margin-right: -0.7273em; } /* stylelint-disable property-no-vendor-prefix */ .e-btn, .e-css.e-btn { -webkit-tap-highlight-color: transparent; background: #f4f4f4; border-color: #f4f4f4; -webkit-box-shadow: none; box-shadow: none; color: #333; -webkit-transition: -webkit-box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1); transition: -webkit-box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1); transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1); transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1); } .e-btn:hover, .e-css.e-btn:hover { background: #eaeaea; border-color: #eaeaea; -webkit-box-shadow: none; box-shadow: none; color: #000; } .e-btn:focus, .e-css.e-btn:focus { background: #f4f4f4; border-color: #eaeaea; color: #333; outline: #767676 1px solid; outline-offset: 0; -webkit-box-shadow: none; box-shadow: none; } .e-btn:active, .e-css.e-btn:active { background: #c8c8c8; border-color: #c8c8c8; color: #000; outline: #eaeaea 0 solid; outline-offset: 0; } .e-btn.e-active, .e-css.e-btn.e-active { background: #c8c8c8; border-color: #c8c8c8; -webkit-box-shadow: none; box-shadow: none; color: #000; } .e-btn:disabled, .e-btn.e-disabled, .e-css.e-btn:disabled, .e-css.e-btn.e-disabled { background: #f4f4f4; border-color: #f4f4f4; -webkit-box-shadow: none; box-shadow: none; color: #a6a6a6; } .e-btn .e-ripple-element, .e-css.e-btn .e-ripple-element { background: transparent; } .e-btn.e-round, .e-btn.e-round-edge, .e-css.e-btn.e-round, .e-css.e-btn.e-round-edge { background: #f4f4f4; border-color: #f4f4f4; color: #333; } .e-btn.e-round:hover, .e-btn.e-round-edge:hover, .e-css.e-btn.e-round:hover, .e-css.e-btn.e-round-edge:hover { background: #eaeaea; border-color: #eaeaea; color: #000; } .e-btn.e-round:focus, .e-btn.e-round-edge:focus, .e-css.e-btn.e-round:focus, .e-css.e-btn.e-round-edge:focus { background: #f4f4f4; border-color: #eaeaea; -webkit-box-shadow: none; box-shadow: none; color: #333; outline: none; outline-offset: 0; } .e-btn.e-round:active, .e-btn.e-round-edge:active, .e-css.e-btn.e-round:active, .e-css.e-btn.e-round-edge:active { background: #c8c8c8; border-color: #c8c8c8; -webkit-box-shadow: none; box-shadow: none; color: #000; outline: #eaeaea 0 solid; outline-offset: 0; } .e-btn.e-round:disabled, .e-btn.e-round.e-disabled, .e-btn.e-round-edge:disabled, .e-btn.e-round-edge.e-disabled, .e-css.e-btn.e-round:disabled, .e-css.e-btn.e-round.e-disabled, .e-css.e-btn.e-round-edge:disabled, .e-css.e-btn.e-round-edge.e-disabled { background: #f4f4f4; border-color: #f4f4f4; -webkit-box-shadow: none; box-shadow: none; color: #a6a6a6; } .e-btn.e-round.e-primary:hover, .e-btn.e-round-edge.e-primary:hover, .e-css.e-btn.e-round.e-primary:hover, .e-css.e-btn.e-round-edge.e-primary:hover { border-color: #0078d6; } .e-btn.e-round.e-primary:focus, .e-btn.e-round-edge.e-primary:focus, .e-css.e-btn.e-round.e-primary:focus, .e-css.e-btn.e-round-edge.e-primary:focus { outline: none; } .e-btn.e-round.e-success:hover, .e-btn.e-round-edge.e-success:hover, .e-css.e-btn.e-round.e-success:hover, .e-css.e-btn.e-round-edge.e-success:hover { border-color: #137c10; } .e-btn.e-round.e-success:focus, .e-btn.e-round-edge.e-success:focus, .e-css.e-btn.e-round.e-success:focus, .e-css.e-btn.e-round-edge.e-success:focus { outline: none; } .e-btn.e-round.e-info:hover, .e-btn.e-round-edge.e-info:hover, .e-css.e-btn.e-round.e-info:hover, .e-css.e-btn.e-round-edge.e-info:hover { border-color: #0378d5; } .e-btn.e-round.e-info:focus, .e-btn.e-round-edge.e-info:focus, .e-css.e-btn.e-round.e-info:focus, .e-css.e-btn.e-round-edge.e-info:focus { outline: none; } .e-btn.e-round.e-warning:hover, .e-btn.e-round-edge.e-warning:hover, .e-css.e-btn.e-round.e-warning:hover, .e-css.e-btn.e-round-edge.e-warning:hover { border-color: #d83b01; } .e-btn.e-round.e-warning:focus, .e-btn.e-round-edge.e-warning:focus, .e-css.e-btn.e-round.e-warning:focus, .e-css.e-btn.e-round-edge.e-warning:focus { outline: none; } .e-btn.e-round.e-danger:hover, .e-btn.e-round-edge.e-danger:hover, .e-css.e-btn.e-round.e-danger:hover, .e-css.e-btn.e-round-edge.e-danger:hover { border-color: #a80000; } .e-btn.e-round.e-danger:focus, .e-btn.e-round-edge.e-danger:focus, .e-css.e-btn.e-round.e-danger:focus, .e-css.e-btn.e-round-edge.e-danger:focus { outline: none; } .e-btn.e-primary, .e-css.e-btn.e-primary { background: #0078d6; border-color: #0078d6; color: #fff; } .e-btn.e-primary:hover, .e-css.e-btn.e-primary:hover { background: rgb(0, 111.4205607477, 198.7); border-color: rgb(0, 111.4205607477, 198.7); -webkit-box-shadow: none; box-shadow: none; color: #fff; } .e-btn.e-primary:focus, .e-css.e-btn.e-primary:focus { background: #0078d6; border-color: #fff; color: #fff; outline: #767676 1px solid; -webkit-box-shadow: none; box-shadow: none; } .e-btn.e-primary:active, .e-css.e-btn.e-primary:active { background: rgb(0, 91.4018691589, 163); border-color: rgb(0, 91.4018691589, 163); color: #fff; outline: #eaeaea 0 solid; -webkit-box-shadow: none; box-shadow: none; } .e-btn.e-primary.e-active, .e-css.e-btn.e-primary.e-active { background: rgb(0, 91.4018691589, 163); border-color: rgb(0, 91.4018691589, 163); -webkit-box-shadow: none; box-shadow: none; color: #fff; } .e-btn.e-primary:disabled, .e-btn.e-primary.e-disabled, .e-css.e-btn.e-primary:disabled, .e-css.e-btn.e-primary.e-disabled { background: #f4f4f4; border-color: #f4f4f4; -webkit-box-shadow: none; box-shadow: none; color: #a6a6a6; } .e-btn.e-primary .e-ripple-element, .e-css.e-btn.e-primary .e-ripple-element { background: transparent; } .e-btn.e-success, .e-css.e-btn.e-success { background: #137c10; border-color: #137c10; color: #fff; } .e-btn.e-success:hover, .e-css.e-btn.e-success:hover { background: #146511; border-color: #146511; -webkit-box-shadow: none; box-shadow: none; color: #fff; } .e-btn.e-success:focus, .e-css.e-btn.e-success:focus { background: #137c10; border-color: #fff; color: #fff; -webkit-box-shadow: none; box-shadow: none; } .e-btn.e-success:active, .e-btn.e-success.e-active, .e-css.e-btn.e-success:active, .e-css.e-btn.e-success.e-active { background: #004b1d; border-color: #004b1d; color: #fff; -webkit-box-shadow: none; box-shadow: none; } .e-btn.e-success:disabled, .e-btn.e-success.e-disabled, .e-css.e-btn.e-success:disabled, .e-css.e-btn.e-success.e-disabled { background: #f4f4f4; border-color: #f4f4f4; -webkit-box-shadow: none; box-shadow: none; color: #a6a6a6; } .e-btn.e-success .e-ripple-element, .e-css.e-btn.e-success .e-ripple-element { background: transparent; } .e-btn.e-info, .e-css.e-btn.e-info { background: #0378d5; border-color: #0378d5; color: #fff; } .e-btn.e-info:hover, .e-css.e-btn.e-info:hover { background: #016cc0; border-color: #016cc0; -webkit-box-shadow: none; box-shadow: none; color: #fff; } .e-btn.e-info:focus, .e-css.e-btn.e-info:focus { background: #0378d5; border-color: #fff; color: #fff; -webkit-box-shadow: none; box-shadow: none; } .e-btn.e-info:active, .e-btn.e-info.e-active, .e-css.e-btn.e-info:active, .e-css.e-btn.e-info.e-active { background: #065fa6; color: #fff; border-color: #065fa6; -webkit-box-shadow: none; box-shadow: none; } .e-btn.e-info:disabled, .e-btn.e-info.e-disabled, .e-css.e-btn.e-info:disabled, .e-css.e-btn.e-info.e-disabled { background: #f4f4f4; border-color: #f4f4f4; -webkit-box-shadow: none; box-shadow: none; color: #a6a6a6; } .e-btn.e-info .e-ripple-element, .e-css.e-btn.e-info .e-ripple-element { background: transparent; } .e-btn.e-warning, .e-css.e-btn.e-warning { background: #d83b01; border-color: #d83b01; color: #fff; } .e-btn.e-warning:hover, .e-css.e-btn.e-warning:hover { background: #c73702; border-color: #c73702; -webkit-box-shadow: none; box-shadow: none; color: #fff; } .e-btn.e-warning:focus, .e-css.e-btn.e-warning:focus { background: #d83b01; border-color: #fff; color: #fff; -webkit-box-shadow: none; box-shadow: none; } .e-btn.e-warning:active, .e-btn.e-warning.e-active, .e-css.e-btn.e-warning:active, .e-css.e-btn.e-warning.e-active { background: #a22c01; border-color: #a22c01; color: #fff; -webkit-box-shadow: none; box-shadow: none; } .e-btn.e-warning:disabled, .e-btn.e-warning.e-disabled, .e-css.e-btn.e-warning:disabled, .e-css.e-btn.e-warning.e-disabled { background: #f4f4f4; border-color: #f4f4f4; -webkit-box-shadow: none; box-shadow: none; color: #a6a6a6; } .e-btn.e-warning .e-ripple-element, .e-css.e-btn.e-warning .e-ripple-element { background: transparent; } .e-btn.e-danger, .e-css.e-btn.e-danger { background: #a80000; border-color: #a80000; color: #fff; } .e-btn.e-danger:hover, .e-css.e-btn.e-danger:hover { background: #930000; border-color: #930000; -webkit-box-shadow: none; box-shadow: none; color: #fff; } .e-btn.e-danger:focus, .e-css.e-btn.e-danger:focus { background: #a80000; border-color: #fff; color: #fff; -webkit-box-shadow: none; box-shadow: none; } .e-btn.e-danger:active, .e-css.e-btn.e-danger:active { background: #7c0101; border-color: #7c0101; color: #fff; -webkit-box-shadow: none; box-shadow: none; } .e-btn.e-danger.e-active, .e-css.e-btn.e-danger.e-active { background: #7c0101; border-color: #7c0101; -webkit-box-shadow: none; box-shadow: none; color: #fff; } .e-btn.e-danger:disabled, .e-btn.e-danger.e-disabled, .e-css.e-btn.e-danger:disabled, .e-css.e-btn.e-danger.e-disabled { background: #f4f4f4; border-color: #f4f4f4; -webkit-box-shadow: none; box-shadow: none; color: #a6a6a6; } .e-btn.e-danger .e-ripple-element, .e-css.e-btn.e-danger .e-ripple-element { background: transparent; } .e-btn.e-flat, .e-css.e-btn.e-flat { background: #f4f4f4; border-color: #f4f4f4; -webkit-box-shadow: none; box-shadow: none; color: #333; } .e-btn.e-flat:hover, .e-css.e-btn.e-flat:hover { background: #eaeaea; border-color: #eaeaea; -webkit-box-shadow: none; box-shadow: none; color: #000; } .e-btn.e-flat:focus, .e-css.e-btn.e-flat:focus { background: #eaeaea; border-color: #eaeaea; color: #333; -webkit-box-shadow: none; box-shadow: none; } .e-btn.e-flat:active, .e-btn.e-flat.e-active, .e-css.e-btn.e-flat:active, .e-css.e-btn.e-flat.e-active { background: #c8c8c8; border-color: #c8c8c8; color: #000; -webkit-box-shadow: none; box-shadow: none; } .e-btn.e-flat:disabled, .e-btn.e-flat.e-disabled, .e-css.e-btn.e-flat:disabled, .e-css.e-btn.e-flat.e-disabled { background: #f4f4f4; border-color: #f4f4f4; -webkit-box-shadow: none; box-shadow: none; color: #a6a6a6; } .e-btn.e-flat .e-ripple-element, .e-css.e-btn.e-flat .e-ripple-element { background: transparent; } .e-btn.e-flat.e-primary, .e-css.e-btn.e-flat.e-primary { background: #0078d6; border-color: #0078d6; color: #fff; } .e-btn.e-flat.e-primary:hover, .e-css.e-btn.e-flat.e-primary:hover { background: rgb(0, 111.4205607477, 198.7); border-color: rgb(0, 111.4205607477, 198.7); color: #fff; } .e-btn.e-flat.e-primary:focus, .e-css.e-btn.e-flat.e-primary:focus { background: rgb(0, 111.4205607477, 198.7); border-color: #fff; color: #fff; } .e-btn.e-flat.e-primary:active, .e-btn.e-flat.e-primary.e-active, .e-css.e-btn.e-flat.e-primary:active, .e-css.e-btn.e-flat.e-primary.e-active { background: rgb(0, 91.4018691589, 163); border-color: rgb(0, 91.4018691589, 163); color: #fff; } .e-btn.e-flat.e-primary:disabled, .e-btn.e-flat.e-primary.e-disabled, .e-css.e-btn.e-flat.e-primary:disabled, .e-css.e-btn.e-flat.e-primary.e-disabled { background: #f4f4f4; border-color: #f4f4f4; -webkit-box-shadow: none; box-shadow: none; color: #a6a6a6; } .e-btn.e-flat.e-primary .e-ripple-element, .e-css.e-btn.e-flat.e-primary .e-ripple-element { background: transparent; } .e-btn.e-flat.e-success, .e-css.e-btn.e-flat.e-success { background: #137c10; border-color: #137c10; color: #fff; } .e-btn.e-flat.e-success:hover, .e-css.e-btn.e-flat.e-success:hover { background: #146511; border-color: #146511; -webkit-box-shadow: none; box-shadow: none; color: #fff; } .e-btn.e-flat.e-success:focus, .e-css.e-btn.e-flat.e-success:focus { background: #146511; border-color: #fff; color: #fff; -webkit-box-shadow: none; box-shadow: none; } .e-btn.e-flat.e-success:active, .e-btn.e-flat.e-success.e-active, .e-css.e-btn.e-flat.e-success:active, .e-css.e-btn.e-flat.e-success.e-active { background: #004b1d; border-color: #004b1d; color: #fff; -webkit-box-shadow: none; box-shadow: none; } .e-btn.e-flat.e-success:disabled, .e-btn.e-flat.e-success.e-disabled, .e-css.e-btn.e-flat.e-success:disabled, .e-css.e-btn.e-flat.e-success.e-disabled { background: #f4f4f4; border-color: #f4f4f4; color: #a6a6a6; } .e-btn.e-flat.e-success .e-ripple-element, .e-css.e-btn.e-flat.e-success .e-ripple-element { background: transparent; } .e-btn.e-flat.e-info, .e-css.e-btn.e-flat.e-info { background: #0378d5; border-color: #0378d5; color: #fff; } .e-btn.e-flat.e-info:hover, .e-css.e-btn.e-flat.e-info:hover { background: #016cc0; border-color: #016cc0; -webkit-box-shadow: none; box-shadow: none; color: #fff; } .e-btn.e-flat.e-info:focus, .e-css.e-btn.e-flat.e-info:focus { background: #016cc0; border-color: #fff; color: #fff; -webkit-box-shadow: none; box-shadow: none; } .e-btn.e-flat.e-info:active, .e-btn.e-flat.e-info.e-active, .e-css.e-btn.e-flat.e-info:active, .e-css.e-btn.e-flat.e-info.e-active { background: #065fa6; border-color: #065fa6; color: #fff; -webkit-box-shadow: none; box-shadow: none; } .e-btn.e-flat.e-info:disabled, .e-btn.e-flat.e-info.e-disabled, .e-css.e-btn.e-flat.e-info:disabled, .e-css.e-btn.e-flat.e-info.e-disabled { background: #f4f4f4; border-color: #f4f4f4; color: #a6a6a6; } .e-btn.e-flat.e-info .e-ripple-element, .e-css.e-btn.e-flat.e-info .e-ripple-element { background: transparent; } .e-btn.e-flat.e-warning, .e-css.e-btn.e-flat.e-warning { background: #d83b01; border-color: #d83b01; color: #fff; } .e-btn.e-flat.e-warning:hover, .e-css.e-btn.e-flat.e-warning:hover { background: #c73702; border-color: #c73702; -webkit-box-shadow: none; box-shadow: none; color: #fff; } .e-btn.e-flat.e-warning:focus, .e-css.e-btn.e-flat.e-warning:focus { background: #c73702; border-color: #fff; color: #fff; -webkit-box-shadow: none; box-shadow: none; } .e-btn.e-flat.e-warning:active, .e-btn.e-flat.e-warning.e-active, .e-css.e-btn.e-flat.e-warning:active, .e-css.e-btn.e-flat.e-warning.e-active { background: #a22c01; border-color: #a22c01; color: #fff; -webkit-box-shadow: none; box-shadow: none; } .e-btn.e-flat.e-warning:disabled, .e-btn.e-flat.e-warning.e-disabled, .e-css.e-btn.e-flat.e-warning:disabled, .e-css.e-btn.e-flat.e-warning.e-disabled { background: #f4f4f4; border-color: #f4f4f4; color: #a6a6a6; } .e-btn.e-flat.e-warning .e-ripple-element, .e-css.e-btn.e-flat.e-warning .e-ripple-element { background: transparent; } .e-btn.e-flat.e-danger, .e-css.e-btn.e-flat.e-danger { background: #a80000; border-color: #a80000; color: #fff; } .e-btn.e-flat.e-danger:hover, .e-css.e-btn.e-flat.e-danger:hover { background: #930000; border-color: #930000; -webkit-box-shadow: none; box-shadow: none; color: #fff; } .e-btn.e-flat.e-danger:focus, .e-css.e-btn.e-flat.e-danger:focus { background: #930000; border-color: #fff; color: #fff; -webkit-box-shadow: none; box-shadow: none; } .e-btn.e-flat.e-danger:active, .e-btn.e-flat.e-danger.e-active, .e-css.e-btn.e-flat.e-danger:active, .e-css.e-btn.e-flat.e-danger.e-active { background: #7c0101; border-color: #7c0101; color: #fff; -webkit-box-shadow: none; box-shadow: none; } .e-btn.e-flat.e-danger:disabled, .e-btn.e-flat.e-danger.e-disabled, .e-css.e-btn.e-flat.e-danger:disabled, .e-css.e-btn.e-flat.e-danger.e-disabled { background: #f4f4f4; border-color: #f4f4f4; color: #a6a6a6; } .e-btn.e-flat.e-danger .e-ripple-element, .e-css.e-btn.e-flat.e-danger .e-ripple-element { background: transparent; } .e-btn.e-outline, .e-css.e-btn.e-outline { background: transparent; border-color: #d0d0d0; -webkit-box-shadow: none; box-shadow: none; color: #333; } .e-btn.e-outline:hover, .e-css.e-btn.e-outline:hover { background: #eaeaea; border-color: #d0d0d0; -webkit-box-shadow: none; box-shadow: none; color: #000; } .e-btn.e-outline:active, .e-btn.e-outline.e-active, .e-css.e-btn.e-outline:active, .e-css.e-btn.e-outline.e-active { background: #c8c8c8; border-color: #c8c8c8; -webkit-box-shadow: none; box-shadow: none; color: #000; } .e-btn.e-outline:disabled, .e-btn.e-outline.e-disabled, .e-css.e-btn.e-outline:disabled, .e-css.e-btn.e-outline.e-disabled { background: transparent; border-color: #f4f4f4; -webkit-box-shadow: none; box-shadow: none; color: #a6a6a6; } .e-btn.e-outline.e-primary, .e-css.e-btn.e-outline.e-primary { background: transparent; border-color: #0078d6; color: #0078d6; } .e-btn.e-outline.e-primary:hover, .e-css.e-btn.e-outline.e-primary:hover { background: rgb(0, 111.4205607477, 198.7); border-color: #0078d6; color: #fff; } .e-btn.e-outline.e-primary:active, .e-btn.e-outline.e-primary.e-active, .e-css.e-btn.e-outline.e-primary:active, .e-css.e-btn.e-outline.e-primary.e-active { background: rgb(0, 91.4018691589, 163); border-color: #0078d6; -webkit-box-shadow: none; box-shadow: none; color: #fff; } .e-btn.e-outline.e-primary:disabled, .e-btn.e-outline.e-primary.e-disabled, .e-css.e-btn.e-outline.e-primary:disabled, .e-css.e-btn.e-outline.e-primary.e-disabled { background: transparent; border-color: #f4f4f4; -webkit-box-shadow: none; box-shadow: none; color: #a6a6a6; } .e-btn.e-outline.e-success, .e-css.e-btn.e-outline.e-success { background: transparent; border-color: #137c10; color: #137c10; } .e-btn.e-outline.e-success:hover, .e-css.e-btn.e-outline.e-success:hover { background: #146511; border-color: #146511; color: #fff; } .e-btn.e-outline.e-success:active, .e-btn.e-outline.e-success.e-active, .e-css.e-btn.e-outline.e-success:active, .e-css.e-btn.e-outline.e-success.e-active { background: #004b1d; border-color: #004b1d; -webkit-box-shadow: none; box-shadow: none; color: #fff; } .e-btn.e-outline.e-success:disabled, .e-btn.e-outline.e-success.e-disabled, .e-css.e-btn.e-outline.e-success:disabled, .e-css.e-btn.e-outline.e-success.e-disabled { background: transparent; border-color: #f4f4f4; -webkit-box-shadow: none; box-shadow: none; color: #a6a6a6; } .e-btn.e-outline.e-info, .e-css.e-btn.e-outline.e-info { background: transparent; border-color: #0378d5; color: #0378d5; } .e-btn.e-outline.e-info:hover, .e-css.e-btn.e-outline.e-info:hover { background: #016cc0; border-color: #016cc0; color: #fff; } .e-btn.e-outline.e-info:active, .e-btn.e-outline.e-info.e-active, .e-css.e-btn.e-outline.e-info:active, .e-css.e-btn.e-outline.e-info.e-active { background: #065fa6; border-color: #065fa6; -webkit-box-shadow: none; box-shadow: none; color: #fff; } .e-btn.e-outline.e-info:disabled, .e-btn.e-outline.e-info.e-disabled, .e-css.e-btn.e-outline.e-info:disabled, .e-css.e-btn.e-outline.e-info.e-disabled { background: transparent; border-color: #f4f4f4; -webkit-box-shadow: none; box-shadow: none; color: #a6a6a6; } .e-btn.e-outline.e-warning, .e-css.e-btn.e-outline.e-warning { background: transparent; border-color: #d83b01; color: #d83b01; } .e-btn.e-outline.e-warning:hover, .e-css.e-btn.e-outline.e-warning:hover { background: #c73702; border-color: #c73702; color: #fff; } .e-btn.e-outline.e-warning:active, .e-btn.e-outline.e-warning.e-active, .e-css.e-btn.e-outline.e-warning:active, .e-css.e-btn.e-outline.e-warning.e-active { background: #a22c01; border-color: #a22c01; -webkit-box-shadow: none; box-shadow: none; color: #fff; } .e-btn.e-outline.e-warning:disabled, .e-btn.e-outline.e-warning.e-disabled, .e-css.e-btn.e-outline.e-warning:disabled, .e-css.e-btn.e-outline.e-warning.e-disabled { background: transparent; border-color: #f4f4f4; -webkit-box-shadow: none; box-shadow: none; color: #a6a6a6; } .e-btn.e-outline.e-danger, .e-css.e-btn.e-outline.e-danger { background: transparent; border-color: #a80000; color: #a80000; } .e-btn.e-outline.e-danger:hover, .e-css.e-btn.e-outline.e-danger:hover { background: #930000; border-color: #930000; color: #fff; } .e-btn.e-outline.e-danger:active, .e-btn.e-outline.e-danger.e-active, .e-css.e-btn.e-outline.e-danger:active, .e-css.e-btn.e-outline.e-danger.e-active { background: #7c0101; border-color: #7c0101; -webkit-box-shadow: none; box-shadow: none; color: #fff; } .e-btn.e-outline.e-danger:disabled, .e-btn.e-outline.e-danger.e-disabled, .e-css.e-btn.e-outline.e-danger:disabled, .e-css.e-btn.e-outline.e-danger.e-disabled { background: transparent; border-color: #f4f4f4; -webkit-box-shadow: none; box-shadow: none; color: #a6a6a6; } .e-btn.e-link, .e-css.e-btn.e-link { background: transparent; border-color: transparent; border-radius: 0; -webkit-box-shadow: none; box-shadow: none; color: #0d47a1; } .e-btn.e-link:hover, .e-css.e-btn.e-link:hover { border-radius: 0; color: #0a3576; text-decoration: underline; } .e-btn.e-link:focus, .e-css.e-btn.e-link:focus { border-radius: 0; text-decoration: underline; color: #0a3576; } .e-btn.e-link:focus:not(:focus-visible), .e-css.e-btn.e-link:focus:not(:focus-visible) { outline: none !important; /* stylelint-disable-line declaration-no-important */ } .e-btn.e-link:disabled, .e-css.e-btn.e-link:disabled { color: #a6a6a6; background: transparent; -webkit-box-shadow: none; box-shadow: none; text-decoration: none; } .e-btn.e-inherit, .e-css.e-btn.e-inherit { color: inherit; background: inherit; border-color: transparent; -webkit-box-shadow: none; box-shadow: none; } .e-btn.e-inherit:hover, .e-btn.e-inherit:focus, .e-btn.e-inherit:active, .e-btn.e-inherit.e-active, .e-css.e-btn.e-inherit:hover, .e-css.e-btn.e-inherit:focus, .e-css.e-btn.e-inherit:active, .e-css.e-btn.e-inherit.e-active { background: rgba(0, 0, 0, 0.056); border-color: transparent; -webkit-box-shadow: none; box-shadow: none; color: inherit; outline: none; } .e-btn.e-inherit:disabled, .e-css.e-btn.e-inherit:disabled { background: inherit; color: inherit; border-color: transparent; -webkit-box-shadow: none; box-shadow: none; opacity: 0.5; } .e-bigger.e-small .e-btn, .e-bigger .e-small.e-btn, .e-bigger.e-small .e-css.e-btn, .e-bigger .e-small.e-css.e-btn { font-size: 16px; line-height: 2em; padding: 1px 22px; } .e-bigger.e-small .e-btn .e-btn-icon, .e-bigger .e-small.e-btn .e-btn-icon, .e-bigger.e-small .e-css.e-btn .e-btn-icon, .e-bigger .e-small.e-css.e-btn .e-btn-icon { font-size: 15px; width: 1.0667em; } .e-bigger.e-small .e-btn .e-btn-icon.e-icon-left, .e-bigger .e-small.e-btn .e-btn-icon.e-icon-left, .e-bigger.e-small .e-css.e-btn .e-btn-icon.e-icon-left, .e-bigger .e-small.e-css.e-btn .e-btn-icon.e-icon-left { margin-left: -0.5334em; width: 2.1334em; } .e-bigger.e-small .e-btn .e-btn-icon.e-icon-right, .e-bigger .e-small.e-btn .e-btn-icon.e-icon-right, .e-bigger.e-small .e-css.e-btn .e-btn-icon.e-icon-right, .e-bigger .e-small.e-css.e-btn .e-btn-icon.e-icon-right { margin-right: -0.5334em; width: 2.1334em; } .e-bigger.e-small .e-btn .e-btn-icon.e-icon-top, .e-bigger .e-small.e-btn .e-btn-icon.e-icon-top, .e-bigger.e-small .e-css.e-btn .e-btn-icon.e-icon-top, .e-bigger .e-small.e-css.e-btn .e-btn-icon.e-icon-top { padding-bottom: 6px; width: auto; } .e-bigger.e-small .e-btn .e-btn-icon.e-icon-bottom, .e-bigger .e-small.e-btn .e-btn-icon.e-icon-bottom, .e-bigger.e-small .e-css.e-btn .e-btn-icon.e-icon-bottom, .e-bigger .e-small.e-css.e-btn .e-btn-icon.e-icon-bottom { padding-top: 6px; width: auto; } .e-bigger.e-small .e-btn.e-icon-btn, .e-bigger .e-small.e-btn.e-icon-btn, .e-bigger.e-small .e-css.e-btn.e-icon-btn, .e-bigger .e-small.e-css.e-btn.e-icon-btn { padding: 1px 9px; } .e-bigger.e-small .e-btn.e-top-icon-btn, .e-bigger.e-small .e-btn.e-bottom-icon-btn, .e-bigger .e-small.e-btn.e-top-icon-btn, .e-bigger .e-small.e-btn.e-bottom-icon-btn, .e-bigger.e-small .e-css.e-btn.e-top-icon-btn, .e-bigger.e-small .e-css.e-btn.e-bottom-icon-btn, .e-bigger .e-small.e-css.e-btn.e-top-icon-btn, .e-bigger .e-small.e-css.e-btn.e-bottom-icon-btn { line-height: 1; padding: 10px 24px; } .e-bigger.e-small .e-btn.e-round, .e-bigger .e-small.e-btn.e-round, .e-bigger.e-small .e-css.e-btn.e-round, .e-bigger .e-small.e-css.e-btn.e-round { height: 2.5em; line-height: 1; padding: 0; width: 2.5em; } .e-bigger.e-small .e-btn.e-round .e-btn-icon, .e-bigger .e-small.e-btn.e-round .e-btn-icon, .e-bigger.e-small .e-css.e-btn.e-round .e-btn-icon, .e-bigger .e-small.e-css.e-btn.e-round .e-btn-icon { font-size: 18px; line-height: 2.1112em; width: auto; } .e-bigger.e-small .e-btn.e-rtl .e-icon-right, .e-bigger .e-small.e-btn.e-rtl .e-icon-right, .e-bigger.e-small .e-css.e-btn.e-rtl .e-icon-right, .e-bigger .e-small.e-css.e-btn.e-rtl .e-icon-right { margin-left: -0.5334em; margin-right: 0; } .e-bigger.e-small .e-btn.e-rtl .e-icon-left, .e-bigger .e-small.e-btn.e-rtl .e-icon-left, .e-bigger.e-small .e-css.e-btn.e-rtl .e-icon-left, .e-bigger .e-small.e-css.e-btn.e-rtl .e-icon-left { margin-left: 0; margin-right: -0.5334em; } .e-bigger .e-btn, .e-bigger.e-btn, .e-bigger .e-css.e-btn, .e-bigger.e-css.e-btn { font-size: 16px; line-height: 2em; padding: 3px 24px; } .e-bigger .e-btn .e-btn-icon, .e-bigger.e-btn .e-btn-icon, .e-bigger .e-css.e-btn .e-btn-icon, .e-bigger.e-css.e-btn .e-btn-icon { font-size: 16px; width: 1em; } .e-bigger .e-btn .e-btn-icon.e-icon-left, .e-bigger.e-btn .e-btn-icon.e-icon-left, .e-bigger .e-css.e-btn .e-btn-icon.e-icon-left, .e-bigger.e-css.e-btn .e-btn-icon.e-icon-left { margin-left: -0.688em; width: 2.25em; } .e-bigger .e-btn .e-btn-icon.e-icon-right, .e-bigger.e-btn .e-btn-icon.e-icon-right, .e-bigger .e-css.e-btn .e-btn-icon.e-icon-right, .e-bigger.e-css.e-btn .e-btn-icon.e-icon-right { margin-right: -0.688em; width: 2.25em; } .e-bigger .e-btn .e-btn-icon.e-icon-top, .e-bigger.e-btn .e-btn-icon.e-icon-top, .e-bigger .e-css.e-btn .e-btn-icon.e-icon-top, .e-bigger.e-css.e-btn .e-btn-icon.e-icon-top { padding-bottom: 10px; width: auto; } .e-bigger .e-btn .e-btn-icon.e-icon-bottom, .e-bigger.e-btn .e-btn-icon.e-icon-bottom, .e-bigger .e-css.e-btn .e-btn-icon.e-icon-bottom, .e-bigger.e-css.e-btn .e-btn-icon.e-icon-bottom { padding-top: 10px; width: auto; } .e-bigger .e-btn.e-icon-btn, .e-bigger.e-btn.e-icon-btn, .e-bigger .e-css.e-btn.e-icon-btn, .e-bigger.e-css.e-btn.e-icon-btn { padding: 3px 11px; } .e-bigger .e-btn.e-top-icon-btn, .e-bigger .e-btn.e-bottom-icon-btn, .e-bigger.e-btn.e-top-icon-btn, .e-bigger.e-btn.e-bottom-icon-btn, .e-bigger .e-css.e-btn.e-top-icon-btn, .e-bigger .e-css.e-btn.e-bottom-icon-btn, .e-bigger.e-css.e-btn.e-top-icon-btn, .e-bigger.e-css.e-btn.e-bottom-icon-btn { line-height: 1; padding: 10px 24px; } .e-bigger .e-btn.e-round, .e-bigger.e-btn.e-round, .e-bigger .e-css.e-btn.e-round, .e-bigger.e-css.e-btn.e-round { height: 2.875em; line-height: 1; padding: 0; width: 2.875em; } .e-bigger .e-btn.e-round .e-btn-icon, .e-bigger.e-btn.e-round .e-btn-icon, .e-bigger .e-css.e-btn.e-round .e-btn-icon, .e-bigger.e-css.e-btn.e-round .e-btn-icon { font-size: 20px; line-height: 2.2em; width: auto; } .e-bigger .e-btn.e-rtl .e-icon-right, .e-bigger.e-btn.e-rtl .e-icon-right, .e-bigger .e-css.e-btn.e-rtl .e-icon-right, .e-bigger.e-css.e-btn.e-rtl .e-icon-right { margin-left: -0.688em; margin-right: 0; } .e-bigger .e-btn.e-rtl .e-icon-left, .e-bigger.e-btn.e-rtl .e-icon-left, .e-bigger .e-css.e-btn.e-rtl .e-icon-left, .e-bigger.e-css.e-btn.e-rtl .e-icon-left { margin-left: 0; margin-right: -0.688em; } .e-bigger .e-btn.e-small, .e-bigger.e-btn.e-small, .e-bigger .e-css.e-btn.e-small, .e-bigger.e-css.e-btn.e-small { font-size: 16px; line-height: 2em; padding: 1px 22px; } .e-bigger .e-btn.e-small .e-btn-icon, .e-bigger.e-btn.e-small .e-btn-icon, .e-bigger .e-css.e-btn.e-small .e-btn-icon, .e-bigger.e-css.e-btn.e-small .e-btn-icon { font-size: 15px; width: 1.0667em; } .e-bigger .e-btn.e-small .e-btn-icon.e-icon-left, .e-bigger.e-btn.e-small .e-btn-icon.e-icon-left, .e-bigger .e-css.e-btn.e-small .e-btn-icon.e-icon-left, .e-bigger.e-css.e-btn.e-small .e-btn-icon.e-icon-left { margin-left: -0.5334em; width: 2.1334em; } .e-bigger .e-btn.e-small .e-btn-icon.e-icon-right, .e-bigger.e-btn.e-small .e-btn-icon.e-icon-right, .e-bigger .e-css.e-btn.e-small .e-btn-icon.e-icon-right, .e-bigger.e-css.e-btn.e-small .e-btn-icon.e-icon-right { margin-right: -0.5334em; width: 2.1334em; } .e-bigger .e-btn.e-small .e-btn-icon.e-icon-top, .e-bigger.e-btn.e-small .e-btn-icon.e-icon-top, .e-bigger .e-css.e-btn.e-small .e-btn-icon.e-icon-top, .e-bigger.e-css.e-btn.e-small .e-btn-icon.e-icon-top { padding-bottom: 6px; width: auto; } .e-bigger .e-btn.e-small .e-btn-icon.e-icon-bottom, .e-bigger.e-btn.e-small .e-btn-icon.e-icon-bottom, .e-bigger .e-css.e-btn.e-small .e-btn-icon.e-icon-bottom, .e-bigger.e-css.e-btn.e-small .e-btn-icon.e-icon-bottom { padding-top: 6px; width: auto; } .e-bigger .e-btn.e-small.e-icon-btn, .e-bigger.e-btn.e-small.e-icon-btn, .e-bigger .e-css.e-btn.e-small.e-icon-btn, .e-bigger.e-css.e-btn.e-small.e-icon-btn { padding: 1px 9px; } .e-bigger .e-btn.e-small.e-top-icon-btn, .e-bigger .e-btn.e-small.e-bottom-icon-btn, .e-bigger.e-btn.e-small.e-top-icon-btn, .e-bigger.e-btn.e-small.e-bottom-icon-btn, .e-bigger .e-css.e-btn.e-small.e-top-icon-btn, .e-bigger .e-css.e-btn.e-small.e-bottom-icon-btn, .e-bigger.e-css.e-btn.e-small.e-top-icon-btn, .e-bigger.e-css.e-btn.e-small.e-bottom-icon-btn { line-height: 1; padding: 10px 24px; } .e-bigger .e-btn.e-small.e-round, .e-bigger.e-btn.e-small.e-round, .e-bigger .e-css.e-btn.e-small.e-round, .e-bigger.e-css.e-btn.e-small.e-round { height: 2.5em; line-height: 1; padding: 0; width: 2.5em; } .e-bigger .e-btn.e-small.e-round .e-btn-icon, .e-bigger.e-btn.e-small.e-round .e-btn-icon, .e-bigger .e-css.e-btn.e-small.e-round .e-btn-icon, .e-bigger.e-css.e-btn.e-small.e-round .e-btn-icon { font-size: 18px; line-height: 2.1112em; width: auto; } .e-bigger .e-btn.e-small.e-rtl .e-icon-right, .e-bigger.e-btn.e-small.e-rtl .e-icon-right, .e-bigger .e-css.e-btn.e-small.e-rtl .e-icon-right, .e-bigger.e-css.e-btn.e-small.e-rtl .e-icon-right { margin-left: -0.5334em; margin-right: 0; } .e-bigger .e-btn.e-small.e-rtl .e-icon-left, .e-bigger.e-btn.e-small.e-rtl .e-icon-left, .e-bigger .e-css.e-btn.e-small.e-rtl .e-icon-left, .e-bigger.e-css.e-btn.e-small.e-rtl .e-icon-left { margin-left: 0; margin-right: -0.5334em; }