1
0
Fork 0
mirror of https://we.phorge.it/source/phorge.git synced 2024-09-20 01:08:50 +02:00

[Redesign] Remove PHUIActionHeaderView

Summary: This adds minor functionality to PHUIHeaderView (icons, tags) that were previously on in ActionHeader. This allows us to remove the PHUIActionHeaderView outright in favor of just one Header class.

Test Plan: Tested each callsite, workboards, hovercards, conpherence.

Reviewers: btrahan, epriestley

Reviewed By: epriestley

Subscribers: Korvin, epriestley

Differential Revision: https://secure.phabricator.com/D12902
This commit is contained in:
Chad Little 2015-05-18 10:00:15 -07:00
parent 490a6fe8b1
commit e592061891
26 changed files with 157 additions and 674 deletions

View file

@ -7,7 +7,7 @@
*/
return array(
'names' => array(
'core.pkg.css' => '6a6be483',
'core.pkg.css' => 'a1c3a5c8',
'core.pkg.js' => 'f3e08b38',
'darkconsole.pkg.js' => 'e7393ebb',
'differential.pkg.css' => 'bb338e4b',
@ -51,7 +51,7 @@ return array(
'rsrc/css/application/conpherence/notification.css' => '919974b6',
'rsrc/css/application/conpherence/transaction.css' => '42a457f6',
'rsrc/css/application/conpherence/update.css' => '1099a660',
'rsrc/css/application/conpherence/widget-pane.css' => '2af42ebe',
'rsrc/css/application/conpherence/widget-pane.css' => '93938744',
'rsrc/css/application/contentsource/content-source-view.css' => '4b8b05d4',
'rsrc/css/application/countdown/timer.css' => '86b7b0a0',
'rsrc/css/application/dashboard/dashboard.css' => 'eb458607',
@ -68,7 +68,7 @@ return array(
'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' => 'f1aa8c11',
'rsrc/css/application/feed/feed.css' => 'b490a135',
'rsrc/css/application/files/global-drag-and-drop.css' => '697324ad',
'rsrc/css/application/flag/flag.css' => '5337623f',
'rsrc/css/application/harbormaster/harbormaster.css' => '49d64eb4',
@ -116,32 +116,31 @@ return array(
'rsrc/css/font/font-source-sans-pro.css' => '8906c07b',
'rsrc/css/font/phui-font-icon-base.css' => '3dad2ae3',
'rsrc/css/layout/phabricator-filetree-view.css' => 'fccf9f82',
'rsrc/css/layout/phabricator-hovercard-view.css' => '44394670',
'rsrc/css/layout/phabricator-hovercard-view.css' => 'b7a82459',
'rsrc/css/layout/phabricator-side-menu-view.css' => 'a440478a',
'rsrc/css/layout/phabricator-source-code-view.css' => '2ceee894',
'rsrc/css/phui/calendar/phui-calendar-day.css' => '38891735',
'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' => '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' => 'b995182d',
'rsrc/css/phui/phui-crumbs-view.css' => 'aeff7a21',
'rsrc/css/phui/phui-document.css' => '7b564cf6',
'rsrc/css/phui/phui-document.css' => '08059961',
'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' => '036ca2aa',
'rsrc/css/phui/phui-header-view.css' => '2ad5de97',
'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' => '8d9239e5',
'rsrc/css/phui/phui-object-item-list-view.css' => '80c3d6fe',
'rsrc/css/phui/phui-object-box.css' => '23e36d6b',
'rsrc/css/phui/phui-object-item-list-view.css' => '4f72249b',
'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',
@ -150,8 +149,8 @@ return array(
'rsrc/css/phui/phui-tag-view.css' => '402691cc',
'rsrc/css/phui/phui-text.css' => 'cf019f54',
'rsrc/css/phui/phui-timeline-view.css' => 'a85542c8',
'rsrc/css/phui/phui-workboard-view.css' => '3279cbbf',
'rsrc/css/phui/phui-workpanel-view.css' => 'e495a5cc',
'rsrc/css/phui/phui-workboard-view.css' => '38446bc3',
'rsrc/css/phui/phui-workpanel-view.css' => '266038ce',
'rsrc/css/sprite-gradient.css' => '4bdb98a7',
'rsrc/css/sprite-login.css' => 'a3526809',
'rsrc/css/sprite-main-header.css' => '28d01b0b',
@ -502,7 +501,7 @@ return array(
'conpherence-thread-manager' => 'b7342ddb',
'conpherence-transaction-css' => '42a457f6',
'conpherence-update-css' => '1099a660',
'conpherence-widget-pane-css' => '2af42ebe',
'conpherence-widget-pane-css' => '93938744',
'differential-changeset-view-css' => 'e19cfd6e',
'differential-core-view-css' => '7ac3cabc',
'differential-inline-comment-editor' => 'd4c87bf4',
@ -706,12 +705,12 @@ return array(
'phabricator-drag-and-drop-file-upload' => '07de8873',
'phabricator-draggable-list' => 'a16ec1c6',
'phabricator-fatal-config-template-css' => '8e6c6fcd',
'phabricator-feed-css' => 'f1aa8c11',
'phabricator-feed-css' => 'b490a135',
'phabricator-file-upload' => '477359c8',
'phabricator-filetree-view-css' => 'fccf9f82',
'phabricator-flag-css' => '5337623f',
'phabricator-hovercard' => '14ac66f5',
'phabricator-hovercard-view-css' => '44394670',
'phabricator-hovercard-view-css' => 'b7a82459',
'phabricator-keyboard-shortcut' => '1ae869f2',
'phabricator-keyboard-shortcut-manager' => 'c1700f6f',
'phabricator-main-menu-view' => 'ac574fc3',
@ -754,7 +753,6 @@ return array(
'phortune-css' => '9149f103',
'phrequent-css' => 'ffc185ad',
'phriction-document-css' => '0d16bc9a',
'phui-action-header-view-css' => 'd1cb5f81',
'phui-action-panel-css' => '3ee9afd5',
'phui-box-css' => 'a5bb366d',
'phui-button-css' => 'b995182d',
@ -763,21 +761,21 @@ return array(
'phui-calendar-list-css' => 'c1d0ca59',
'phui-calendar-month-css' => '75e6a2ee',
'phui-crumbs-view-css' => 'aeff7a21',
'phui-document-view-css' => '7b564cf6',
'phui-document-view-css' => '08059961',
'phui-feed-story-css' => 'c9f3a0b5',
'phui-font-icon-base-css' => '3dad2ae3',
'phui-fontkit-css' => '1e71371a',
'phui-form-css' => 'f535f938',
'phui-form-view-css' => 'e1abbe8e',
'phui-header-view-css' => '036ca2aa',
'phui-header-view-css' => '2ad5de97',
'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' => '8d9239e5',
'phui-object-item-list-view-css' => '80c3d6fe',
'phui-object-box-css' => '23e36d6b',
'phui-object-item-list-view-css' => '4f72249b',
'phui-pinboard-view-css' => 'eaab2b1b',
'phui-property-list-view-css' => 'd2d143ea',
'phui-remarkup-preview-css' => '19ad512b',
@ -786,8 +784,8 @@ return array(
'phui-tag-view-css' => '402691cc',
'phui-text-css' => 'cf019f54',
'phui-timeline-view-css' => 'a85542c8',
'phui-workboard-view-css' => '3279cbbf',
'phui-workpanel-view-css' => 'e495a5cc',
'phui-workboard-view-css' => '38446bc3',
'phui-workpanel-view-css' => '266038ce',
'phuix-action-list-view' => 'b5c256b8',
'phuix-action-view' => '8cf6d262',
'phuix-dropdown-menu' => 'bd4c8dca',
@ -2075,7 +2073,6 @@ return array(
'phabricator-feed-css',
'phabricator-dashboard-css',
'aphront-multi-column-view-css',
'phui-action-header-view-css',
'conpherence-durable-column-view',
),
'core.pkg.js' => array(

View file

@ -139,7 +139,6 @@ return array(
'phabricator-feed-css',
'phabricator-dashboard-css',
'aphront-multi-column-view-css',
'phui-action-header-view-css',
'conpherence-durable-column-view',
),
'differential.pkg.css' => array(

View file

@ -1154,8 +1154,6 @@ phutil_register_library_map(array(
'PHIDLookupConduitAPIMethod' => 'applications/phid/conduit/PHIDLookupConduitAPIMethod.php',
'PHIDQueryConduitAPIMethod' => 'applications/phid/conduit/PHIDQueryConduitAPIMethod.php',
'PHUI' => 'view/phui/PHUI.php',
'PHUIActionHeaderExample' => 'applications/uiexample/examples/PHUIActionHeaderExample.php',
'PHUIActionHeaderView' => 'view/phui/PHUIActionHeaderView.php',
'PHUIActionPanelExample' => 'applications/uiexample/examples/PHUIActionPanelExample.php',
'PHUIActionPanelView' => 'view/phui/PHUIActionPanelView.php',
'PHUIBoxExample' => 'applications/uiexample/examples/PHUIBoxExample.php',
@ -4484,8 +4482,6 @@ phutil_register_library_map(array(
'PHIDInfoConduitAPIMethod' => 'PHIDConduitAPIMethod',
'PHIDLookupConduitAPIMethod' => 'PHIDConduitAPIMethod',
'PHIDQueryConduitAPIMethod' => 'PHIDConduitAPIMethod',
'PHUIActionHeaderExample' => 'PhabricatorUIExample',
'PHUIActionHeaderView' => 'AphrontView',
'PHUIActionPanelExample' => 'PhabricatorUIExample',
'PHUIActionPanelView' => 'AphrontTagView',
'PHUIBoxExample' => 'PhabricatorUIExample',

View file

@ -68,17 +68,22 @@ final class ConpherenceWidgetController extends ConpherenceController {
->setHref($this->getWidgetURI())
->setMetadata(array('widget' => null))
->addSigil('conpherence-widget-adder');
$header = javelin_tag(
'a',
array(
'href' => '#',
'sigil' => 'widgets-selector',
),
pht('Participants'));
$widgets[] = phutil_tag(
'div',
array(
'class' => 'widgets-header',
),
id(new PHUIActionHeaderView())
->setHeaderTitle(pht('Participants'))
->setHeaderHref('#')
->setDropdown(true)
->addAction($new_icon)
->addHeaderSigil('widgets-selector'));
id(new PHUIHeaderView())
->setHeader($header)
->addActionIcon($new_icon));
$user = $this->getRequest()->getUser();
// now the widget bodies
$widgets[] = javelin_tag(

View file

@ -161,7 +161,7 @@ final class PhabricatorDashboardPanelRenderingEngine extends Phobject {
case self::HEADER_MODE_NORMAL:
default:
$header = id(new PHUIHeaderView())
->setHeaderTitle($title);
->setHeader($title);
break;
}
$icon = id(new PHUIIconView())

View file

@ -57,8 +57,8 @@ final class PhabricatorFeedBuilder {
phutil_tag_div('phabricator-feed-story-date-separator'));
}
$last_date = $date;
$header = new PHUIActionHeaderView();
$header->setHeaderTitle($date);
$header = new PHUIHeaderView();
$header->setHeader($date);
$null_view->appendChild($header);
}

View file

@ -362,7 +362,7 @@ final class PhabricatorProjectBoardViewController
$project->getName());
$header = id(new PHUIHeaderView())
->setHeader(pht('%s Workboard', $header_link))
->setHeader($header_link)
->setUser($viewer)
->setNoBackground(true)
->addActionLink($sort_menu)
@ -370,12 +370,16 @@ final class PhabricatorProjectBoardViewController
->addActionLink($manage_menu)
->setPolicyObject($project);
$header_box = id(new PHUIBoxView())
->appendChild($header)
->addClass('project-board-header');
$board_box = id(new PHUIBoxView())
->appendChild($board)
->addClass('project-board-wrapper');
$nav = $this->buildIconNavView($project);
$nav->appendChild($header);
$nav->appendChild($header_box);
$nav->appendChild($board_box);
return $this->buildApplicationPage(
@ -674,7 +678,7 @@ final class PhabricatorProjectBoardViewController
}
$column_button = id(new PHUIIconView())
->setIconFont('fa-caret-down')
->setIconFont('fa-gear')
->setHref('#')
->addSigil('boards-dropdown-menu')
->setMetadata(

View file

@ -101,17 +101,6 @@ final class PhabricatorProjectColumn
if ($this->isHidden()) {
$icon = 'fa-eye-slash';
$text = pht('Hidden');
}
if ($icon) {
return id(new PHUIIconView())
->setIconFont($icon)
->addSigil('has-tooltip')
->setMetadata(
array(
'tip' => $text,
));
}
return null;

View file

@ -1,270 +0,0 @@
<?php
final class PHUIActionHeaderExample extends PhabricatorUIExample {
public function getName() {
return 'Action Headers';
}
public function getDescription() {
return 'Various header layouts with and without icons';
}
public function renderExample() {
/* Colors */
$title1 = id(new PHUIHeaderView())
->setHeader(pht('Header Plain'));
$header1 = id(new PHUIActionHeaderView())
->setHeaderTitle('Colorless');
$header2 = id(new PHUIActionHeaderView())
->setHeaderTitle('Light Grey')
->setHeaderColor(PHUIActionHeaderView::HEADER_GREY);
$header3 = id(new PHUIActionHeaderView())
->setHeaderTitle('Light Blue')
->setHeaderColor(PHUIActionHeaderView::HEADER_LIGHTBLUE);
$header4 = id(new PHUIActionHeaderView())
->setHeaderTitle('Light Green')
->setHeaderColor(PHUIActionHeaderView::HEADER_LIGHTGREEN);
$header5 = id(new PHUIActionHeaderView())
->setHeaderTitle('Light Red')
->setHeaderColor(PHUIActionHeaderView::HEADER_LIGHTRED);
$header6 = id(new PHUIActionHeaderView())
->setHeaderTitle('Light Violet')
->setHeaderColor(PHUIActionHeaderView::HEADER_LIGHTVIOLET);
$layout1 = id(new AphrontMultiColumnView())
->addColumn($header1)
->addColumn($header2)
->addColumn($header3)
->addColumn($header4)
->addColumn($header5)
->addColumn($header6)
->setFluidLayout(true)
->setGutter(AphrontMultiColumnView::GUTTER_SMALL);
$wrap1 = id(new PHUIBoxView())
->appendChild($layout1)
->addMargin(PHUI::MARGIN_LARGE);
/* Policy Icons */
$title2 = id(new PHUIHeaderView())
->setHeader(pht('With Icons'));
$header1 = id(new PHUIActionHeaderView())
->setHeaderTitle('Quack')
->setHeaderIcon(
id(new PHUIIconView())
->setIconFont('fa-coffee'));
$header2 = id(new PHUIActionHeaderView())
->setHeaderTitle('Moo')
->setHeaderColor(PHUIActionHeaderView::HEADER_GREY)
->setHeaderIcon(
id(new PHUIIconView())
->setIconFont('fa-magic'));
$header3 = id(new PHUIActionHeaderView())
->setHeaderTitle('Woof')
->setHeaderColor(PHUIActionHeaderView::HEADER_LIGHTBLUE)
->setHeaderIcon(
id(new PHUIIconView())
->setIconFont('fa-fighter-jet'));
$header4 = id(new PHUIActionHeaderView())
->setHeaderTitle('Buzz')
->setHeaderColor(PHUIActionHeaderView::HEADER_LIGHTGREEN)
->setHeaderIcon(
id(new PHUIIconView())
->setIconFont('fa-child'));
$header5 = id(new PHUIActionHeaderView())
->setHeaderTitle('Fizz')
->setHeaderColor(PHUIActionHeaderView::HEADER_LIGHTRED)
->setHeaderIcon(
id(new PHUIIconView())
->setIconFont('fa-car'));
$header6 = id(new PHUIActionHeaderView())
->setHeaderTitle('Blarp')
->setHeaderColor(PHUIActionHeaderView::HEADER_LIGHTVIOLET)
->setHeaderIcon(
id(new PHUIIconView())
->setIconFont('fa-truck'));
$layout2 = id(new AphrontMultiColumnView())
->addColumn($header1)
->addColumn($header2)
->addColumn($header3)
->addColumn($header4)
->addColumn($header5)
->addColumn($header6)
->setFluidLayout(true)
->setGutter(AphrontMultiColumnView::GUTTER_SMALL);
$wrap2 = id(new PHUIBoxView())
->appendChild($layout2)
->addMargin(PHUI::MARGIN_LARGE);
/* Action Icons */
$title3 = id(new PHUIHeaderView())
->setHeader(pht('With Action Icons'));
$action1 = new PHUIIconView();
$action1->setIconFont('fa-cog');
$action1->setHref('#');
$action2 = new PHUIIconView();
$action2->setIconFont('fa-heart');
$action2->setHref('#');
$action3 = new PHUIIconView();
$action3->setIconFont('fa-tag');
$action3->setHref('#');
$action4 = new PHUIIconView();
$action4->setIconFont('fa-plus');
$action4->setHref('#');
$action5 = new PHUIIconView();
$action5->setIconFont('fa-search');
$action5->setHref('#');
$action6 = new PHUIIconView();
$action6->setIconFont('fa-arrows');
$action6->setHref('#');
$header1 = id(new PHUIActionHeaderView())
->setHeaderTitle('Company')
->setHeaderHref('http://example.com/')
->addAction($action1);
$header2 = id(new PHUIActionHeaderView())
->setHeaderTitle('Public')
->setHeaderHref('http://example.com/')
->setHeaderColor(PHUIActionHeaderView::HEADER_GREY)
->addAction($action1);
$header3 = id(new PHUIActionHeaderView())
->setHeaderTitle('Restricted')
->setHeaderHref('http://example.com/')
->setHeaderColor(PHUIActionHeaderView::HEADER_LIGHTBLUE)
->addAction($action2);
$header4 = id(new PHUIActionHeaderView())
->setHeaderTitle('Company')
->setHeaderHref('http://example.com/')
->setHeaderColor(PHUIActionHeaderView::HEADER_LIGHTGREEN)
->addAction($action3);
$header5 = id(new PHUIActionHeaderView())
->setHeaderTitle('Public')
->setHeaderHref('http://example.com/')
->setHeaderColor(PHUIActionHeaderView::HEADER_LIGHTRED)
->addAction($action4)
->addAction($action5);
$header6 = id(new PHUIActionHeaderView())
->setHeaderTitle('Restricted')
->setHeaderHref('http://example.com/')
->setHeaderColor(PHUIActionHeaderView::HEADER_LIGHTVIOLET)
->addAction($action6);
$layout3 = id(new AphrontMultiColumnView())
->addColumn($header1)
->addColumn($header2)
->addColumn($header3)
->addColumn($header4)
->addColumn($header5)
->addColumn($header6)
->setFluidLayout(true)
->setGutter(AphrontMultiColumnView::GUTTER_SMALL);
$wrap3 = id(new PHUIBoxView())
->appendChild($layout3)
->addMargin(PHUI::MARGIN_LARGE);
/* Action Icons */
$title4 = id(new PHUIHeaderView())
->setHeader(pht('With Tags'));
$tag1 = id(new PHUITagView())
->setType(PHUITagView::TYPE_STATE)
->setBackgroundColor(PHUITagView::COLOR_RED)
->setName('Open');
$tag2 = id(new PHUITagView())
->setType(PHUITagView::TYPE_STATE)
->setBackgroundColor(PHUITagView::COLOR_BLUE)
->setName('Closed');
$action1 = new PHUIIconView();
$action1->setIconFont('fa-flag');
$action1->setHref('#');
$header1 = id(new PHUIActionHeaderView())
->setHeaderTitle('Company')
->setTag($tag2);
$header2 = id(new PHUIActionHeaderView())
->setHeaderTitle('Public')
->setHeaderColor(PHUIActionHeaderView::HEADER_GREY)
->addAction($action1)
->setTag($tag1);
$header3 = id(new PHUIActionHeaderView())
->setHeaderTitle('Restricted')
->setHeaderColor(PHUIActionHeaderView::HEADER_LIGHTBLUE)
->setTag($tag2);
$header4 = id(new PHUIActionHeaderView())
->setHeaderTitle('Company')
->setHeaderColor(PHUIActionHeaderView::HEADER_LIGHTGREEN)
->setTag($tag1);
$header5 = id(new PHUIActionHeaderView())
->setHeaderTitle('Public')
->setHeaderColor(PHUIActionHeaderView::HEADER_LIGHTRED)
->setTag($tag2);
$header6 = id(new PHUIActionHeaderView())
->setHeaderTitle('Restricted')
->setHeaderColor(PHUIActionHeaderView::HEADER_LIGHTVIOLET)
->setTag($tag1);
$layout4 = id(new AphrontMultiColumnView())
->addColumn($header1)
->addColumn($header2)
->addColumn($header3)
->addColumn($header4)
->addColumn($header5)
->addColumn($header6)
->setFluidLayout(true)
->setGutter(AphrontMultiColumnView::GUTTER_SMALL);
$wrap4 = id(new PHUIBoxView())
->appendChild($layout4)
->addMargin(PHUI::MARGIN_LARGE);
return phutil_tag(
'div',
array(),
array(
$title1,
$wrap1,
$title2,
$wrap2,
$title3,
$wrap3,
$title4,
$wrap4,
));
}
}

View file

@ -12,7 +12,6 @@ final class AphrontDialogView extends AphrontView {
private $class;
private $renderAsForm = true;
private $formID;
private $headerColor = PHUIActionHeaderView::HEADER_WHITE;
private $footers = array();
private $isStandalone;
private $method = 'POST';
@ -131,11 +130,6 @@ final class AphrontDialogView extends AphrontView {
return $this;
}
public function setHeaderColor($color) {
$this->headerColor = $color;
return $this;
}
public function appendParagraph($paragraph) {
return $this->appendChild(
phutil_tag(
@ -300,9 +294,8 @@ final class AphrontDialogView extends AphrontView {
);
}
$header = new PHUIActionHeaderView();
$header->setHeaderTitle($this->title);
$header->setHeaderColor($this->headerColor);
$header = new PHUIHeaderView();
$header->setHeader($this->title);
$footer = null;
if ($this->footers) {

View file

@ -1,181 +0,0 @@
<?php
final class PHUIActionHeaderView extends AphrontView {
const HEADER_GREY = 'grey';
const HEADER_DARK_GREY = 'dark-grey';
const HEADER_LIGHTGREEN = 'lightgreen';
const HEADER_LIGHTRED = 'lightred';
const HEADER_LIGHTVIOLET = 'lightviolet';
const HEADER_LIGHTBLUE ='lightblue';
const HEADER_WHITE = 'white';
private $headerTitle;
private $headerSubtitle;
private $headerHref;
private $headerIcon;
private $headerSigils = array();
private $actions = array();
private $headerColor;
private $tag = null;
private $dropdown;
public function setDropdown($dropdown) {
$this->dropdown = $dropdown;
return $this;
}
public function addAction(PHUIIconView $action) {
$this->actions[] = $action;
return $this;
}
public function setTag(PHUITagView $tag) {
$this->tag = $tag;
return $this;
}
public function setHeaderTitle($header) {
$this->headerTitle = $header;
return $this;
}
public function setHeaderSubtitle($subtitle) {
$this->headerSubtitle = $subtitle;
return $this;
}
public function setHeaderHref($href) {
$this->headerHref = $href;
return $this;
}
public function addHeaderSigil($sigil) {
$this->headerSigils[] = $sigil;
return $this;
}
public function setHeaderIcon(PHUIIconView $icon) {
$this->headerIcon = $icon;
return $this;
}
public function setHeaderColor($color) {
$this->headerColor = $color;
return $this;
}
private function getIconColor() {
switch ($this->headerColor) {
case self::HEADER_GREY:
return 'lightgreytext';
case self::HEADER_DARK_GREY:
return 'lightgreytext';
case self::HEADER_LIGHTGREEN:
return 'bluegrey';
case self::HEADER_LIGHTRED:
return 'bluegrey';
case self::HEADER_LIGHTVIOLET:
return 'bluegrey';
case self::HEADER_LIGHTBLUE:
return 'bluegrey';
}
}
public function render() {
require_celerity_resource('phui-action-header-view-css');
$classes = array();
$classes[] = 'phui-action-header';
if ($this->headerColor) {
$classes[] = 'sprite-gradient';
$classes[] = 'gradient-'.$this->headerColor.'-header';
}
if ($this->dropdown) {
$classes[] = 'dropdown';
}
$action_list = array();
if (nonempty($this->actions)) {
foreach ($this->actions as $action) {
$action->addClass($this->getIconColor());
$action_list[] = phutil_tag(
'li',
array(
'class' => 'phui-action-header-icon-item',
),
$action);
}
}
if ($this->tag) {
$action_list[] = phutil_tag(
'li',
array(
'class' => 'phui-action-header-icon-item',
),
$this->tag);
}
$header_icon = null;
if ($this->headerIcon) {
$header_icon = $this->headerIcon;
}
$header_title = $this->headerTitle;
if ($this->headerHref) {
$header_title = javelin_tag(
'a',
array(
'class' => 'phui-action-header-link',
'href' => $this->headerHref,
'sigil' => implode(' ', $this->headerSigils),
),
$this->headerTitle);
}
$header_subtitle = null;
if ($this->headerSubtitle) {
$header_subtitle = phutil_tag(
'span',
array(
'class' => 'phui-action-header-subtitle',
),
$this->headerSubtitle);
}
$header = phutil_tag(
'h3',
array(
'class' => 'phui-action-header-title',
),
array(
$header_icon,
$header_title,
$header_subtitle,
));
$icons = '';
if (nonempty($action_list)) {
$icons = phutil_tag(
'ul',
array(
'class' => 'phui-action-header-icon-list',
),
$action_list);
}
return phutil_tag(
'div',
array(
'class' => implode(' ', $classes),
),
array(
$header,
$icons,
));
}
}

View file

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

View file

@ -11,6 +11,7 @@ final class PHUIHeaderView extends AphrontTagView {
private $imageURL = null;
private $subheader;
private $headerColor;
private $headerIcon;
private $noBackground;
private $bleedHeader;
private $properties = array();
@ -65,6 +66,11 @@ final class PHUIHeaderView extends AphrontTagView {
return $this;
}
public function setHeaderIcon($icon) {
$this->headerIcon = $icon;
return $this;
}
public function setPolicyObject(PhabricatorPolicyInterface $object) {
$this->policyObject = $object;
return $this;
@ -148,8 +154,7 @@ final class PHUIHeaderView extends AphrontTagView {
}
if ($this->headerColor) {
$classes[] = 'sprite-gradient';
$classes[] = 'gradient-'.$this->headerColor.'-header';
$classes[] = 'phui-header-'.$this->headerColor;
}
if ($this->properties || $this->policyObject || $this->subheader) {
@ -205,15 +210,25 @@ final class PHUIHeaderView extends AphrontTagView {
$this->buttonBar);
}
if ($this->actionIcons) {
if ($this->actionIcons || $this->tags) {
$action_list = array();
foreach ($this->actionIcons as $icon) {
if ($this->actionIcons) {
foreach ($this->actionIcons as $icon) {
$action_list[] = phutil_tag(
'li',
array(
'class' => 'phui-header-list-icon',
),
$icon);
}
}
if ($this->tags) {
$action_list[] = phutil_tag(
'li',
array(
'class' => 'phui-header-list-icon',
'class' => 'phui-header-list-icon phui-header-tags',
),
$icon);
array_interleave(' ', $this->tags));
}
$header[] = phutil_tag(
'ul',
@ -223,6 +238,11 @@ final class PHUIHeaderView extends AphrontTagView {
$action_list);
}
if ($this->headerIcon) {
$icon = id(new PHUIIconView())
->setIconFont($this->headerIcon);
$header[] = $icon;
}
$header[] = $this->header;
if ($this->objectName) {
@ -237,16 +257,6 @@ final class PHUIHeaderView extends AphrontTagView {
' ');
}
if ($this->tags) {
$header[] = ' ';
$header[] = phutil_tag(
'span',
array(
'class' => 'phui-header-tags',
),
array_interleave(' ', $this->tags));
}
if ($this->subheader) {
$header[] = phutil_tag(
'div',

View file

@ -154,14 +154,9 @@ final class PHUIObjectBoxView extends AphrontView {
require_celerity_resource('phui-object-box-css');
// TODO: (redesign-2015) For now going to override this by hand instead of hunting
// down all call sites. This is mostly to prove the design will work
// then do the legwork before re-merging to master.
$header_color = null;
if ($this->headerColor) {
$header_color = $this->headerColor;
} else {
$header_color = PHUIActionHeaderView::HEADER_WHITE;
}
if ($this->header) {

View file

@ -6,7 +6,7 @@ final class PHUIWorkpanelView extends AphrontTagView {
private $header;
private $subheader = null;
private $footerAction;
private $headerColor = PHUIActionHeaderView::HEADER_GREY;
private $headerColor;
private $headerActions = array();
private $headerTag;
private $headerIcon;
@ -77,9 +77,9 @@ final class PHUIWorkpanelView extends AphrontTagView {
$footer_tag);
}
$header = id(new PHUIActionHeaderView())
->setHeaderTitle($this->header)
->setHeaderSubtitle($this->subheader)
$header = id(new PHUIHeaderView())
->setHeader($this->header)
->setSubheader($this->subheader)
->setHeaderColor($this->headerColor);
if ($this->headerIcon) {
@ -87,11 +87,11 @@ final class PHUIWorkpanelView extends AphrontTagView {
}
if ($this->headerTag) {
$header->setTag($this->headerTag);
$header->addTag($this->headerTag);
}
foreach ($this->headerActions as $action) {
$header->addAction($action);
$header->addActionIcon($action);
}
$classes[] = 'phui-workpanel-'.$this->headerColor;

View file

@ -73,12 +73,12 @@ final class PhabricatorHovercardView extends AphrontView {
$handle->getTypeName(),
$this->title ? $this->title : $handle->getName());
$header = new PHUIActionHeaderView();
$header = new PHUIHeaderView();
$header->setHeaderColor($this->color);
$header->setHeaderTitle($title);
$header->setHeader($title);
if ($this->tags) {
foreach ($this->tags as $tag) {
$header->setTag($tag);
$header->addTag($tag);
}
}

View file

@ -46,8 +46,9 @@
border: 0;
}
.conpherence-widget-pane .widgets-header {
border-bottom: 1px solid {$thinblueborder};
.conpherence-widget-pane .widgets-header .phui-header-view {
padding: 8px;
font-size: 14px;
}
.device .conpherence-widget-pane .widgets-header {
@ -58,7 +59,7 @@
float: none;
height: 0px;
width: 0px;
margin-right: 0px;
margin: 7px 0 0 4px;
border-top-color: #000;
}

View file

@ -12,20 +12,11 @@
overflow-x: auto;
}
.phabricator-feed-frame .phui-action-header-title {
font-size: 16px;
margin-bottom: 5px;
}
.device-desktop .phabricator-feed-frame {
max-width: 600px;
margin: 16px;
}
.phabricator-feed-frame .phui-action-header {
padding: 0;
}
.phabricator-feed-story-date-separator {
margin-top: 16px;
}
@ -59,36 +50,36 @@
max-width: none;
}
.dashboard-pane .phabricator-feed-frame .phui-action-header {
background: #f7f7f7;
.dashboard-pane .phabricator-feed-frame .phui-header-shell {
padding: 0;
}
.dashboard-pane .phabricator-feed-frame .phui-action-header-title {
.dashboard-pane .phabricator-feed-frame .phui-header-view {
font-size: 13px;
margin-left: 12px;
margin-left: 4px;
padding: 8px 0;
margin-bottom: 0;
color: {$bluetext};
font-weight: bold;
font-weight: 500;
}
.dashboard-pane .phabricator-feed-frame .phui-feed-story {
border: none;
border-bottom: 1px solid {$thinblueborder};
margin: 0 8px;
margin: 0;
}
.dashboard-pane .phabricator-feed-frame .phui-feed-story-head {
padding: 12px 0;
padding: 12px 4px;
}
.dashboard-pane .phabricator-feed-frame .phui-feed-story-body {
margin: 12px 0;
margin: 12px 4px;
}
.dashboard-pane .phabricator-feed-frame .phui-feed-story-foot {
background: #fff;
padding: 12px 0;
padding: 12px 4px;
}
.dashboard-pane .phabricator-feed-frame

View file

@ -29,14 +29,14 @@
border-bottom: 1px solid {$thinblueborder};
}
.phabricator-hovercard-head .phui-action-header {
border-top-right-radius: 3px;
border-top-left-radius: 3px;
.phabricator-hovercard-head .phui-header-view {
padding: 8px;
}
.phabricator-hovercard-head .phui-tag-type-state {
color: {$bluetext};
color: {$darkbluetext};
text-shadow: none;
font-weight: normal;
}
.phabricator-hovercard-tags {

View file

@ -1,85 +0,0 @@
/**
* @provides phui-action-header-view-css
*/
.phui-action-header {
padding: 0 5px 0 8px;
overflow: hidden;
}
.phui-action-header-title {
color: #000;
float: left;
font-size: 15px;
font-weight: normal;
line-height: 15px;
padding: 12px 0;
white-space: nowrap;
}
.gradient-lightblue-header .phui-action-header-title {
color: {$darkbluetext};
}
.phui-action-header-icon-list {
float: right;
padding-top: 4px;
}
.phui-action-header-icon-item {
float: right;
padding-left: 4px;
}
.phui-action-header-icon-item .phui-icon-view {
display: inline-block;
font-size: 18px;
margin: 4px 0;
height: 18px;
width: 18px;
}
.phui-action-header-icon-item .phui-tag-view {
margin: 4px 2px 0;
display: inline-block;
}
.phui-action-header-link {
color: #000;
}
.phui-action-header.gradient-white-header {
background: #fff;
}
.phui-action-header.gradient-white-header .phui-action-header-title {
color: {$darkbluetext};
padding: 12px 0 12px 4px;
}
.phui-action-header.gradient-white-header
.phui-action-header-icon-list .phui-icon-view {
color: {$lightbluetext};
}
.phui-action-header.gradient-white-header
.phui-action-header-icon-list .phui-icon-view:hover {
color: {$darkbluetext};
}
.phui-action-header-icon-list .phui-tag-view {
font-weight: normal;
}
.phui-action-header-title .phui-icon-view {
float: left;
height: 16px;
width: 16px;
margin-right: 4px;
}
.phui-action-header-title .phui-action-header-subtitle {
margin-left: 4px;
font-weight: normal;
color: {$lightgreytext};
}

View file

@ -8,6 +8,10 @@
position: relative;
}
.phui-document-view .phui-header-shell {
padding: 0 12px;
}
.phui-document-content {
border-radius: 3px;
}

View file

@ -3,7 +3,7 @@
*/
.phui-header-shell {
border-bottom: 1px solid {$hovergrey};
border-bottom: 1px solid {$thinblueborder};
overflow: hidden;
}
@ -38,9 +38,10 @@ body .phui-header-shell.phui-bleed-header
}
.phui-header-view {
padding: 16px;
padding: 12px 4px 16px;
font-size: 15px;
color: #000;
color: {$darkbluetext};
font-weight: 500;
position: relative;
}
@ -123,8 +124,11 @@ body.device-phone .phui-header-view {
}
.phui-header-subheader .phui-header-status-dark {
color: {$indigo};
text-shadow: 0 1px #fff;
color: {$sh-indigotext};
background-color: {$sh-indigobackground};
padding: 2px 8px;
border-radius: 3px;
margin-right: 8px;
}
.phui-header-subheader .phui-header-status-dark .phui-icon-view {
@ -132,11 +136,19 @@ body.device-phone .phui-header-view {
}
.phui-header-subheader .phui-header-status-red {
color: {$red};
color: {$sh-redtext};
background-color: {$sh-redbackground};
padding: 2px 8px;
border-radius: 3px;
margin-right: 8px;
}
.phui-header-subheader .phui-header-status-green {
color: {$green};
color: {$sh-greentext};
background-color: {$sh-greenbackground};
padding: 2px 8px;
border-radius: 3px;
margin-right: 8px;
}
.phui-header-action-links .phui-mobile-menu {
@ -155,3 +167,7 @@ body.device-phone .phui-header-view {
margin: 0 4px;
float: right;
}
.phui-header-icon-list .phui-header-list-icon .phui-icon-view {
font-size: 15px;
}

View file

@ -23,7 +23,6 @@ div.phui-object-box.phui-object-box-flush {
.phui-object-box .phui-header-shell h1 {
padding: 0 0 8px 0;
font-weight: normal;
}
.phui-object-box .phui-header-shell + .phui-info-view {
@ -39,7 +38,7 @@ div.phui-object-box.phui-object-box-flush {
border-bottom: 1px solid {$greenborder};
}
.phui-box-border.phui-object-box-lightgreen .phui-action-header {
.phui-box-border.phui-object-box-lightgreen .phui-header-shell {
border-bottom: 1px solid {$lightgreenborder};
}
@ -48,7 +47,7 @@ div.phui-object-box.phui-object-box-flush {
border-bottom: 1px solid {$blueborder};
}
.phui-box-border.phui-object-box-lightblue .phui-action-header {
.phui-box-border.phui-object-box-lightblue .phui-header-shell {
border-bottom: 1px solid {$lightblueborder};
}
@ -57,7 +56,7 @@ div.phui-object-box.phui-object-box-flush {
border-bottom: 1px solid {$redborder};
}
.phui-box-border.phui-object-box-lightred .phui-action-header {
.phui-box-border.phui-object-box-lightred .phui-header-shell {
border-bottom: 1px solid {$lightredborder};
}
@ -66,7 +65,7 @@ div.phui-object-box.phui-object-box-flush {
border-bottom: 1px solid {$violetborder};
}
.phui-box-border.phui-object-box-lightviolet .phui-action-header {
.phui-box-border.phui-object-box-lightviolet .phui-header-shell {
border-bottom: 1px solid {$lightvioletborder};
}
@ -83,8 +82,7 @@ div.phui-object-box.phui-object-box-flush {
}
.phui-object-box .phui-object-box .phui-header-shell h1 {
background-color: {$lightgreybackground};
padding: 8px 12px;
padding: 8px 4px;
font-size: 13px;
margin: 0;
color: {$bluetext};

View file

@ -612,10 +612,9 @@ ul.phui-object-item-icons {
.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;
padding: 8px 4px;
font-weight: 500;
}

View file

@ -9,14 +9,14 @@
.device-desktop .phui-workboard-view-shadow {
overflow-x: auto;
position: absolute;
top: 120px;
top: 110px;
bottom: 0;
left: 0;
right: 0;
}
.device-desktop .page-has-warning .phui-workboard-view-shadow {
top: 148px;
top: 138px;
}
.phui-workboard-view-shadow::-webkit-scrollbar {
@ -90,3 +90,17 @@
margin-left: 8px;
margin-right: 8px;
}
.project-board-header {
margin: 8px 12px;
}
.project-board-header .phui-header-view {
font-size: 18px;
}
.project-board-header .phui-header-subheader {
display: inline-block;
margin: 0;
padding: 0 8px;
}

View file

@ -2,14 +2,23 @@
* @provides phui-workpanel-view-css
*/
.phui-workpanel-view .phui-action-header {
border: 1px solid #b3b5b6;
.phui-workpanel-view .phui-header-shell {
border: 1px solid {$lightblueborder};
border-top-left-radius: 3px;
border-top-right-radius: 3px;
background-color: #fff;
}
.phui-workpanel-view .phui-action-header .phui-action-header-title {
padding: 8px 0;
.phui-workpanel-view .phui-header-shell .phui-header-view {
padding: 8px;
font-size: 14px;
}
.phui-workpanel-view .phui-header-shell .phui-header-subheader {
padding: 0 4px;
margin: 0;
display: inline-block;
color: {$lightgreytext};
}
.device-phone .phui-workboard-view {