UNPKG

@piworks/angular-bootstrap-toggle-switch

Version:

Toggle Switches for AngularJS (and optionally Bootstrap). Based off [Bootstrap switch](http://www.larentis.eu/switch/) by Matt Lartentis and forked from [cgarvis](https://github.com/cgarvis/angular-toggle-switch).

71 lines (70 loc) 1.36 kB
.ats-switch { border: 1px solid; cursor: pointer; display: inline-block; text-align: left; overflow: hidden; line-height: 8px; min-width: 100px; } .ats-switch.disabled { opacity: 0.5; filter: alpha(opacity=50); cursor: default !important; } .ats-switch.disabled .switch-left, .ats-switch.disabled .switch-right, .ats-switch.disabled .knob { cursor: default !important; } .ats-switch span { cursor: pointer; display: inline-block; float: left; height: 100%; line-height: 20px; padding: 4px; text-align: center; width: 33%; white-space: nowrap; box-sizing: border-box; -o-box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; } .ats-switch > div { position: relative; width: 150%; } .ats-switch .knob { background: red; border-left: 1px solid #ccc; border-right: 1px solid #ccc; background-color: #f5f5f5; width: 34%; z-index: 100; } .ats-switch .switch-on { left: 0%; } .ats-switch .switch-off { left: -50%; } .ats-switch .swtich-left, .ats-switch .switch-right { z-index: 1; } .ats-switch .switch-left { color: #fff; background: #005fcc; } .ats-switch .switch-right { color: #333; background: #f0f0f0; } .ats-switch .switch-animate { transition: left 0.5s; -o-transition: left 0.5s; -moz-transition: left 0.5s; -webkit-transition: left 0.5s; }