Contacts filters

app/partials/includes/modules/profile/profile-contacts.jade

@@ -1,4 +1,9 @@
 section.profile-contacts
+    nav.profile-contacts-filters
+        a.active(href="", title="No Filter") all
+        a(href="", title="Only show your team") team
+        a(href="", title="Only show people you follow") following
+        a(href="", title="Only show people follow you") followers
     - for (var x = 0; x < 3; x++)
         div.profile-contact-single
             picture

app/partials/includes/modules/profile/profile-content-tabs.jade

@@ -1,11 +1,11 @@
 nav.profile-content-tabs
-    a.tab.active(href="", title="Activity Tab")
+    a.tab(href="", title="Activity Tab")
         span.icon.icon-timeline
         span activity
     a.tab(href="", title="Projects Tab")
         span.icon.icon-project
         span projects
-    a.tab(href="", title="Contacts Tab")
+    a.tab.active(href="", title="Contacts Tab")
         span.icon.icon-team
         span contacts
     a.tab(href="", title="Favorites Tab")

app/styles/modules/profile/profile-contacts.scss

@@ -1,5 +1,23 @@
 .profile-contacts {
     border-top: 1px solid $whitish;
+    display: flex;
+    flex-direction: column;
+    .profile-contacts-filters {
+        align-self: center;
+        display: flex;
+        a {
+            border-bottom: 2px solid $white;
+            color: $gray-light;
+            display: inline-block;
+            padding: 1rem 1.5rem;
+            transition: all .2s linear;
+            &:hover,
+            &.active {
+                border-bottom: 2px solid $gray-light;
+                color: $green-taiga;
+            }
+        }
+    }
 }
 
 .profile-contact-single {