From ff9057fd824a5cf2146fd76b3e1658660931120c Mon Sep 17 00:00:00 2001
From: Chad Little <chad@chadsdomain.com>
Date: Sun, 25 May 2014 13:18:51 -0700
Subject: [PATCH] More tweaks, Conpherence

---
 .../view/ConpherenceMenuItemView.php          | 10 ----
 .../view/PhabricatorApplicationLaunchView.php |  7 ++-
 .../celerity/CelerityResourceTransformer.php  |  1 +
 .../phabricator-application-launch-view.css   | 33 +++----------
 .../rsrc/css/application/conpherence/menu.css | 48 +++++++++----------
 .../application/conpherence/message-pane.css  |  9 ++--
 .../css/layout/phabricator-crumbs-view.css    | 14 ++++--
 .../css/layout/phabricator-side-menu-view.css |  4 +-
 8 files changed, 52 insertions(+), 74 deletions(-)

diff --git a/src/applications/conpherence/view/ConpherenceMenuItemView.php b/src/applications/conpherence/view/ConpherenceMenuItemView.php
index 5450abf157..eaa24af46b 100644
--- a/src/applications/conpherence/view/ConpherenceMenuItemView.php
+++ b/src/applications/conpherence/view/ConpherenceMenuItemView.php
@@ -102,15 +102,6 @@ final class ConpherenceMenuItemView extends AphrontTagView {
         ),
         $this->subtitle);
     }
-    $epoch = null;
-    if ($this->epoch) {
-      $epoch = phutil_tag(
-        'span',
-        array(
-          'class' => 'conpherence-menu-item-date',
-        ),
-        phabricator_relative_date($this->epoch, $this->user));
-    }
     $unread_count = null;
     if ($this->unreadCount) {
       $unread_count = phutil_tag(
@@ -125,7 +116,6 @@ final class ConpherenceMenuItemView extends AphrontTagView {
       $image,
       $title,
       $subtitle,
-      $epoch,
       $unread_count,
     );
   }
diff --git a/src/applications/meta/view/PhabricatorApplicationLaunchView.php b/src/applications/meta/view/PhabricatorApplicationLaunchView.php
index 3c3f95c339..7863390b7f 100644
--- a/src/applications/meta/view/PhabricatorApplicationLaunchView.php
+++ b/src/applications/meta/view/PhabricatorApplicationLaunchView.php
@@ -84,6 +84,11 @@ final class PhabricatorApplicationLaunchView extends AphrontView {
           ),
           $counts[$warning]);
         }
+        if (nonempty($count1)) {
+          $numbers = array($count1, ' / ', $count2);
+        } else {
+          $numbers = array($count1, $count2);
+        }
 
         Javelin::initBehavior('phabricator-tooltips');
         $content[] = javelin_tag(
@@ -96,7 +101,7 @@ final class PhabricatorApplicationLaunchView extends AphrontView {
             ),
             'class' => 'phabricator-application-launch-attention',
           ),
-          array($count1, $count2));
+          $numbers);
       }
 
       $classes = array();
