/* line 1, components.scss */ .switch-input { display: none; } /* line 5, components.scss */ .switch-label { position: relative; display: inline-block; min-width: 112px; width: 100%; box-sizing: border-box; cursor: pointer; font-weight: 500; text-align: left; padding: 10px 44px 10px 0; } /* line 15, components.scss */ .switch-label:before, .switch-label:after { content: ""; position: absolute; margin: 0; outline: 0; top: 50%; -ms-transform: translate(0, -50%); -webkit-transform: translate(0, -50%); transform: translate(0, -50%); -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } /* line 27, components.scss */ .switch-label:before { right: 2px; width: 34px; height: 14px; background-color: #9E9E9E; border-radius: 8px; } /* line 34, components.scss */ .switch-label:after { right: 17px; width: 20px; height: 20px; background-color: #FAFAFA; border-radius: 50%; box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.14), 0 2px 2px 0 rgba(0, 0, 0, 0.098), 0 1px 5px 0 rgba(0, 0, 0, 0.084); } /* line 42, components.scss */ .switch-label .toggle--on { display: none; } /* line 45, components.scss */ .switch-label .toggle--off { display: inline-block; } /* line 51, components.scss */ .switch-input:checked + .switch-label:before { background-color: #A5D6A7; } /* line 54, components.scss */ .switch-input:checked + .switch-label:after { background-color: #4CAF50; -ms-transform: translate(80%, -50%); -webkit-transform: translate(80%, -50%); transform: translate(80%, -50%); } /* line 60, components.scss */ .switch-input:checked + .switch-label .toggle--on { display: inline-block; } /* line 63, components.scss */ .switch-input:checked + .switch-label .toggle--off { display: none; }