:sparkles: pending and paired tabs styled

frontend/src/views/PairsView.vue

@@ -1,9 +1,9 @@
 <template lang="pug">
 main.view--pairs
     article(v-if='isLoggedIn')
-        w-tabs(:items='tabs' fill-bar)
+        w-tabs(:items='tabs' fill-bar slider-color='yellow')
             template(#item-title='{ item }')
-                span.green {{ item.title }}
+                span {{ item.title }}
             //- pending tab
             template(#item-content.1='{ item }')
                 PairsList(:pairs='pending' tab-name='pending')
@@ -73,19 +73,31 @@ export default {
 </script>
 
 <style lang="sass">
-.select--matches 
+.view--pairs
+    max-width: 450px
+    width: 100%
+    margin: 0 auto
+    background-color: #1F2024
+    .w-tabs__bar-item
+        height: 50px
+        font-family: 'Century Gothic'
+        color: #FFFFFF
+        &.w-tabs__bar-item--active
+        &.primary
+            color: #F2CD5C
+.select--matches
     display: flex
     justify-content: space-between
     margin: 0 25px
-.select--matches > div 
-    width: 100%
-    text-align: center
-    font-size: 16px
-    line-height: 40px
-.active 
+    > div
+        width: 100%
+        text-align: center
+        font-size: 16px
+        line-height: 40px
+.active
     border-bottom: 3px solid #f2cd5c
     color: #f2cd5c
-.idle 
-    color: #bcc5d3
 
+.idle
+    color: #bcc5d3
 </style>