Logged in profile sidebar

app/partials/home/home-logged-in.jade

@@ -1,6 +1,6 @@
 include ../includes/components/beta
 div.profile.centered
-    div.profile-bar User bar
+    include ../includes/modules/profile/profile-bar
     div.main
         div.hero
         div.content-wrapper

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

@@ -0,0 +1,38 @@
+div.profile-bar
+    img.profile-img(src="http://i.imgur.com/gPiHzHN.jpg", alt="{{ user.nickname }}")
+    a.button-green
+        span Follow
+    h1 Silvia Rodríguez
+    // If user has no defined role in its profile use all its project defined roles followed by an &
+    h2 Backend Developer & Stackeholder
+    div.location
+        // span.icon.icon-location
+        span Madrid
+    // These values in profile stats are not defined yet in UX. Please ask
+    div.profile-stats
+        div.stat
+            span.stat-number 3
+            span.stat-name projects
+        div.stat
+            span.stat-number 67
+            span.stat-name us done
+        div.stat
+            span.stat-number 34
+            span.stat-name contacts
+    // These badges are not defined yet in UX. Please ask
+    div.profile-badges
+        div.badge
+        div.badge
+        div.badge
+        div.badge
+
+    div.profile-organizations
+        h3 Organizations
+        div.profile-organizations-wrapper
+            div.organization
+            div.organization
+            div.organization
+            div.organization
+
+    div.profile-quote
+        span "Small minds talk about people, average minds discuss events, great minds discuss ideas"

app/styles/components/buttons.scss

@@ -5,8 +5,10 @@
     background: transparent;
     border: 0;
     color: $white;
+    cursor: pointer;
     display: inline-block;
     padding: .4rem 2.5rem;
+    text-align: center;
     text-transform: uppercase;
     transition: all .3s linear;
     vertical-align: middle;

app/styles/layout/profile.scss

@@ -3,8 +3,8 @@
     min-height: 100vh;
     padding: 2rem 0;
     .profile-bar {
-        background: #f0f;
-        flex: 1;
+        margin-right: 1rem;
+        width: 200px;
     }
     .main {
         background: #00f;