Added IE support (with default width & height)

Author: euvl

dist/index.js

@@ -33,6 +33,7 @@
     "css-loader": "^0.25.0",
     "file-loader": "^0.9.0",
     "node-sass": "^4.5.0",
+    "optimize-css-assets-webpack-plugin": "^3.1.1",
     "sass-loader": "^5.0.1",
     "vue": "^2.0.0",
     "vue-loader": "^11.1.4",

dist/ssr.index.js

@@ -156,6 +156,8 @@ export default {
 
 <style lang="scss" scoped>
 $height: 22px;
+$width: 50px;
+
 $margin: 3px;
 // $core-size: $height - 2 * $margin;
 
@@ -232,12 +234,6 @@ $margin: 3px;
     }
   }
 
-  &.toggled {
-    .v-switch-core:before {
-      transform: translate(30px, $margin);
-      transform: translate(var(--d), $margin);
-    }
-  }
 
   &.disabled {
     pointer-events: none;
@@ -247,24 +243,43 @@ $margin: 3px;
 }
 
 .vue-js-switch {
+  line-height: $height;
+  height: $height;
+
   line-height: var(--h);
   height: var(--h);
 
   .v-switch-label {
+    line-height: $height;
+    height: $height;
+
     line-height: var(--h);
     height: var(--h);
   }
 
   .v-switch-core {
     border-radius: 999px;
-    width: 50px;
+
+    width: $width;
+    height: $height;
+
     width: var(--w);
     height: var(--h);
 
     &:before {
+      width: calc(#{$height} - 6px);
+      height: calc(#{$height} - 6px);
+
       width: calc(var(--h) - 6px);
       height: calc(var(--h) - 6px);
     }
   }
+
+  &.toggled {
+    .v-switch-core:before {
+      transform: translate(30px, $margin);
+      transform: translate(var(--d), $margin);
+    }
+  }
 }
 </style>

package.json

@@ -1,5 +1,6 @@
 var path = require('path')
 var webpack = require('webpack')
+var OptimizeCSSPlugin = require('optimize-css-assets-webpack-plugin')
 
 module.exports = {
   entry: './src/index.js',
@@ -43,6 +44,11 @@ module.exports = {
   plugins: [
     new webpack.LoaderOptionsPlugin({
       minimize: true
+    }),
+    new OptimizeCSSPlugin({
+      cssProcessorOptions: {
+        safe: true
+      }
     })
   ]
 }