diff --git a/resources/celerity/map.php b/resources/celerity/map.php --- a/resources/celerity/map.php +++ b/resources/celerity/map.php @@ -7,7 +7,7 @@ */ return array( 'names' => array( - 'core.pkg.css' => '178ec7e2', + 'core.pkg.css' => 'ee5f31e2', 'core.pkg.js' => 'f3e08b38', 'darkconsole.pkg.js' => 'e7393ebb', 'differential.pkg.css' => 'bb338e4b', @@ -54,7 +54,7 @@ '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' => 'db1d30b0', + 'rsrc/css/application/dashboard/dashboard.css' => 'eb458607', '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', @@ -68,7 +68,7 @@ 'rsrc/css/application/diffusion/diffusion-icons.css' => '9c5828da', 'rsrc/css/application/diffusion/diffusion-readme.css' => '2106ea08', 'rsrc/css/application/diffusion/diffusion-source.css' => '66fdf661', - 'rsrc/css/application/feed/feed.css' => 'b513b5f4', + 'rsrc/css/application/feed/feed.css' => 'f1aa8c11', 'rsrc/css/application/files/global-drag-and-drop.css' => '697324ad', 'rsrc/css/application/flag/flag.css' => '5337623f', 'rsrc/css/application/harbormaster/harbormaster.css' => '49d64eb4', @@ -123,25 +123,25 @@ 'rsrc/css/phui/calendar/phui-calendar-list.css' => 'c1d0ca59', 'rsrc/css/phui/calendar/phui-calendar-month.css' => '75e6a2ee', 'rsrc/css/phui/calendar/phui-calendar.css' => '8675968e', - 'rsrc/css/phui/phui-action-header-view.css' => 'e4471f43', + 'rsrc/css/phui/phui-action-header-view.css' => 'd1cb5f81', '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-button.css' => '8ad2873e', 'rsrc/css/phui/phui-crumbs-view.css' => 'aeff7a21', 'rsrc/css/phui/phui-document.css' => '7b564cf6', 'rsrc/css/phui/phui-feed-story.css' => 'c9f3a0b5', 'rsrc/css/phui/phui-fontkit.css' => '1e71371a', 'rsrc/css/phui/phui-form-view.css' => 'e1abbe8e', 'rsrc/css/phui/phui-form.css' => 'f535f938', - 'rsrc/css/phui/phui-header-view.css' => 'c2855306', - 'rsrc/css/phui/phui-icon.css' => 'bc766998', + 'rsrc/css/phui/phui-header-view.css' => '55088578', + 'rsrc/css/phui/phui-icon.css' => '88ba9081', 'rsrc/css/phui/phui-image-mask.css' => '5a8b09c8', 'rsrc/css/phui/phui-info-panel.css' => '27ea50a1', 'rsrc/css/phui/phui-info-view.css' => '33595731', 'rsrc/css/phui/phui-list.css' => '2e25ebfb', - 'rsrc/css/phui/phui-object-box.css' => '3a601bc5', - 'rsrc/css/phui/phui-object-item-list-view.css' => 'e052f697', + 'rsrc/css/phui/phui-object-box.css' => '8d9239e5', + 'rsrc/css/phui/phui-object-item-list-view.css' => 'dad96ede', 'rsrc/css/phui/phui-pinboard-view.css' => 'eaab2b1b', 'rsrc/css/phui/phui-property-list-view.css' => 'd2d143ea', 'rsrc/css/phui/phui-remarkup-preview.css' => '19ad512b', @@ -702,11 +702,11 @@ 'phabricator-content-source-view-css' => '4b8b05d4', 'phabricator-core-css' => '6230ff55', 'phabricator-countdown-css' => '86b7b0a0', - 'phabricator-dashboard-css' => 'db1d30b0', + 'phabricator-dashboard-css' => 'eb458607', 'phabricator-drag-and-drop-file-upload' => '07de8873', 'phabricator-draggable-list' => 'a16ec1c6', 'phabricator-fatal-config-template-css' => '8e6c6fcd', - 'phabricator-feed-css' => 'b513b5f4', + 'phabricator-feed-css' => 'f1aa8c11', 'phabricator-file-upload' => '477359c8', 'phabricator-filetree-view-css' => 'fccf9f82', 'phabricator-flag-css' => '5337623f', @@ -754,10 +754,10 @@ 'phortune-css' => '9149f103', 'phrequent-css' => 'ffc185ad', 'phriction-document-css' => '0d16bc9a', - 'phui-action-header-view-css' => 'e4471f43', + 'phui-action-header-view-css' => 'd1cb5f81', 'phui-action-panel-css' => '3ee9afd5', 'phui-box-css' => 'a5bb366d', - 'phui-button-css' => 'de610129', + 'phui-button-css' => '8ad2873e', 'phui-calendar-css' => '8675968e', 'phui-calendar-day-css' => '38891735', 'phui-calendar-list-css' => 'c1d0ca59', @@ -769,15 +769,15 @@ 'phui-fontkit-css' => '1e71371a', 'phui-form-css' => 'f535f938', 'phui-form-view-css' => 'e1abbe8e', - 'phui-header-view-css' => 'c2855306', - 'phui-icon-view-css' => 'bc766998', + 'phui-header-view-css' => '55088578', + 'phui-icon-view-css' => '88ba9081', 'phui-image-mask-css' => '5a8b09c8', 'phui-info-panel-css' => '27ea50a1', 'phui-info-view-css' => '33595731', 'phui-inline-comment-view-css' => '2174771a', 'phui-list-view-css' => '2e25ebfb', - 'phui-object-box-css' => '3a601bc5', - 'phui-object-item-list-view-css' => 'e052f697', + 'phui-object-box-css' => '8d9239e5', + 'phui-object-item-list-view-css' => 'dad96ede', 'phui-pinboard-view-css' => 'eaab2b1b', 'phui-property-list-view-css' => 'd2d143ea', 'phui-remarkup-preview-css' => '19ad512b', diff --git a/src/applications/celerity/CelerityResourceTransformer.php b/src/applications/celerity/CelerityResourceTransformer.php --- a/src/applications/celerity/CelerityResourceTransformer.php +++ b/src/applications/celerity/CelerityResourceTransformer.php @@ -191,6 +191,7 @@ 'lightblue' => '#daeaf3', 'sky' => '#3498db', 'lightsky' => '#ddeef9', + 'fire' => '#fa4b2a', 'indigo' => '#6e5cb6', 'lightindigo' => '#eae6f7', 'pink' => '#da49be', diff --git a/src/applications/dashboard/engine/PhabricatorDashboardPanelRenderingEngine.php b/src/applications/dashboard/engine/PhabricatorDashboardPanelRenderingEngine.php --- a/src/applications/dashboard/engine/PhabricatorDashboardPanelRenderingEngine.php +++ b/src/applications/dashboard/engine/PhabricatorDashboardPanelRenderingEngine.php @@ -154,16 +154,14 @@ $header = null; break; case self::HEADER_MODE_EDIT: - $header = id(new PHUIActionHeaderView()) - ->setHeaderTitle($title) - ->setHeaderColor(PHUIActionHeaderView::HEADER_LIGHTBLUE); + $header = id(new PHUIHeaderView()) + ->setHeader($title); $header = $this->addPanelHeaderActions($header); break; case self::HEADER_MODE_NORMAL: default: - $header = id(new PHUIActionHeaderView()) - ->setHeaderTitle($title) - ->setHeaderColor(PHUIActionHeaderView::HEADER_LIGHTBLUE); + $header = id(new PHUIHeaderView()) + ->setHeaderTitle($title); break; } $icon = id(new PHUIIconView()) @@ -187,20 +185,14 @@ if (!$id) { $id = celerity_generate_unique_node_id(); } - return javelin_tag( - 'div', - array( - 'id' => $id, - 'sigil' => 'dashboard-panel', - 'meta' => array( - 'objectPHID' => $panel->getPHID(), - ), - 'class' => 'dashboard-panel', - ), - array( - $header, - $content, - )); + $box = id(new PHUIObjectBoxView()) + ->setHeader($header) + ->appendChild($content) + ->setID($id) + ->addSigil('dashboard-panel') + ->setMetadata(array('objectPHID' => $panel->getPHID())); + + return phutil_tag_div('dashboard-pane', $box); } @@ -212,16 +204,14 @@ $header = null; break; case self::HEADER_MODE_EDIT: - $header = id(new PHUIActionHeaderView()) - ->setHeaderTitle($panel->getName()) - ->setHeaderColor(PHUIActionHeaderView::HEADER_WHITE); + $header = id(new PHUIHeaderView()) + ->setHeader($panel->getName()); $header = $this->addPanelHeaderActions($header); break; case self::HEADER_MODE_NORMAL: default: - $header = id(new PHUIActionHeaderView()) - ->setHeaderTitle($panel->getName()) - ->setHeaderColor(PHUIActionHeaderView::HEADER_WHITE); + $header = id(new PHUIHeaderView()) + ->setHeader($panel->getName()); $panel_type = $panel->getImplementation(); $header = $panel_type->adjustPanelHeader( $this->getViewer(), @@ -234,7 +224,7 @@ } private function addPanelHeaderActions( - PHUIActionHeaderView $header) { + PHUIHeaderView $header) { $panel = $this->getPanel(); $dashboard_id = $this->getDashboardID(); @@ -247,7 +237,7 @@ ->setIconFont('fa-pencil') ->setWorkflow(true) ->setHref((string) $edit_uri); - $header->addAction($action_edit); + $header->addActionIcon($action_edit); if ($dashboard_id) { $uri = id(new PhutilURI( @@ -257,7 +247,7 @@ ->setIconFont('fa-trash-o') ->setHref((string) $uri) ->setWorkflow(true); - $header->addAction($action_remove); + $header->addActionIcon($action_remove); } return $header; } diff --git a/src/applications/dashboard/paneltype/PhabricatorDashboardPanelType.php b/src/applications/dashboard/paneltype/PhabricatorDashboardPanelType.php --- a/src/applications/dashboard/paneltype/PhabricatorDashboardPanelType.php +++ b/src/applications/dashboard/paneltype/PhabricatorDashboardPanelType.php @@ -41,7 +41,7 @@ PhabricatorUser $viewer, PhabricatorDashboardPanel $panel, PhabricatorDashboardPanelRenderingEngine $engine, - PHUIActionHeaderView $header) { + PHUIHeaderView $header) { return $header; } diff --git a/src/applications/dashboard/paneltype/PhabricatorDashboardQueryPanelType.php b/src/applications/dashboard/paneltype/PhabricatorDashboardQueryPanelType.php --- a/src/applications/dashboard/paneltype/PhabricatorDashboardQueryPanelType.php +++ b/src/applications/dashboard/paneltype/PhabricatorDashboardQueryPanelType.php @@ -111,11 +111,15 @@ PhabricatorUser $viewer, PhabricatorDashboardPanel $panel, PhabricatorDashboardPanelRenderingEngine $engine, - PHUIActionHeaderView $header) { + PHUIHeaderView $header) { $search_engine = $this->getSearchEngine($panel); $key = $panel->getProperty('key'); - $header->setHeaderHref($search_engine->getQueryResultsPageURI($key)); + $href = $search_engine->getQueryResultsPageURI($key); + $icon = id(new PHUIIconView()) + ->setIconFont('fa-search') + ->setHref($href); + $header->addActionIcon($icon); return $header; } diff --git a/src/view/phui/PHUIHeaderView.php b/src/view/phui/PHUIHeaderView.php --- a/src/view/phui/PHUIHeaderView.php +++ b/src/view/phui/PHUIHeaderView.php @@ -18,6 +18,7 @@ private $buttonBar = null; private $policyObject; private $epoch; + private $actionIcons = array(); public function setHeader($header) { $this->header = $header; @@ -79,6 +80,11 @@ return $this; } + public function addActionIcon(PHUIIconView $action) { + $this->actionIcons[] = $action; + return $this; + } + public function setButtonBar(PHUIButtonBarView $bb) { $this->buttonBar = $bb; return $this; @@ -198,6 +204,25 @@ ), $this->buttonBar); } + + if ($this->actionIcons) { + $action_list = array(); + foreach ($this->actionIcons as $icon) { + $action_list[] = phutil_tag( + 'li', + array( + 'class' => 'phui-header-list-icon', + ), + $icon); + } + $header[] = phutil_tag( + 'ul', + array( + 'class' => 'phui-header-icon-list', + ), + $action_list); + } + $header[] = $this->header; if ($this->objectName) { diff --git a/src/view/phui/PHUIObjectItemView.php b/src/view/phui/PHUIObjectItemView.php --- a/src/view/phui/PHUIObjectItemView.php +++ b/src/view/phui/PHUIObjectItemView.php @@ -422,7 +422,7 @@ if ($this->handleIcons) { $handle_bar = array(); - foreach ($this->handleIcon as $handleicon) { + foreach ($this->handleIcons as $handleicon) { $handle_bar[] = $this->renderHandleIcon($handleicon['icon'], $handleicon['label']); } diff --git a/webroot/rsrc/css/application/dashboard/dashboard.css b/webroot/rsrc/css/application/dashboard/dashboard.css --- a/webroot/rsrc/css/application/dashboard/dashboard.css +++ b/webroot/rsrc/css/application/dashboard/dashboard.css @@ -10,8 +10,12 @@ margin: 8px; } -.dashboard-panel + .dashboard-panel { - margin-top: 16px; +.dashboard-view .phui-object-box { + margin: 0 0 16px 0; +} + +.dashboard-view .phui-object-box .phui-object-box { + margin: 0; } .device-desktop .aphront-multi-column-fluid .aphront-multi-column-2-up @@ -31,7 +35,7 @@ .aphront-multi-column-fluid .aphront-multi-column-column-outer.grippable -.aphront-multi-column-column .dashboard-panel { +.aphront-multi-column-column .dashboard-pane { cursor: move; } @@ -69,13 +73,3 @@ .aphront-multi-column-column .phui-info-view { margin: 0; } - -.dashboard-panel .phui-object-item-empty .phui-info-view { - margin: 0; -} - -.dashboard-panel .dashboard-box { - padding: 12px; - background: #fff; - border: 1px solid {$lightblueborder}; -} diff --git a/webroot/rsrc/css/application/feed/feed.css b/webroot/rsrc/css/application/feed/feed.css --- a/webroot/rsrc/css/application/feed/feed.css +++ b/webroot/rsrc/css/application/feed/feed.css @@ -54,48 +54,44 @@ /* - Dashboards ------------------------------------------------------------ */ -.dashboard-panel div.phabricator-feed-frame { - background: #fff; +.dashboard-pane div.phabricator-feed-frame { margin: 0; - border-left: 1px solid {$lightblueborder}; - border-right: 1px solid {$lightblueborder}; - border-bottom: 1px solid {$blueborder}; max-width: none; } -.dashboard-panel .phabricator-feed-frame .phui-action-header { +.dashboard-pane .phabricator-feed-frame .phui-action-header { background: #f7f7f7; - margin-top: -1px; - border-top: 1px solid {$thinblueborder}; } -.dashboard-panel .phabricator-feed-frame .phui-action-header-title { +.dashboard-pane .phabricator-feed-frame .phui-action-header-title { font-size: 13px; margin-left: 12px; + padding: 8px 0; margin-bottom: 0; color: {$bluetext}; + font-weight: bold; } -.dashboard-panel .phabricator-feed-frame .phui-feed-story { +.dashboard-pane .phabricator-feed-frame .phui-feed-story { border: none; border-bottom: 1px solid {$thinblueborder}; margin: 0 8px; } -.dashboard-panel .phabricator-feed-frame .phui-feed-story-head { - padding: 8px 0; +.dashboard-pane .phabricator-feed-frame .phui-feed-story-head { + padding: 12px 0; } -.dashboard-panel .phabricator-feed-frame .phui-feed-story-body { - margin: 8px 0; +.dashboard-pane .phabricator-feed-frame .phui-feed-story-body { + margin: 12px 0; } -.dashboard-panel .phabricator-feed-frame .phui-feed-story-foot { +.dashboard-pane .phabricator-feed-frame .phui-feed-story-foot { background: #fff; - padding: 8px 0; + padding: 12px 0; } -.dashboard-panel .phabricator-feed-frame +.dashboard-pane .phabricator-feed-frame .phabricator-feed-story-date-separator { margin-top: 0; } diff --git a/webroot/rsrc/css/phui/phui-action-header-view.css b/webroot/rsrc/css/phui/phui-action-header-view.css --- a/webroot/rsrc/css/phui/phui-action-header-view.css +++ b/webroot/rsrc/css/phui/phui-action-header-view.css @@ -83,24 +83,3 @@ font-weight: normal; color: {$lightgreytext}; } - -/* - Dashboards ------------------------------------------------------------ */ - -.dashboard-panel .phui-action-header.gradient-grey-header, -.dashboard-panel .phui-action-header.gradient-lightblue-header { - border: 1px solid {$lightblueborder}; - border-bottom: 1px solid {$thinblueborder}; -} - -.dashboard-panel .phui-action-header.gradient-white-header { - border: 1px solid {$lightblueborder}; - border-bottom: 1px solid {$thinblueborder}; - border-top-right-radius: 3px; - border-top-left-radius: 3px; -} - -.dashboard-panel .phui-action-header.gradient-white-header - .phui-action-header-icon-list { - padding-top: 6px; - padding-right: 6px; -} diff --git a/webroot/rsrc/css/phui/phui-button.css b/webroot/rsrc/css/phui/phui-button.css --- a/webroot/rsrc/css/phui/phui-button.css +++ b/webroot/rsrc/css/phui/phui-button.css @@ -71,8 +71,8 @@ background-color: transparent; background-image: none; border: 1px solid transparent; - color: {$bluetext}; - border: 1px solid {$lightblueborder}; + color: {$sh-bluetext}; + border: 1px solid {$sh-blueborder}; } a.disabled, diff --git a/webroot/rsrc/css/phui/phui-header-view.css b/webroot/rsrc/css/phui/phui-header-view.css --- a/webroot/rsrc/css/phui/phui-header-view.css +++ b/webroot/rsrc/css/phui/phui-header-view.css @@ -149,3 +149,12 @@ .device .phui-header-action-links .phui-mobile-menu { display: inline-block; } + +.phui-header-icon-list { + float: right; +} + +.phui-header-icon-list .phui-header-list-icon { + margin: 0 4px; + float: right; +} diff --git a/webroot/rsrc/css/phui/phui-icon.css b/webroot/rsrc/css/phui/phui-icon.css --- a/webroot/rsrc/css/phui/phui-icon.css +++ b/webroot/rsrc/css/phui/phui-icon.css @@ -36,4 +36,5 @@ a.phui-icon-view:hover { text-decoration: none; + color: {$sky}; } diff --git a/webroot/rsrc/css/phui/phui-object-box.css b/webroot/rsrc/css/phui/phui-object-box.css --- a/webroot/rsrc/css/phui/phui-object-box.css +++ b/webroot/rsrc/css/phui/phui-object-box.css @@ -69,3 +69,33 @@ .phui-box-border.phui-object-box-lightviolet .phui-action-header { border-bottom: 1px solid {$lightvioletborder}; } + +/* - Double Object Box Override --------------------------------------------- */ + +.phui-object-box .phui-object-box { + padding: 0; +} + +.phui-object-box .phui-box-border { + border-width: 0; + padding: 0; + margin: 0; +} + +.phui-object-box .phui-object-box .phui-header-shell h1 { + background-color: {$lightgreybackground}; + padding: 8px 12px; + font-size: 13px; + margin: 0; + color: {$bluetext}; + font-weight: 500; +} + +.phui-object-box .phui-object-box .phui-header-shell { + margin: 0; + padding: 0; +} + +.phui-box-border + .phui-box-border { + border-top: 1px solid {$thinblueborder}; +} diff --git a/webroot/rsrc/css/phui/phui-object-item-list-view.css b/webroot/rsrc/css/phui/phui-object-item-list-view.css --- a/webroot/rsrc/css/phui/phui-object-item-list-view.css +++ b/webroot/rsrc/css/phui/phui-object-item-list-view.css @@ -20,8 +20,7 @@ margin: 0; } -.phui-object-box .phui-object-item-list-view .phui-object-item, -.homepage-panel .phui-object-list-flush .phui-object-item { +.phui-object-box .phui-object-item-list-view .phui-object-item { margin: 0; } @@ -63,6 +62,10 @@ margin: 0; } +.phui-object-box .phui-object-item-list-view { + margin: 0; +} + .phui-object-item-status-icon { font-weight: bold; padding: 0 8px; @@ -562,44 +565,6 @@ opacity: 0.5; } -/* - Plain --------------------------------------------------------------------- - - Remove all border styles, just a list of objects - -*/ - -.phui-object-list-plain .phui-object-item { - background: transparent; -} - -.phui-object-list-plain .phui-object-item, -.phui-object-list-plain .phui-object-item-frame { - border: none; -} - -.phui-object-list-plain .phui-object-item-attributes, -.phui-object-list-plain .phui-object-item-name { - padding-left: 0; - padding-top: 0; -} - -.phui-object-item-image { - width: 40px; - height: 40px; - background-size: 100%; - margin: 6px; - position: absolute; - background-color: {$lightbluebackground}; -} - -.phui-object-item-with-image .phui-object-item-frame { - min-height: 52px; -} - -.phui-object-item-with-image .phui-object-item-content-box { - margin-left: 46px; -} - /* - State --------------------------------------------------------------------- Provides a list of object status or states, success or fail, etc @@ -638,32 +603,29 @@ margin-bottom: -1px; } -.dashboard-panel .phui-object-item-list-view .phui-object-item, -.phui-object-box .phui-object-item-list-view { - margin: 0; - background-image: none; - background-color: #fff; -} - .dashboard-panel .phui-object-item-frame, .phui-object-box .phui-object-item-list-view .phui-object-item-frame { border: none; border-bottom: 1px solid {$thinblueborder}; } -.dashboard-panel .phui-object-item-list-header, -.dashboard-panel .maniphest-task-group-header { +.dashboard-pane .phui-object-item-list-header { font-size: 13px; color: {$bluetext}; background: {$lightgreybackground}; + border-top: 1px solid {$thinblueborder}; border-bottom: 1px solid {$thinblueborder}; padding: 8px 12px; - -webkit-font-smoothing: antialiased; + font-weight: 500; } -.dashboard-panel .phui-object-item-empty .phui-info-view { +.dashboard-pane .phui-header-shell + .phui-object-item-list-view + .phui-object-item-list-header { + border-top: none; + } + +.dashboard-pane .phui-object-item-empty .phui-info-view { border: none; - border-bottom: 1px solid {$thinblueborder}; margin: 0; } @@ -672,14 +634,6 @@ display: none; } - .dashboard-panel .phui-object-box .phui-header-shell { - display: none; - } - - .dashboard-panel .phui-object-box { - margin: 0; - } - /* - Launcher List ---------------------------------------------------------- */ @@ -741,3 +695,19 @@ .device-desktop .phui-object-item-launcher-list .phui-object-icon-pane { width: auto; } + +.phui-object-item-image { + width: 40px; + height: 40px; + background-size: 100%; + margin: 6px; + position: absolute; +} + +.phui-object-item-with-image .phui-object-item-frame { + min-height: 52px; +} + +.phui-object-item-with-image .phui-object-item-content-box { + margin-left: 46px; +}