From 8e7e999cc34bd19665fef18abcf9749b7970a0d0 Mon Sep 17 00:00:00 2001
From: Chad Little <chad@chadsdomain.com>
Date: Fri, 5 Feb 2016 10:30:20 -0800
Subject: [PATCH] Slightly better spacing, colors on ProjectCards

Summary: Fixes transparent background images, removes "checkered". Better spacing for tags.

Test Plan:
Upload a transparent logo, hover over project.

{F1093753}

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: Korvin

Differential Revision: https://secure.phabricator.com/D15188
---
 resources/celerity/map.php                    | 27 ++++++------
 .../application/project/project-card-view.css | 42 +++++++++----------
 2 files changed, 35 insertions(+), 34 deletions(-)

diff --git a/resources/celerity/map.php b/resources/celerity/map.php
index 747ee79741..56999335cf 100644
--- a/resources/celerity/map.php
+++ b/resources/celerity/map.php
@@ -93,7 +93,7 @@ return array(
     'rsrc/css/application/policy/policy-transaction-detail.css' => '82100a43',
     'rsrc/css/application/policy/policy.css' => '957ea14c',
     'rsrc/css/application/ponder/ponder-view.css' => '7b0df4da',
-    'rsrc/css/application/project/project-card-view.css' => 'ee1ce91d',
+    'rsrc/css/application/project/project-card-view.css' => '9c3631e5',
     'rsrc/css/application/project/project-view.css' => '99a5023b',
     'rsrc/css/application/releeph/releeph-core.css' => '9b3c5733',
     'rsrc/css/application/releeph/releeph-preview-branch.css' => 'b7a6f4a5',
@@ -412,7 +412,7 @@ return array(
     'rsrc/js/application/phortune/behavior-stripe-payment-form.js' => '3f5d6dbf',
     'rsrc/js/application/phortune/behavior-test-payment-form.js' => 'fc91ab6c',
     'rsrc/js/application/phortune/phortune-credit-card-form.js' => '2290aeef',
-    'rsrc/js/application/policy/behavior-policy-control.js' => 'ae45872f',
+    'rsrc/js/application/policy/behavior-policy-control.js' => 'd0c516d5',
     'rsrc/js/application/policy/behavior-policy-rule-editor.js' => '5e9f347c',
     'rsrc/js/application/projects/behavior-project-boards.js' => '48470f95',
     'rsrc/js/application/projects/behavior-project-create.js' => '065227cc',
@@ -652,7 +652,7 @@ return array(
     'javelin-behavior-phui-hovercards' => 'bcaccd64',
     'javelin-behavior-phui-object-box-tabs' => '2bfa2836',
     'javelin-behavior-phui-profile-menu' => '12884df9',
-    'javelin-behavior-policy-control' => 'ae45872f',
+    'javelin-behavior-policy-control' => 'd0c516d5',
     'javelin-behavior-policy-rule-editor' => '5e9f347c',
     'javelin-behavior-project-boards' => '48470f95',
     'javelin-behavior-project-create' => '065227cc',
@@ -844,7 +844,7 @@ return array(
     'policy-edit-css' => '815c66f7',
     'policy-transaction-detail-css' => '82100a43',
     'ponder-view-css' => '7b0df4da',
-    'project-card-view-css' => 'ee1ce91d',
+    'project-card-view-css' => '9c3631e5',
     'project-view-css' => '99a5023b',
     'releeph-core' => '9b3c5733',
     'releeph-preview-branch' => 'b7a6f4a5',
@@ -1684,15 +1684,6 @@ return array(
       'javelin-uri',
       'phabricator-file-upload',
     ),
-    'ae45872f' => array(
-      'javelin-behavior',
-      'javelin-dom',
-      'javelin-util',
-      'phuix-dropdown-menu',
-      'phuix-action-list-view',
-      'phuix-action-view',
-      'javelin-workflow',
-    ),
     'b064af76' => array(
       'javelin-behavior',
       'javelin-stratcom',
@@ -1852,6 +1843,16 @@ return array(
     'd00a795a' => array(
       'phui-theme-css',
     ),
+    'd0c516d5' => array(
+      'javelin-behavior',
+      'javelin-dom',
+      'javelin-util',
+      'phuix-dropdown-menu',
+      'phuix-action-list-view',
+      'phuix-action-view',
+      'javelin-workflow',
+      'phuix-icon-view',
+    ),
     'd19198c8' => array(
       'javelin-install',
       'javelin-dom',
diff --git a/webroot/rsrc/css/application/project/project-card-view.css b/webroot/rsrc/css/application/project/project-card-view.css
index d284804f1d..475f7c76f2 100644
--- a/webroot/rsrc/css/application/project/project-card-view.css
+++ b/webroot/rsrc/css/application/project/project-card-view.css
@@ -22,6 +22,7 @@
 .project-card-view .phui-header-shell .phui-header-image {
   border: 3px solid #fff;
   border-radius: 3px;
+  background-color: #fff;
 }
 
 .project-card-view .phui-header-shell .phui-header-header {
@@ -70,7 +71,8 @@
 }
 
 .project-card-view.project-card-red .phui-header-shell {
-  background: linear-gradient(to bottom, {$sh-redbackground} 44px, #fff 44px);
+  background: linear-gradient(to bottom,
+    {$sh-redbackground} 42px, #fff 42px);
 }
 
 .project-card-view.project-card-orange {
@@ -78,7 +80,8 @@
 }
 
 .project-card-view.project-card-orange .phui-header-shell {
-  background: linear-gradient(to bottom, {$sh-orangebackground} 44px, #fff 44px);
+  background: linear-gradient(to bottom,
+    {$sh-orangebackground} 42px, #fff 42px);
 }
 
 .project-card-view.project-card-yellow {
@@ -86,7 +89,8 @@
 }
 
 .project-card-view.project-card-yellow .phui-header-shell {
-  background: linear-gradient(to bottom, {$sh-yellowbackground} 44px, #fff 44px);
+  background: linear-gradient(to bottom,
+    {$sh-yellowbackground} 42px, #fff 42px);
 }
 
 .project-card-view.project-card-green {
@@ -94,7 +98,8 @@
 }
 
 .project-card-view.project-card-green .phui-header-shell {
-  background: linear-gradient(to bottom, {$sh-greenbackground} 44px, #fff 44px);
+  background: linear-gradient(to bottom,
+    {$sh-greenbackground} 42px, #fff 42px);
 }
 
 .project-card-view.project-card-blue {
@@ -102,7 +107,8 @@
 }
 
 .project-card-view.project-card-blue .phui-header-shell {
-  background: linear-gradient(to bottom, {$sh-bluebackground} 44px, #fff 44px);
+  background: linear-gradient(to bottom,
+    {$sh-bluebackground} 42px, #fff 42px);
 }
 
 .project-card-view.project-card-indigo {
@@ -110,7 +116,8 @@
 }
 
 .project-card-view.project-card-indigo .phui-header-shell {
-  background: linear-gradient(to bottom, {$sh-indigobackground} 44px, #fff 44px);
+  background: linear-gradient(to bottom,
+    {$sh-indigobackground} 42px, #fff 42px);
 }
 
 .project-card-view.project-card-violet {
@@ -118,7 +125,8 @@
 }
 
 .project-card-view.project-card-violet .phui-header-shell {
-  background: linear-gradient(to bottom, {$sh-violetbackground} 44px, #fff 44px);
+  background: linear-gradient(to bottom,
+    {$sh-violetbackground} 42px, #fff 42px);
 }
 
 .project-card-view.project-card-pink {
@@ -126,25 +134,17 @@
 }
 
 .project-card-view.project-card-pink .phui-header-shell {
-  background: linear-gradient(to bottom, {$sh-pinkbackground} 44px, #fff 44px);
-}
-
-.project-card-view.project-card-grey {
-  border-color: {$sh-greyborder};
-}
-
-.project-card-view.project-card-grey .phui-header-shell {
-  background: linear-gradient(to bottom, {$sh-greybackground} 44px, #fff 44px);
+  background: linear-gradient(to bottom,
+    {$sh-pinkbackground} 42px, #fff 42px);
 }
 
+.project-card-view.project-card-grey,
 .project-card-view.project-card-checkered {
   border-color: {$sh-greyborder};
 }
 
+.project-card-view.project-card-grey .phui-header-shell,
 .project-card-view.project-card-checkered .phui-header-shell {
-  background-color: #fff;
-  background-image: linear-gradient(45deg, {$sh-greybackground} 25%, transparent 25%, transparent 75%, {$sh-greybackground} 75%, {$sh-greybackground}),
-    linear-gradient(45deg, {$sh-greybackground} 25%, transparent 25%, transparent 75%, {$sh-greybackground} 75%, {$sh-greybackground});
-  background-size: 16px 16px;
-  background-position:0 0, 8px 8px;
+  background: linear-gradient(to bottom,
+    {$sh-greybackground} 42px, #fff 42px);
 }