Extract tag component

src/App.vue

@@ -22,4 +22,10 @@
   &:hover,
   &:focus
     @apply bg-grey-darker
+
+.tag
+  @apply text-2xs uppercase py-1 px-2 rounded border border-grey bg-white mr-2 mb-2
+
+.tag.is-type
+  @apply bg-blue-light border-blue-light text-white
 </style>

src/components/Application/ApplicationTags.vue

@@ -1,8 +1,8 @@
 <template>
   <div>
     <ul class="list-reset flex flex-wrap -mr-2 -mb-2">
-      <li class="text-2xs uppercase py-1 px-2 rounded border border-transparent bg-blue-light text-white mr-2 mb-2">{{ type }}</li>
-      <li class="text-2xs uppercase py-1 px-2 rounded border border-grey bg-white mr-2 mb-2">{{ level }}</li>
+      <li class="tag is-type">{{ type }}</li>
+      <li class="tag">{{ level }}</li>
     </ul>
   </div>
 </template>