🍊

src/components/Hamburger/index.vue

@@ -1,6 +1,6 @@
 <template>
     <div>
-        <svg t="1492500959545" @click="toggleClick" class="wscn-icon hamburger" :class="{'is-active':isActive}"  style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1691" xmlns:xlink="http://www.w3.org/1999/xlink" width="64" height="64"><path d="M966.8023 568.849776 57.196677 568.849776c-31.397081 0-56.850799-25.452695-56.850799-56.850799l0 0c0-31.397081 25.452695-56.849776 56.850799-56.849776l909.605623 0c31.397081 0 56.849776 25.452695 56.849776 56.849776l0 0C1023.653099 543.397081 998.200404 568.849776 966.8023 568.849776z" p-id="1692"></path><path d="M966.8023 881.527125 57.196677 881.527125c-31.397081 0-56.850799-25.452695-56.850799-56.849776l0 0c0-31.397081 25.452695-56.849776 56.850799-56.849776l909.605623 0c31.397081 0 56.849776 25.452695 56.849776 56.849776l0 0C1023.653099 856.07443 998.200404 881.527125 966.8023 881.527125z" p-id="1693"></path><path d="M966.8023 256.17345 57.196677 256.17345c-31.397081 0-56.850799-25.452695-56.850799-56.849776l0 0c0-31.397081 25.452695-56.850799 56.850799-56.850799l909.605623 0c31.397081 0 56.849776 25.452695 56.849776 56.850799l0 0C1023.653099 230.720755 998.200404 256.17345 966.8023 256.17345z" p-id="1694"></path></svg>
+        <svg t="1492500959545" @click="toggleClick" class="svg-icon hamburger" :class="{'is-active':isActive}"  style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1691" xmlns:xlink="http://www.w3.org/1999/xlink" width="64" height="64"><path d="M966.8023 568.849776 57.196677 568.849776c-31.397081 0-56.850799-25.452695-56.850799-56.850799l0 0c0-31.397081 25.452695-56.849776 56.850799-56.849776l909.605623 0c31.397081 0 56.849776 25.452695 56.849776 56.849776l0 0C1023.653099 543.397081 998.200404 568.849776 966.8023 568.849776z" p-id="1692"></path><path d="M966.8023 881.527125 57.196677 881.527125c-31.397081 0-56.850799-25.452695-56.850799-56.849776l0 0c0-31.397081 25.452695-56.849776 56.850799-56.849776l909.605623 0c31.397081 0 56.849776 25.452695 56.849776 56.849776l0 0C1023.653099 856.07443 998.200404 881.527125 966.8023 881.527125z" p-id="1693"></path><path d="M966.8023 256.17345 57.196677 256.17345c-31.397081 0-56.850799-25.452695-56.850799-56.849776l0 0c0-31.397081 25.452695-56.850799 56.850799-56.850799l909.605623 0c31.397081 0 56.849776 25.452695 56.849776 56.850799l0 0C1023.653099 230.720755 998.200404 256.17345 966.8023 256.17345z" p-id="1694"></path></svg>
     </div>
 </template>
 

src/components/Icon-svg/index.js

@@ -1,11 +0,0 @@
-import Vue from 'vue'
-
-function registerAllComponents(requireContext) {
-  return requireContext.keys().forEach(comp => {
-    const vueComp = requireContext(comp)
-    const compName = vueComp.name ? vueComp.name.toLowerCase() : /\/([\w-]+)\.vue$/.exec(comp)[1]
-    Vue.component(compName, vueComp)
-  })
-}
-
-registerAllComponents(require.context('./', false, /\.vue$/))

src/components/Icon-svg/index.vue

@@ -1,12 +1,12 @@
 <template>
-  <svg class="wscn-icon" aria-hidden="true">
+  <svg class="svg-icon" aria-hidden="true">
     <use :xlink:href="iconName"></use>
   </svg>
 </template>
 
 <script>
   export default {
-    name: 'wscn-icon-svg',
+    name: 'icon-svg',
     props: {
       iconClass: {
         type: String,
@@ -20,7 +20,3 @@
     }
   }
 </script>
-
-<style lang="scss" scoped>
-
-</style>

src/components/Icon-svg/wscn-icon-stack.vue

@@ -1,52 +0,0 @@
-<template>
-  <div class="icon-container" :style="containerStyle">
-    <slot class="icon"></slot>
-  </div>
-</template>
-
-<script>
-  export default {
-    name: 'wscn-icon-stack',
-    props: {
-      width: {
-        type: Number,
-        default: 20
-      },
-      shape: {
-        type: String,
-        default: 'circle',
-        validator: val => {
-          const validShapes = ['circle', 'square']
-          return validShapes.indexOf(val) > -1
-        }
-      }
-    },
-    computed: {
-      containerStyle() {
-        return {
-          width: `${this.width}px`,
-          height: `${this.width}px`,
-          fontSize: `${this.width * 0.6}px`,
-          borderRadius: `${this.shape === 'circle' && '50%'}`
-        }
-      }
-    }
-  }
-</script>
-
-<style lang="scss" scoped>
-  .icon-container {
-    display: inline-block;
-    position: relative;
-    overflow: hidden;
-    background: #1482F0;
-
-    .icon {
-      position: absolute;
-      color: #ffffff;
-      top: 50%;
-      left: 50%;
-      transform: translate(-50%, -50%);
-    }
-  }
-</style>