| Index: pkg/polymer/lib/elements/polymer-ui-toggle-button/polymer-ui-toggle-button.css
|
| diff --git a/pkg/polymer/lib/elements/polymer-ui-toggle-button/polymer-ui-toggle-button.css b/pkg/polymer/lib/elements/polymer-ui-toggle-button/polymer-ui-toggle-button.css
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..2620bfc4a79090835ead85ebbe7691e86803c2fa
|
| --- /dev/null
|
| +++ b/pkg/polymer/lib/elements/polymer-ui-toggle-button/polymer-ui-toggle-button.css
|
| @@ -0,0 +1,96 @@
|
| +/*
|
| +Copyright 2013 The Polymer Authors. All rights reserved.
|
| +Use of this source code is governed by a BSD-style
|
| +license that can be found in the LICENSE file.
|
| +*/
|
| +
|
| +:host {
|
| + display: inline-block;
|
| + position: relative;
|
| + min-width: 60px;
|
| + height: 24px;
|
| + overflow: hidden;
|
| + border: 1px solid #b6b6b6;
|
| + border-radius: 2px;
|
| + box-shadow: inset 0px 0px 1px 0 rgba(0,0,0,0.1);
|
| + -webkit-user-select: none;
|
| + -moz-user-select: none;
|
| + -ms-user-select: none;
|
| + -webkit-transition: border 0.130s ease-out;
|
| + transition: border 0.130s ease-out;
|
| + cursor: pointer;
|
| + font-size: 10px;
|
| +}
|
| +
|
| +:host(.on:host) {
|
| + border: 1px solid #0fb2c6;
|
| +}
|
| +
|
| +.toggle {
|
| + position: absolute;
|
| + left: -webkit-calc(-100% + 24px);
|
| + left: -moz-calc(-100% + 24px);
|
| + left: calc(-100% + 24px);
|
| + width: -webkit-calc(200% - 24px);
|
| + width: -moz-calc(200% - 24px);
|
| + width: calc(200% - 24px);
|
| + height: 100%;
|
| + overflow: hidden;
|
| + white-space: nowrap;
|
| + /* Safari bug: https://bugs.webkit.org/show_bug.cgi?id=100568 */
|
| + /*-webkit-transition: left 0.130s ease-out;*/
|
| + transition: left 0.130s ease-out;
|
| +}
|
| +
|
| +/* workaround for https://github.com/Polymer/platform/issues/36 */
|
| +/* @polyfill-unscoped-rule polymer-ui-toggle-button .toggle {
|
| + left: -webkit-calc(-100% + 24px);
|
| + width: -webkit-calc(200% - 24px);
|
| +} */
|
| +
|
| +.toggle.dragging {
|
| + -webkit-transition: none;
|
| + transition: none;
|
| +}
|
| +
|
| +.toggle.on {
|
| + left: 0;
|
| +}
|
| +
|
| +.toggle > * {
|
| + float: left;
|
| +}
|
| +
|
| +.on-label, .off-label {
|
| + width: 50%;
|
| + height: 100%;
|
| + box-sizing: border-box;
|
| + -moz-box-sizing: border-box;
|
| +}
|
| +
|
| +.on-label {
|
| + padding-right: 12px;
|
| + background-color: #2fb2c6;
|
| + color: white;
|
| +}
|
| +
|
| +.off-label {
|
| + padding-left: 12px;
|
| + background-color: #bfbfbf;
|
| + color: #716f6f;
|
| +}
|
| +
|
| +.thumb {
|
| + position: absolute;
|
| + left: -webkit-calc(50% - 12px);
|
| + left: -moz-calc(50% - 12px);
|
| + left: calc(50% - 12px);
|
| + width: 24px;
|
| + height: 100%;
|
| + border-radius: 1px;
|
| + background-color: white;
|
| +}
|
| +
|
| +/* @polyfill-unscoped-rule polymer-ui-toggle-button .thumb {
|
| + left: -webkit-calc(50% - 12px);
|
| +} */
|
|
|