Merge pull request #1043 from taigaio/enhancement/3754/column-dashboard

Add double column dashboard

CHANGELOG.md

@@ -13,6 +13,8 @@
 - Add a new permissions to allow add comments instead of use the existent modify permission for this purpose.
 - Ability to edit comments, view edition history and redesign comments module UI
 - Upvote and downvote issues from the issues list.
+- Divide dashboard in two columns in large screens
+
 
 ### Misc
 - Lots of small and not so small bugfixes.

app/modules/home/home.jade

@@ -2,6 +2,8 @@ doctype html
 
 div.home-wrapper.centered
     div.duty-summary
-        div(tg-working-on)
+        h1
+            span.green {{"HOME.DASHBOARD" | translate}}
+        tg-working-on.dashboard-container
 
     aside.project-list(tg-home-project-list)

app/modules/home/home.scss

@@ -1,9 +1,32 @@
 .home-wrapper {
     display: flex;
+    @include breakpoint(tablet) {
+        flex-direction: column;
+    }
+    @include breakpoint(mobile) {
+        flex-direction: column;
+    }
     .duty-summary {
         flex: 1;
         margin-right: 2rem;
     }
+    .dashboard-container {
+        display: flex;
+        flex-direction: row;
+        @include breakpoint(laptop) {
+            flex-direction: column;
+        }
+        @include breakpoint(tablet) {
+            flex-direction: column;
+        }
+        @include breakpoint(mobile) {
+            flex-direction: column;
+        }
+    }
+    .working-on-container {
+        margin-right: .5rem;
+        padding-right: .5rem;
+    }
     .project-list {
         width: 250px;
     }
@@ -12,11 +35,11 @@
     }
     .title-bar {
         @include font-type(light);
-        @include font-size(larger);
+        @include font-size(large);
         align-content: center;
         background: $mass-white;
         display: flex;
         margin: 0 0 .5rem;
-        padding: .9rem 1rem;
+        padding: .5rem 1rem;
     }
 }

app/modules/home/working-on/working-on.jade

@@ -1,6 +1,3 @@
-h1
-    span.green {{"HOME.DASHBOARD" | translate}}
-
 section.working-on-container
     header
         h1.title-bar.working-on-title(translate="HOME.WORKING_ON_SECTION")