radi-cho

<label class="switch">
  <input type="checkbox" />
  <span></span>
</label>

radi-cho

.switch span {
  position: relative;
  display: inline-block;
  width: 40px;
  height: 20px;
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 100px;
  transition: all .5s;
  box-shadow: 1px 2px 3px rgba(0,0,0,.1) inset;

radi-cho

.switch input {
  opacity: 0;
  position: absolute;
  z-index: -1;
}

radi-cho

.switch input:checked+span {
  background-color: #5d9cec;
  border-color: #5d9cec;
  transition: all .5s;
}

.switch span:after {
  content: "";
  position: absolute;
  background-color: #fff;

radi-cho

.switch * {
  cursor: pointer;
}

radi-cho

.switch.switch-lg span {
  width: 50px;
  height: 25px;
}

.switch.switch-lg span:after {
  height: 23px;
  width: 23px;
}

radi-cho

.switch input:checked+span {
  background-color: #5d9cec;
  border-color: #5d9cec;
  transition: all .5s;
}
.switch.switch-lg span {
  width: 50px;
  height: 25px;
}
.switch span {

radi-cho

alert("something");

radi-cho

var debug = process.env.NODE_ENV !== "production";
var webpack = require('webpack');

module.exports = {
  context: __dirname,
  devtool: debug ? "inline-sourcemap" : null,
  entry: "./js/index.js",
  output: {
    path: __dirname + "/js",
    filename: "index.min.js"

radi-cho

{
  "presets": ["react", ["env", {
    "targets": {
      "browsers": [
        "Firefox > 31",
        "Chrome > 37"
      ]
    },
    "modules": false
  }], "stage-0"]