Project list fixes

app/modules/home/home.scss

@@ -10,7 +10,6 @@
     }
     .see-more-projects-btn {
         display: block;
-        margin-top: 2rem;
     }
     .title-bar {
         @extend %title;

app/modules/home/projects/home-project-list.jade

@@ -1,7 +1,7 @@
 ul.home-project-list(ng-show="vm.projects.size")
     li.home-project-list-single(tg-bind-scope, tg-repeat="project in vm.projects")
-        h2.home-project-list-single-title
-            a(href="#", tg-nav="project:project=project.get('slug')")
+        a(href="#", tg-nav="project:project=project.get('slug')")
+            h2.home-project-list-single-title
                 span.project-name(title="{{ ::project.get('name') }}") {{::project.get('name')}}
                 span.private(ng-if="project.get('is_private')", title="{{'PROJECT.PRIVATE' | translate}}")
                     include ../../../svg/lock.svg

app/modules/home/projects/home-project-list.scss

@@ -1,14 +1,14 @@
 .home-project-list {
     li {
-        border-right: 5px solid $whitish;
+        border: 1px solid lighten($gray-light, 15%);
+        border-radius: 3px;
         cursor: pointer;
-        margin-bottom: .5rem;
-        padding: .5rem;
-        padding-right: 1rem;
+        margin-bottom: .75rem;
+        padding: 1rem;
         text-overflow: ellipsis;
         &:hover {
             border-color: $fresh-taiga;
-            transition: border-color .3s linear;
+            transition: all .3s linear;
             p {
                 color: $gray;
                 transition: color .3s linear;
@@ -19,12 +19,17 @@
             }
         }
     }
+    a {
+        display: flex;
+        flex-direction: column;
+        min-height: 5rem;
+    }
     h2 {
         @extend %text;
         color: $gray;
         font-size: 1.5rem;
         line-height: 1.3;
-        margin-bottom: 0;
+        margin-bottom: .5rem;
         text-transform: none;
         .project-name {
             display: inline-block;
@@ -37,8 +42,9 @@
     }
     p {
         @extend %text;
-        @extend %small;
+        @extend %xsmall;
         color: $gray-light;
+        line-height: 125%;
         margin: 0;
         word-wrap: break-word;
     }

app/modules/projects/listing/projects-listing.jade

@@ -13,10 +13,11 @@ div.project-list-wrapper.centered
             ul(tg-sort-projects="vm.projects")
                 li.project-list-single(tg-bind-scope, tg-repeat="project in vm.projects track by project.get('id')")
                     div.project-list-single-left
-                        h1.project-name
-                            a(href="#", tg-nav="project:project=project.get('slug')", title="{{ ::project.get('name') }}") {{project.get('name')}}
-                        span.private(ng-if="project.get('is_private')", title="{{'PROJECT.PRIVATE' | translate}}")
-                            include ../../../svg/lock.svg
+                        div.project-title
+                            h1.project-name
+                                a(href="#", tg-nav="project:project=project.get('slug')", title="{{ ::project.get('name') }}") {{project.get('name')}}
+                            span.private(ng-if="project.get('is_private')", title="{{'PROJECT.PRIVATE' | translate}}")
+                                include ../../../svg/lock.svg
                         p {{ ::project.get('description') | limitTo:300 }}
                             span(ng-if="::project.get('description').length > 300") ...
 

app/modules/projects/listing/projects-listing.scss

@@ -2,12 +2,12 @@
     border-bottom: 1px solid $whitish;
     display: flex;
     justify-content: space-between;
-    padding: .5rem;
+    min-height: 9rem;
+    padding: 1rem;
     position: relative;
 }
 
 .project-list-single-left {
-    align-content: space-between;
     display: flex;
     flex-direction: column;
     padding-right: 1rem;
@@ -23,15 +23,15 @@
     }
     p {
         @extend %text;
-        @extend %small;
+        @extend %xsmall;
         color: $gray;
         margin-bottom: 0;
     }
     .project-list-single-tags {
+        align-self: flex-end;
         display: flex;
         flex: 3;
         flex-wrap: wrap;
-        justify-content: flex-start;
         margin-top: .5rem;
     }
     .tag {

app/modules/projects/listing/styles/profile-projects.scss

@@ -1,6 +1,8 @@
 .profile-projects {
     border-top: 1px solid $whitish;
     .project-list-single {
+        display: flex;
+        justify-content: space-between;
         min-height: 10rem;
     }
 }

app/modules/user-timeline/user-timeline/user-timeline.scss

@@ -34,7 +34,7 @@
             align-items: center;
             color: $gray-light;
             display: flex;
-            margin-right: 100px;
+            margin-right: 130px;
         }
         .activity-date {
             color: $gray-light;

app/styles/components/private.scss

@@ -1,6 +1,6 @@
 .private {
     display: inline-block;
-    margin-left: .3rem;
+    margin-left: .5rem;
     width: .5rem;
     path {
         fill: $gray-light;

app/styles/dependencies/helpers.scss

@@ -1,5 +1,5 @@
 // __Font Sizes__ //
-%xsmall {font-size: .5rem;}
+%xsmall {font-size: .75rem;}
 %small {font-size: .9rem;}
 %medium {font-size: 1rem;}
 %large {font-size: 1.2rem;}

app/svg/timeline.svg

@@ -1 +1,3 @@
-<svg xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" version="1.1"><path d="m0 16.5 24 0 0-3-24 0 0 3zm0 6 24 0 0-3-24 0 0 3zm0-12 24 0 0-3-24 0 0 3zm0-9 0 3 24 0 0-3-24 0z"/></svg>
+<svg xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" version="1.1" height="24px" width="24px">
+    <path d="m0 16.5 24 0 0-3-24 0 0 3zm0 6 24 0 0-3-24 0 0 3zm0-12 24 0 0-3-24 0 0 3zm0-9 0 3 24 0 0-3-24 0z"/>
+</svg>