diff --git a/src/infrastructure/celerity/CelerityResourceTransformer.php b/src/infrastructure/celerity/CelerityResourceTransformer.php
index 201ea387e1..327785af39 100644
--- a/src/infrastructure/celerity/CelerityResourceTransformer.php
+++ b/src/infrastructure/celerity/CelerityResourceTransformer.php
@@ -193,6 +193,7 @@ final class CelerityResourceTransformer {
       'lightviolet'   => '#ecdff1',
       'charcoal'      => '#4b4d51',
       'backdrop'      => '#c4cde0',
+      'hovergrey'     => '#c5cbcf',
 
       // Base Greys
       'lightgreyborder'     => '#C7CCD9',
diff --git a/webroot/rsrc/css/application/base/phabricator-application-launch-view.css b/webroot/rsrc/css/application/base/phabricator-application-launch-view.css
index 28d82b1a86..b2bbcc9db0 100644
--- a/webroot/rsrc/css/application/base/phabricator-application-launch-view.css
+++ b/webroot/rsrc/css/application/base/phabricator-application-launch-view.css
@@ -47,7 +47,7 @@ div.phabricator-application-launch-container {
 }
 
 .device-desktop a.phabricator-application-launch-container:hover {
-  background-color: #C5C8CF;
+  background-color: {$hovergrey};
   text-decoration: none;
 }
 
@@ -58,7 +58,7 @@ div.phabricator-application-launch-container {
   font-size: 13px;
   margin-top: 7px;
   margin-left: 44px;
-  text-shadow: 0 1px 2px rgba(255, 255, 255, 0.9);
+  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.9);
 }
 
 .phabricator-application-launch-description {
@@ -66,7 +66,7 @@ div.phabricator-application-launch-container {
   font-size: 11px;
   margin-top: 24px;
   margin-left: 44px;
-  text-shadow: 0 1px 2px rgba(255, 255, 255, 0.9);
+  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.9);
 }
 
 .phabricator-application-beta {
@@ -79,32 +79,13 @@ div.phabricator-application-launch-container {
 
 .phabricator-application-launch-attention {
   position: absolute;
-  top: 6px;
-  right: 4px;
+  top: 17px;
+  right: 8px;
   color: {$darkbluetext};
   font-weight: bold;
-  font-size: 11px;
+  font-size: 12px;
 }
 
 .phabricator-application-attention-count {
-  background-color: rgba(0,0,0,.1);
-  color: {$orange};
-  border-radius: 2px;
-  padding: 1px 6px 2px;
-}
-
-.phabricator-application-warning-count {
-  background-color: rgba(0,0,0,.1);
-  border-radius: 2px;
-  padding: 1px 6px 2px;
-}
-
-.phabricator-application-attention-count + .phabricator-application-warning-count {
-  margin-left: 2px;
-  top: 8px;
-}
-
-.application-tile-full .phabricator-application-launch-attention {
-  top: 17px;
-  right: 8px;
+  color: {$sky};
 }
diff --git a/webroot/rsrc/css/application/conpherence/menu.css b/webroot/rsrc/css/application/conpherence/menu.css
index 9a3b858e45..3cc6c3e4ff 100644
--- a/webroot/rsrc/css/application/conpherence/menu.css
+++ b/webroot/rsrc/css/application/conpherence/menu.css
@@ -14,7 +14,7 @@
 .conpherence-layout .conpherence-no-threads {
   text-align: center;
   position: fixed;
-  left: 280px;
+  left: 240px;
   right: 241px;
   top: 76px;
   bottom: 0px;
@@ -43,7 +43,7 @@
 
 .device-desktop .conpherence-layout .conpherence-menu-pane,
 .device-desktop .conpherence-layout .phabricator-nav-column-background {
-  width: 280px;
+  width: 239px;
 }
 
 .device .conpherence-menu-pane {
@@ -73,7 +73,7 @@
 }
 
 .device-desktop .conpherence-content-pane {
-  margin-left: 280px;
+  margin-left: 240px;
 }
 
 .conpherence-content-pane {
@@ -89,20 +89,17 @@
 
 .conpherence-menu .conpherence-menu-item-view {
   display: block;
-  height: 55px;
+  height: 46px;
   width: 100%;
   overflow: hidden;
   position: relative;
   text-decoration: none;
-  border-top: solid 1px #3B3D3E;
-  border-bottom: solid 1px #1C1F21;
-  border-right: 0;
-  border-left: 2px solid transparent;
+  border-left: 4px solid transparent;
 }
 
 .conpherence-menu .conpherence-selected {
-  background: rgba(0, 0, 0, .6);
-  border-left: 2px solid #66CCFF;
+  background: {$hovergrey};
+  border-left: 4px solid {$blue};
 }
 
 .conpherence-menu .loading {
@@ -110,42 +107,41 @@
 }
 
 .device-desktop .conpherence-menu .conpherence-menu-item-view:hover {
-  background-image: url('/rsrc/image/texture/dark-menu-hover.png');
+  background-color: {$hovergrey};
 }
 
 .conpherence-menu .conpherence-menu-item-view .conpherence-menu-item-image {
   top: 6px;
-  left: 6px;
+  left: 8px;
   display: block;
   position: absolute;
-  width: 35px;
-  height: 35px;
-  background-size: 35px;
-  border: 4px solid rgb(29, 32, 34);
-  border-radius: 3px;
+  width: 30px;
+  height: 30px;
+  background-size: 30px;
+  border: 2px solid #fff;
+  border-radius: 2px;
 }
 
 .conpherence-menu .conpherence-menu-item-view .conpherence-menu-item-title {
   display: block;
-  margin-top: 12px;
-  margin-left: 58px;
+  margin-top: 8px;
+  margin-left: 50px;
   text-align: left;
   font-weight: bold;
   font-size: 13px;
-  color: #ffffff;
-  text-shadow: 0px 1px 1px #000000;
+  color: {$darkbluetext};
+  text-shadow: 0px 1px 1px #fff;
   overflow: hidden;
-  width: 140px;
+  width: 180px;
   text-overflow: ellipsis;
 }
 
 .conpherence-menu .conpherence-menu-item-view .conpherence-menu-item-subtitle {
   display: block;
-  color: #a1a5a9;
+  color: {$bluetext};
   font-size: 11px;
   margin-top: 2px;
-  margin-left: 58px;
-  font-style: italic;
+  margin-left: 50px;
 }
 
 .conpherence-menu .conpherence-menu-item-view
@@ -171,7 +167,7 @@
   position: absolute;
   top: 15px;
   right: 16px;
-  color: #a1a5a9;
+  color: {$bluetext};
   font-size: 11px;
 }
 
diff --git a/webroot/rsrc/css/application/conpherence/message-pane.css b/webroot/rsrc/css/application/conpherence/message-pane.css
index bd4e5323de..a42d8ef4c2 100644
--- a/webroot/rsrc/css/application/conpherence/message-pane.css
+++ b/webroot/rsrc/css/application/conpherence/message-pane.css
@@ -7,7 +7,7 @@
 .loading .messages-loading-icon,
 .conpherence-layout .conpherence-no-threads {
   position: fixed;
-  left: 280px;
+  left: 240px;
   right: 241px;
   top: 76px;
   bottom: 0px;
@@ -47,12 +47,11 @@
 
 .conpherence-message-pane .conpherence-messages {
   position: fixed;
-  left: 280px;
+  left: 240px;
   right: 241px;
   top: 76px;
   bottom: 185px;
   overflow-y: auto;
-  box-shadow: inset 1px 4px 5px rgba(0,0,0,0.1);
   -webkit-overflow-scrolling: touch;
 }
 
@@ -81,7 +80,7 @@
   padding: 0;
   position: fixed;
   bottom: 0;
-  left: 280px;
+  left: 240px;
   right: 241px;
 }
 
@@ -196,7 +195,7 @@
 }
 .conpherence-message-pane .remarkup-assist-bar {
   border-width: 1px 0 0;
-  border-color: #CCC;
+  border-color: {$hovergrey};
   border-bottom: transparent;
 }
 
diff --git a/webroot/rsrc/css/layout/phabricator-crumbs-view.css b/webroot/rsrc/css/layout/phabricator-crumbs-view.css
index 4b8a6d7faf..718cd14831 100644
--- a/webroot/rsrc/css/layout/phabricator-crumbs-view.css
+++ b/webroot/rsrc/css/layout/phabricator-crumbs-view.css
@@ -12,6 +12,7 @@
   /* TODO: Position this over the slider for Differential's file tree view.
      Remove this once that gets sorted out. */
   position: relative;
+  -webkit-font-smoothing: antialiased;
 }
 
 .phabricator-crumbs-view,
@@ -20,7 +21,7 @@
   color: {$darkgreytext};
   font-weight: bold;
   text-decoration: none;
-  text-shadow: 0 1px 2px rgba(255, 255, 255, 0.9);
+  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.9);
 }
 
 .phabricator-crumbs-view a.phabricator-crumbs-action-disabled {
@@ -43,7 +44,7 @@
   border-top: none;
 }
 
