[Redesign] Small pass at dashboards

Summary: Mostly for testing, I think these need to be re-written to just use PHUIObjectBox, which means re-writing ManiphestView or whatever. Suspect much work.

Test Plan: visist a few dashboards

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: Korvin, epriestley

Differential Revision: https://secure.phabricator.com/D12764

resources/celerity/map.php

@@ -7,7 +7,7 @@
  */
 return array(
   'names' => array(
-    'core.pkg.css' => 'f43f9731',
+    'core.pkg.css' => 'c71b1a2e',
     'core.pkg.js' => '60924527',
     'darkconsole.pkg.js' => 'e7393ebb',
     'differential.pkg.css' => 'bb338e4b',
@@ -18,7 +18,7 @@ return array(
     'maniphest.pkg.js' => 'df4aa49f',
     'rsrc/css/aphront/aphront-bars.css' => '231ac33c',
     'rsrc/css/aphront/dark-console.css' => '6378ef3d',
-    'rsrc/css/aphront/dialog-view.css' => '9b32db0a',
+    'rsrc/css/aphront/dialog-view.css' => '725f2f23',
     'rsrc/css/aphront/lightbox-attachment.css' => '7acac05d',
     'rsrc/css/aphront/list-filter-view.css' => '1fb5cab3',
     'rsrc/css/aphront/multi-column.css' => 'fd18389d',
@@ -53,7 +53,7 @@ return array(
     'rsrc/css/application/conpherence/widget-pane.css' => '2af42ebe',
     'rsrc/css/application/contentsource/content-source-view.css' => '4b8b05d4',
     'rsrc/css/application/countdown/timer.css' => '86b7b0a0',
-    'rsrc/css/application/dashboard/dashboard.css' => '17937d22',
+    'rsrc/css/application/dashboard/dashboard.css' => 'db1d30b0',
     'rsrc/css/application/diff/inline-comment-summary.css' => 'eb5f8e8c',
     'rsrc/css/application/differential/add-comment.css' => 'c47f8c40',
     'rsrc/css/application/differential/changeset-view.css' => 'e19cfd6e',
@@ -122,27 +122,27 @@ return array(
     'rsrc/css/phui/calendar/phui-calendar-list.css' => 'c1d0ca59',
     'rsrc/css/phui/calendar/phui-calendar-month.css' => 'a92e47d2',
     'rsrc/css/phui/calendar/phui-calendar.css' => '8675968e',
-    'rsrc/css/phui/phui-action-header-view.css' => '89c497e7',
+    'rsrc/css/phui/phui-action-header-view.css' => 'e4471f43',
     'rsrc/css/phui/phui-action-list.css' => '4f4d09f2',
     'rsrc/css/phui/phui-action-panel.css' => '3ee9afd5',
     'rsrc/css/phui/phui-box.css' => 'a5bb366d',
     'rsrc/css/phui/phui-button.css' => 'de610129',
     'rsrc/css/phui/phui-crumbs-view.css' => 'aeff7a21',
-    'rsrc/css/phui/phui-document.css' => '94d5dcd8',
+    'rsrc/css/phui/phui-document.css' => '7b564cf6',
     'rsrc/css/phui/phui-feed-story.css' => 'c9f3a0b5',
     'rsrc/css/phui/phui-fontkit.css' => 'dd8ddf27',
-    'rsrc/css/phui/phui-form-view.css' => '17eace76',
+    'rsrc/css/phui/phui-form-view.css' => 'ddec8479',
     'rsrc/css/phui/phui-form.css' => 'f535f938',
-    'rsrc/css/phui/phui-header-view.css' => '2cb22ba2',
+    'rsrc/css/phui/phui-header-view.css' => 'a1d2905a',
     'rsrc/css/phui/phui-icon.css' => 'bc766998',
     'rsrc/css/phui/phui-image-mask.css' => '5a8b09c8',
     'rsrc/css/phui/phui-info-panel.css' => '27ea50a1',
-    'rsrc/css/phui/phui-info-view.css' => 'c6f0aef8',
+    'rsrc/css/phui/phui-info-view.css' => '13c10a8e',
     'rsrc/css/phui/phui-list.css' => '2e25ebfb',
-    'rsrc/css/phui/phui-object-box.css' => 'ab4f0f61',
+    'rsrc/css/phui/phui-object-box.css' => '2d3b3b42',
-    'rsrc/css/phui/phui-object-item-list-view.css' => 'bfe590d4',
+    'rsrc/css/phui/phui-object-item-list-view.css' => '172ea456',
     'rsrc/css/phui/phui-pinboard-view.css' => 'eaab2b1b',
-    'rsrc/css/phui/phui-property-list-view.css' => 'da85c07d',
+    'rsrc/css/phui/phui-property-list-view.css' => 'd2d143ea',
     'rsrc/css/phui/phui-remarkup-preview.css' => '19ad512b',
     'rsrc/css/phui/phui-spacing.css' => '042804d6',
     'rsrc/css/phui/phui-status.css' => '888cedb8',
@@ -494,7 +494,7 @@ return array(
     'almanac-css' => 'dbb9b3af',
     'aphront-bars' => '231ac33c',
     'aphront-dark-console-css' => '6378ef3d',
-    'aphront-dialog-view-css' => '9b32db0a',
+    'aphront-dialog-view-css' => '725f2f23',
     'aphront-list-filter-view-css' => '1fb5cab3',
     'aphront-multi-column-view-css' => 'fd18389d',
     'aphront-pager-view-css' => '2e3539af',
@@ -714,7 +714,7 @@ return array(
     'phabricator-content-source-view-css' => '4b8b05d4',
     'phabricator-core-css' => 'cee2aadb',
     'phabricator-countdown-css' => '86b7b0a0',
-    'phabricator-dashboard-css' => '17937d22',
+    'phabricator-dashboard-css' => 'db1d30b0',
     'phabricator-drag-and-drop-file-upload' => '07de8873',
     'phabricator-draggable-list' => 'a16ec1c6',
     'phabricator-fatal-config-template-css' => '8e6c6fcd',
@@ -766,7 +766,7 @@ return array(
     'phortune-css' => '9149f103',
     'phrequent-css' => 'ffc185ad',
     'phriction-document-css' => '0d16bc9a',
-    'phui-action-header-view-css' => '89c497e7',
+    'phui-action-header-view-css' => 'e4471f43',
     'phui-action-panel-css' => '3ee9afd5',
     'phui-box-css' => 'a5bb366d',
     'phui-button-css' => 'de610129',
@@ -775,23 +775,23 @@ return array(
     'phui-calendar-list-css' => 'c1d0ca59',
     'phui-calendar-month-css' => 'a92e47d2',
     'phui-crumbs-view-css' => 'aeff7a21',
-    'phui-document-view-css' => '94d5dcd8',
+    'phui-document-view-css' => '7b564cf6',
     'phui-feed-story-css' => 'c9f3a0b5',
     'phui-font-icon-base-css' => '3dad2ae3',
     'phui-fontkit-css' => 'dd8ddf27',
     'phui-form-css' => 'f535f938',
-    'phui-form-view-css' => '17eace76',
+    'phui-form-view-css' => 'ddec8479',
-    'phui-header-view-css' => '2cb22ba2',
+    'phui-header-view-css' => 'a1d2905a',
     'phui-icon-view-css' => 'bc766998',
     'phui-image-mask-css' => '5a8b09c8',
     'phui-info-panel-css' => '27ea50a1',
-    'phui-info-view-css' => 'c6f0aef8',
+    'phui-info-view-css' => '13c10a8e',
     'phui-inline-comment-view-css' => '2174771a',
     'phui-list-view-css' => '2e25ebfb',
-    'phui-object-box-css' => 'ab4f0f61',
+    'phui-object-box-css' => '2d3b3b42',
-    'phui-object-item-list-view-css' => 'bfe590d4',
+    'phui-object-item-list-view-css' => '172ea456',
     'phui-pinboard-view-css' => 'eaab2b1b',
-    'phui-property-list-view-css' => 'da85c07d',
+    'phui-property-list-view-css' => 'd2d143ea',
     'phui-remarkup-preview-css' => '19ad512b',
     'phui-spacing-css' => '042804d6',
     'phui-status-list-view-css' => '888cedb8',

src/applications/dashboard/engine/PhabricatorDashboardPanelRenderingEngine.php

@@ -214,14 +214,14 @@ final class PhabricatorDashboardPanelRenderingEngine extends Phobject {
       case self::HEADER_MODE_EDIT:
         $header = id(new PHUIActionHeaderView())
           ->setHeaderTitle($panel->getName())
-          ->setHeaderColor(PHUIActionHeaderView::HEADER_LIGHTBLUE);
+          ->setHeaderColor(PHUIActionHeaderView::HEADER_WHITE);
         $header = $this->addPanelHeaderActions($header);
         break;
       case self::HEADER_MODE_NORMAL:
       default:
         $header = id(new PHUIActionHeaderView())
           ->setHeaderTitle($panel->getName())
-          ->setHeaderColor(PHUIActionHeaderView::HEADER_LIGHTBLUE);
+          ->setHeaderColor(PHUIActionHeaderView::HEADER_WHITE);
         $panel_type = $panel->getImplementation();
         $header = $panel_type->adjustPanelHeader(
           $this->getViewer(),

src/view/AphrontDialogView.php

@@ -12,7 +12,7 @@ final class AphrontDialogView extends AphrontView {
   private $class;
   private $renderAsForm = true;
   private $formID;
-  private $headerColor = PHUIActionHeaderView::HEADER_LIGHTBLUE;
+  private $headerColor = PHUIActionHeaderView::HEADER_WHITE;
   private $footers = array();
   private $isStandalone;
   private $method = 'POST';

src/view/phui/PHUIDocumentView.php

@@ -25,7 +25,7 @@ final class PHUIDocumentView extends AphrontTagView {
   }
 
   public function setHeader(PHUIHeaderView $header) {
-    $header->setHeaderColor(PHUIActionHeaderView::HEADER_LIGHTBLUE);
+    $header->setHeaderColor(PHUIActionHeaderView::HEADER_WHITE);
     $this->header = $header;
     return $this;
   }

webroot/rsrc/css/aphront/dialog-view.css

@@ -6,8 +6,7 @@
   width: 540px;
   margin: 32px auto 16px;
   border: 1px solid {$lightblueborder};
-  border-bottom: 1px solid {$blueborder};
+  border-radius: 3px;
-  box-shadow: {$dropshadow};
 }
 
 .device-phone .aphront-dialog-view {
@@ -19,17 +18,17 @@
   margin: auto;
 }
 
-.aphront-dialog-head .phui-action-header {
+.aphront-dialog-head {
-  border-bottom: 1px solid {$lightblueborder};
+  padding: 4px 12px 0 12px;
-  padding: 8px 16px;
+  background: #fff;
-  white-space: nowrap;
+  border-top-left-radius: 3px;
+  border-top-right-radius: 3px;
 }
 
-.aphront-dialog-head .phui-action-header
+.aphront-dialog-head .phui-action-header {
-  .phui-action-header-title {
+  border-bottom: 1px solid {$thinblueborder};
-  font-size: 15px;
+  padding: 0 0 4px 0;
-  color: {$darkbluetext};
+  white-space: nowrap;
-  text-shadow: 0 1px 2px #fff;
 }
 
 .aphront-dialog-flush .aphront-dialog-body {
@@ -45,7 +44,7 @@
 }
 
 .aphront-dialog-body {
-  background: #ffffff;
+  background: #fff;
   padding: 16px;
   border: none;
 }
@@ -60,6 +59,8 @@
 .aphront-dialog-foot {
   padding: 6px 0;
   float: left;
+  border-bottom-left-radius: 3px;
+  border-bottom-right-radius: 3px;
 }
 
 .aphront-dialog-tail button,
@@ -69,8 +70,8 @@
 }
 
 .jx-client-dialog {
-  position:   absolute;
+  position: absolute;
-  width:      100%;
+  width: 100%;
 }
 
 .jx-mask {

webroot/rsrc/css/application/dashboard/dashboard.css

@@ -77,11 +77,5 @@
 .dashboard-panel .dashboard-box {
   padding: 12px;
   background: #fff;
-  border-left: 1px solid {$lightblueborder};
+  border: 1px solid {$lightblueborder};
-  border-right: 1px solid {$lightblueborder};
-  border-bottom: 1px solid {$blueborder};
-}
-
-.dashboard-panel .sprite-gradient .phui-action-header-title {
-  padding: 10px 4px;
 }

webroot/rsrc/css/phui/phui-action-header-view.css

@@ -8,14 +8,13 @@
 }
 
 .phui-action-header-title {
-  color: {$darkgreytext};
+  color: #000;
   float: left;
-  font-size: 14px;
+  font-size: 15px;
-  font-weight: bold;
+  font-weight: normal;
   line-height: 15px;
-  padding: 8px 0;
+  padding: 12px 0;
   white-space: nowrap;
-  -webkit-font-smoothing: antialiased;
 }
 
 .gradient-lightblue-header .phui-action-header-title {
@@ -46,7 +45,7 @@
 }
 
 .phui-action-header-link {
-  color: {$darkgreytext};
+  color: #000;
 }
 
 .phui-action-header.gradient-white-header {

webroot/rsrc/css/phui/phui-document.css

@@ -4,12 +4,16 @@
 
 .phui-document-view {
   margin-bottom: 16px;
+  border-radius: 3px;
   position: relative;
 }
 
+.phui-document-content {
+  border-radius: 3px;
+}
+
 .device-desktop .phui-document-view {
   border: 1px solid {$lightblueborder};
-  border-bottom: 1px solid {$blueborder};
   max-width: 960px;
   margin: 16px auto;
 }
@@ -74,7 +78,7 @@
 
 .phui-document-content .phui-header-shell {
   border-top: none;
-  border-bottom: 1px solid {$lightblueborder};
+  border-bottom: 1px solid {$thinblueborder};
 }
 
 .phui-document-content
@@ -90,20 +94,20 @@
   font-size: 15px;
 }
 
-.phui-document-content .phui-header-view {
+.phui-document-content h1.phui-header-view {
-  color: {$darkbluetext};
+  font-weight: normal;
-  text-shadow: 0 1px 2px #fff;
+  color: #000;
 }
 
 .phui-document-content .phui-property-list-container {
-  border-color: #dde8ef;
+  border-color: {$thinblueborder};
 }
 
 .phui-document-content .phui-property-list-view {
   border: none;
   box-shadow: none;
   margin: 0;
-  background-color: #f6f7f8;
+  background-color: {$lightgreybackground};
 }
 
 .phui-document-content {

webroot/rsrc/css/phui/phui-form-view.css

@@ -77,10 +77,6 @@
   display: none;
 }
 
-.aphront-dialog-body .phui-form-full-width {
-  margin-top: -10px;
-}
-
 .aphront-dialog-body .phui-form-view {
   padding: 0;
 }

webroot/rsrc/css/phui/phui-header-view.css

@@ -42,7 +42,7 @@ body .phui-header-shell.phui-bleed-header
 .phui-header-view {
   padding: 16px;
   font-size: 15px;
-  color: {$darkbluetext};
+  color: #000;
   position: relative;
 }
 

webroot/rsrc/css/phui/phui-info-view.css

@@ -4,12 +4,10 @@
 
 .phui-info-view {
   border-style: solid;
-  border-left-width: 4px;
+  border-width: 1px;
-}
-
-.phui-info-view {
   margin: 16px;
   padding: 12px;
+  border-radius: 3px;
 }
 
 .device-phone .phui-info-view {
@@ -21,7 +19,7 @@
 }
 
 .phui-info-view-body {
-  line-height: 1.45em;
+  line-height: 1.6em;
 }
 
 .phui-info-view-actions {
@@ -40,7 +38,8 @@
 
 h1.phui-info-view-head {
   font-weight: bold;
-  font-size: 15px;
+  font-size: 14px;
+  line-height: 1.2em;
 }
 
 .phui-info-view-list {
@@ -111,9 +110,7 @@ h1.phui-info-view-head {
 }
 
 .aphront-dialog-body .phui-info-view {
-  margin: -16px -16px 16px -16px;
+  margin: 0 0 8px 0;
-  border-width: 0 0 1px 0;
-  border-bottom: 1px solid {$lightblueborder};
 }
 
 .aphront-dialog-body .phui-info-view .phui-info-view-list {
@@ -121,26 +118,11 @@ h1.phui-info-view-head {
   list-style: disc;
 }
 
-.phui-object-box .phui-info-severity-error,
-.aphront-dialog-body .phui-info-severity-error {
-  color: {$red};
-}
-
 .phui-object-box .phui-info-severity-warning,
 .aphront-dialog-body .phui-info-severity-warning {
   color: #bc7837;
 }
 
-.phui-object-box .phui-info-severity-notice,
-.aphront-dialog-body .phui-info-severity-notice {
-  color: {$blue};
-}
-
-.phui-object-box .phui-info-severity-success,
-.aphront-dialog-body .phui-info-severity-success {
-  color: {$green};
-}
-
 .phui-crumbs-view + .phui-info-view {
   margin-top: 0;
 }

webroot/rsrc/css/phui/phui-object-box.css

@@ -26,10 +26,6 @@ div.phui-object-box.phui-object-box-flush {
   font-weight: normal;
 }
 
-.phui-object-box .phui-header-tall.phui-header-shell h1 {
-  font-weight: bold;
-}
-
 .phui-object-box .phui-header-shell + .phui-info-view {
   margin: 0;
   border-width: 0;

webroot/rsrc/css/phui/phui-object-item-list-view.css

@@ -48,9 +48,7 @@ ul.phui-object-item-list-view {
 }
 
 .phui-object-item-frame {
-  border-style: solid;
+  border: 1px solid {$lightgreyborder};
-  border-color: {$lightgreyborder};
-  border-width: 1px 1px 1px 0;
   position: relative;
   min-height: 33px;
   overflow: hidden;
@@ -232,7 +230,6 @@ ul.phui-object-item-list-view {
 .phui-object-item-list-view.phui-object-list-stackable
   .phui-object-item {
   margin: -1px 0 0 0;
-  border-left-width: 1px;
   background: #fff;
 }
 
@@ -349,54 +346,6 @@ ul.phui-object-item-icons {
   margin-right: 4px;
 }
 
-
-/* - Bar Colors ----------------------------------------------------------------
-
-  Colors for the left-hand border bars, used to indicate object status or other
-  attributes.
-
-*/
-
-.phui-object-item-bar-color-red {
-  border-left-color: {$red};
-}
-
-.phui-object-item-bar-color-orange {
-  border-left-color: {$orange};
-}
-
-.phui-object-item-bar-color-yellow {
-  border-left-color: {$yellow};
-}
-
-.phui-object-item-bar-color-green {
-  border-left-color: {$green};
-}
-
-.phui-object-item-bar-color-sky {
-  border-left-color: {$sky};
-}
-
-.phui-object-item-bar-color-blue {
-  border-left-color: {$blue};
-}
-
-.phui-object-item-bar-color-indigo {
-  border-left-color: {$indigo};
-}
-
-.phui-object-item-bar-color-violet {
-  border-left-color: {$violet};
-}
-
-.phui-object-item-bar-color-grey {
-  border-left-color: #bdc3c7;
-}
-
-.phui-object-item-bar-color-black {
-  border-left-color: #333333;
-}
-
 /* - Disabled ------------------------------------------------------------------
 
   Disabled/inactive objects.
@@ -430,7 +379,6 @@ ul.phui-object-item-icons {
 
 .phui-object-item.phui-object-item-highlighted {
   background: {$lightyellow};
-  border-left-color: {$yellow};
 }
 
 .phui-object-item-highlighted .phui-object-item-frame {
@@ -439,7 +387,6 @@ ul.phui-object-item-icons {
 
 .phui-object-item-selected {
   background: {$lightblue};
-  border-left-color: {$blue};
 }
 
 .phui-object-item-selected .phui-object-item-frame {
@@ -646,7 +593,7 @@ ul.phui-object-item-icons {
   padding: 0;
   border-left: 1px solid {$lightblueborder};
   border-right: 1px solid {$lightblueborder};
-  border-bottom: 1px solid {$blueborder};
+  border-bottom: 1px solid {$lightblueborder};
   margin-bottom: -1px;
 }
 
@@ -655,7 +602,6 @@ ul.phui-object-item-icons {
   margin: 0;
   background-image: none;
   background-color: #fff;
-  border-left-width: 4px;
 }
 
 .dashboard-panel .phui-object-item-frame,

webroot/rsrc/css/phui/phui-property-list-view.css

@@ -90,7 +90,7 @@
 
 .phui-property-list-section-header {
   color: {$bluetext};
-  padding: 12px 16px 0px;
+  padding: 16px 4px 0px;
   text-transform: uppercase;
   font-weight: 700;
   border-color: {$thinblueborder};
@@ -112,7 +112,7 @@
 }
 
 .phui-property-list-text-content {
-  padding: 12px 16px;
+  padding: 12px 4px;
   overflow: hidden;
 }