Style tab headers and add preview gif

Christopher Mühl · Christopher Mühl · commit 052523604147 · 2019-02-09T11:43:35.000+01:00
diff --git a/.npmignore b/.npmignore
@@ -0,0 +1 @@
+preview.gif
diff --git a/README.md b/README.md
@@ -1,6 +1,9 @@
 # vuepress-plugin-code-switcher
 Component that allows having synchronized language switchable code blocks (e.g. to switch between Java and Kotlin examples). Selected languages are persisted to local storage to have language selection be permanent across page requests.
 
+## Demo
+![](preview.gif)
+
 ## Installation
 ```
 $ npm install vuepress-plugin-code-switcher --save
diff --git a/preview.gif b/preview.gif
diff --git a/switcher.styl b/switcher.styl
@@ -5,11 +5,18 @@
     .tab-header
         ul
             padding 0
+            text-align right
+            margin-bottom -5px
+            margin-top 20px
 
         li
             display inline-block
             padding 0 10px
             cursor pointer
+            border-radius 4px
+            border 2px solid $borderColor
+            margin-left 5px
+            font-size 80%
 
             &.active
-                font-weight bold
+                border-color $accentColor