-.phabricator-crumbs-view a:hover {
+.device-desktop .phabricator-crumbs-view a:hover {
   text-decoration: underline;
 }
 
@@ -82,13 +83,18 @@
 .phabricator-crumbs-action {
   display: inline-block;
   height: 17px;
-  padding: 8px 14px 8px 24px;
+  padding: 8px 12px;
   position: relative;
 }
 
 .device-phone a.phabricator-crumbs-action {
   padding: 7px;
-  border-left: 1px solid #ccc;
+  border-left: 1px solid {$hovergrey};
+}
+
+.device-desktop a.phabricator-crumbs-action:hover {
+  background: rgba(205, 207, 211, .5);
+  text-decoration: none;
 }
 
 .device-phone .phabricator-crumbs-action-name {
diff --git a/webroot/rsrc/css/layout/phabricator-side-menu-view.css b/webroot/rsrc/css/layout/phabricator-side-menu-view.css
index d369d7abde..097432a806 100644
--- a/webroot/rsrc/css/layout/phabricator-side-menu-view.css
+++ b/webroot/rsrc/css/layout/phabricator-side-menu-view.css
@@ -19,7 +19,7 @@
 .phabricator-side-menu .phui-list-item-selected,
 .device-desktop .phui-side-menu
  .phui-list-item-selected.phui-list-item-href:hover {
-  background-color: #C5C8CF;
+  background-color: {$hovergrey};
   border-left: 4px solid {$blue};
 }
 
@@ -38,5 +38,5 @@
 
 .device-desktop .phabricator-side-menu a.phui-list-item-href:hover {
   text-decoration: none;
-  background-color: #C5C8CF;
+  background-color: {$hovergrey};
 }