From a035bef5ee00ffff4534da89a4f4cd4c012c8f95 Mon Sep 17 00:00:00 2001
From: Martin Wortschack <mwortschack@gitlab.com>
Date: Thu, 7 Feb 2019 11:07:49 +0100
Subject: Improve project list UX on large screens

- Remove star button from project list
- Switch to columns on desktop
- Hide MR and issues on screens < 1200px
- Remove not needed utility classes
- Change avatar size to 48px
- Set line-height of title row to 20px
---
 .../javascripts/pages/dashboard/projects/index.js       |  2 --
 app/assets/javascripts/pages/explore/projects/index.js  |  2 --
 app/assets/stylesheets/pages/projects.scss              | 17 ++++++++++++-----
 3 files changed, 12 insertions(+), 9 deletions(-)

(limited to 'app/assets')

diff --git a/app/assets/javascripts/pages/dashboard/projects/index.js b/app/assets/javascripts/pages/dashboard/projects/index.js
index 8f98be79640..01001d4f3ff 100644
--- a/app/assets/javascripts/pages/dashboard/projects/index.js
+++ b/app/assets/javascripts/pages/dashboard/projects/index.js
@@ -1,7 +1,5 @@
 import ProjectsList from '~/projects_list';
-import Star from '../../../star';
 
 document.addEventListener('DOMContentLoaded', () => {
   new ProjectsList(); // eslint-disable-line no-new
-  new Star('.project-row'); // eslint-disable-line no-new
 });
diff --git a/app/assets/javascripts/pages/explore/projects/index.js b/app/assets/javascripts/pages/explore/projects/index.js
index 8f98be79640..01001d4f3ff 100644
--- a/app/assets/javascripts/pages/explore/projects/index.js
+++ b/app/assets/javascripts/pages/explore/projects/index.js
@@ -1,7 +1,5 @@
 import ProjectsList from '~/projects_list';
-import Star from '../../../star';
 
 document.addEventListener('DOMContentLoaded', () => {
   new ProjectsList(); // eslint-disable-line no-new
-  new Star('.project-row'); // eslint-disable-line no-new
 });
diff --git a/app/assets/stylesheets/pages/projects.scss b/app/assets/stylesheets/pages/projects.scss
index 2342c284a5e..3eb02cd4358 100644
--- a/app/assets/stylesheets/pages/projects.scss
+++ b/app/assets/stylesheets/pages/projects.scss
@@ -946,6 +946,11 @@ pre.light-well {
     .flex-wrapper {
       min-width: 0;
       margin-top: -$gl-padding-8; // negative margin required for flex-wrap
+      flex: 1 1 100%;
+
+      .project-title {
+        line-height: 20px;
+      }
     }
 
     p,
@@ -984,14 +989,16 @@ pre.light-well {
   }
 
   .controls {
-    margin-top: $gl-padding-8;
+    @include media-breakpoint-down(xs) {
+      margin-top: $gl-padding-8;
+    }
 
-    @include media-breakpoint-down(md) {
+    @include media-breakpoint-up(sm) {
       margin-top: 0;
     }
 
-    @include media-breakpoint-down(xs) {
-      margin-top: $gl-padding-8;
+    @include media-breakpoint-up(lg) {
+      flex: 1 1 40%;
     }
 
     .icon-wrapper {
@@ -1041,7 +1048,7 @@ pre.light-well {
       min-height: 40px;
       min-width: 40px;
 
-      .identicon.s64 {
+      .identicon.s48 {
         font-size: 16px;
       }
     }
-- 
cgit v1.2.1