From 46f6c2680eb51288e003ef15513fd9729ec43e98 Mon Sep 17 00:00:00 2001 From: Chad Little Date: Fri, 15 May 2015 13:28:59 -0700 Subject: [PATCH] [Redesign] New PHUIObjectItemListView Summary: New, cleaner, ObjectItemLists. Lots of minor style tweaks, basic overview: - Remove FootIcons - Remove Stackable - Remove Plain List - Add StatusIcon - Add setting ObjectList to an ObjectBox - Minor retouches to Headers Mostly, this should give us an idea of life with the new Object Lists. I'll take another application by application pass down the road. This mostly looks at implementation in Maniphest, Differential, Audit, Workboards. Checked a few other areas and dialogs while testing, and everything looks square. Test Plan: Maniphest, Differential, Homepage, Audit, People, and other applications. Drag reorder, etc. Reviewers: btrahan, epriestley Reviewed By: epriestley Subscribers: Korvin, epriestley Differential Revision: https://secure.phabricator.com/D12865 --- resources/celerity/map.php | 20 +-- .../controller/AlmanacConsoleController.php | 5 +- .../audit/view/PhabricatorAuditListView.php | 5 +- .../PhabricatorConfigGroupController.php | 3 +- .../PhabricatorConfigIssueListController.php | 1 - .../PhabricatorConfigListController.php | 3 +- .../view/DifferentialRevisionListView.php | 11 +- .../PhabricatorHomeMainController.php | 13 +- .../maniphest/view/ManiphestTaskListView.php | 8 +- .../view/ManiphestTaskResultListView.php | 53 +++--- .../PhortuneAccountListController.php | 6 +- ...abricatorProjectBoardReorderController.php | 9 +- ...habricatorProjectMembersEditController.php | 5 +- ...habricatorHomePreferencesSettingsPanel.php | 3 +- .../view/SubscriptionListDialogBuilder.php | 3 +- .../PhabricatorTokenGivenController.php | 3 +- .../PhabricatorTokenLeaderController.php | 3 +- .../examples/PHUIObjectItemListExample.php | 153 ++++++++---------- src/view/phui/PHUIObjectBoxView.php | 10 ++ src/view/phui/PHUIObjectItemListView.php | 20 --- src/view/phui/PHUIObjectItemView.php | 78 ++++----- .../application/maniphest/batch-editor.css | 2 +- .../application/maniphest/task-summary.css | 41 +---- webroot/rsrc/css/phui/phui-header-view.css | 6 + .../css/phui/phui-object-item-list-view.css | 131 +++++++++------ 25 files changed, 280 insertions(+), 315 deletions(-) diff --git a/resources/celerity/map.php b/resources/celerity/map.php index 2fdb459dcc..8682591543 100644 --- a/resources/celerity/map.php +++ b/resources/celerity/map.php @@ -7,14 +7,14 @@ */ return array( 'names' => array( - 'core.pkg.css' => '50250d4f', + 'core.pkg.css' => '178ec7e2', 'core.pkg.js' => 'f3e08b38', 'darkconsole.pkg.js' => 'e7393ebb', 'differential.pkg.css' => 'bb338e4b', 'differential.pkg.js' => '895b8d62', 'diffusion.pkg.css' => '591664fa', 'diffusion.pkg.js' => '0115b37c', - 'maniphest.pkg.css' => '68d4dd3d', + 'maniphest.pkg.css' => 'ddf93c68', 'maniphest.pkg.js' => 'df4aa49f', 'rsrc/css/aphront/aphront-bars.css' => '231ac33c', 'rsrc/css/aphront/dark-console.css' => '6378ef3d', @@ -74,10 +74,10 @@ return array( 'rsrc/css/application/harbormaster/harbormaster.css' => '49d64eb4', 'rsrc/css/application/herald/herald-test.css' => '778b008e', 'rsrc/css/application/herald/herald.css' => '826075fa', - 'rsrc/css/application/maniphest/batch-editor.css' => '8f380ebc', + 'rsrc/css/application/maniphest/batch-editor.css' => '9a5ed9c1', 'rsrc/css/application/maniphest/report.css' => 'f6931fdf', 'rsrc/css/application/maniphest/task-edit.css' => '8e23031b', - 'rsrc/css/application/maniphest/task-summary.css' => 'ab2fc691', + 'rsrc/css/application/maniphest/task-summary.css' => '307c88e9', 'rsrc/css/application/objectselector/object-selector.css' => '029a133d', 'rsrc/css/application/owners/owners-path-editor.css' => '2f00933b', 'rsrc/css/application/paste/paste.css' => 'eb997ddd', @@ -134,14 +134,14 @@ return array( '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' => '5c0c1c39', + 'rsrc/css/phui/phui-header-view.css' => 'c2855306', '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' => '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' => 'c259c94f', + 'rsrc/css/phui/phui-object-item-list-view.css' => 'e052f697', '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', @@ -685,10 +685,10 @@ return array( 'javelin-websocket' => 'e292eaf4', 'javelin-workflow' => '5b2e3e2b', 'lightbox-attachment-css' => '7acac05d', - 'maniphest-batch-editor' => '8f380ebc', + 'maniphest-batch-editor' => '9a5ed9c1', 'maniphest-report-css' => 'f6931fdf', 'maniphest-task-edit-css' => '8e23031b', - 'maniphest-task-summary-css' => 'ab2fc691', + 'maniphest-task-summary-css' => '307c88e9', 'multirow-row-manager' => 'b5d57730', 'owners-path-editor' => 'aa1733d0', 'owners-path-editor-css' => '2f00933b', @@ -769,7 +769,7 @@ return array( 'phui-fontkit-css' => '1e71371a', 'phui-form-css' => 'f535f938', 'phui-form-view-css' => 'e1abbe8e', - 'phui-header-view-css' => '5c0c1c39', + 'phui-header-view-css' => 'c2855306', 'phui-icon-view-css' => 'bc766998', 'phui-image-mask-css' => '5a8b09c8', 'phui-info-panel-css' => '27ea50a1', @@ -777,7 +777,7 @@ return array( 'phui-inline-comment-view-css' => '2174771a', 'phui-list-view-css' => '2e25ebfb', 'phui-object-box-css' => '3a601bc5', - 'phui-object-item-list-view-css' => 'c259c94f', + 'phui-object-item-list-view-css' => 'e052f697', 'phui-pinboard-view-css' => 'eaab2b1b', 'phui-property-list-view-css' => 'd2d143ea', 'phui-remarkup-preview-css' => '19ad512b', diff --git a/src/applications/almanac/controller/AlmanacConsoleController.php b/src/applications/almanac/controller/AlmanacConsoleController.php index 60fa4e010e..2cd1cc654b 100644 --- a/src/applications/almanac/controller/AlmanacConsoleController.php +++ b/src/applications/almanac/controller/AlmanacConsoleController.php @@ -10,8 +10,7 @@ final class AlmanacConsoleController extends AlmanacController { $viewer = $request->getViewer(); $menu = id(new PHUIObjectItemListView()) - ->setUser($viewer) - ->setStackable(true); + ->setUser($viewer); $menu->addItem( id(new PHUIObjectItemView()) @@ -45,7 +44,7 @@ final class AlmanacConsoleController extends AlmanacController { $box = id(new PHUIObjectBoxView()) ->setHeaderText('Console') - ->appendChild($menu); + ->setObjectList($menu); return $this->buildApplicationPage( array( diff --git a/src/applications/audit/view/PhabricatorAuditListView.php b/src/applications/audit/view/PhabricatorAuditListView.php index 6fc54f2e5f..d7efc858a3 100644 --- a/src/applications/audit/view/PhabricatorAuditListView.php +++ b/src/applications/audit/view/PhabricatorAuditListView.php @@ -148,7 +148,6 @@ final class PhabricatorAuditListView extends AphrontView { ->setObjectName($commit_name) ->setHeader($commit_desc) ->setHref($commit_link) - ->setBarColor($status_color) ->addAttribute($status_text) ->addAttribute($reasons) ->addIcon('none', $committed) @@ -158,6 +157,10 @@ final class PhabricatorAuditListView extends AphrontView { $item->addByLine(pht('Auditors: %s', $auditors)); } + if ($status_color) { + $item->setStatusIcon('fa-exclamation-triangle '.$status_color); + } + $list->addItem($item); } diff --git a/src/applications/config/controller/PhabricatorConfigGroupController.php b/src/applications/config/controller/PhabricatorConfigGroupController.php index 4f26bc3ba2..b9dffd9a08 100644 --- a/src/applications/config/controller/PhabricatorConfigGroupController.php +++ b/src/applications/config/controller/PhabricatorConfigGroupController.php @@ -24,7 +24,7 @@ final class PhabricatorConfigGroupController $box = id(new PHUIObjectBoxView()) ->setHeaderText($title) - ->appendChild($list); + ->setObjectList($list); $crumbs = $this ->buildApplicationCrumbs() @@ -63,7 +63,6 @@ final class PhabricatorConfigGroupController $engine->process(); $list = new PHUIObjectItemListView(); - $list->setStackable(true); foreach ($options as $option) { $summary = $engine->getOutput($option, 'summary'); diff --git a/src/applications/config/controller/PhabricatorConfigIssueListController.php b/src/applications/config/controller/PhabricatorConfigIssueListController.php index ab6c17d885..ceadd63a87 100644 --- a/src/applications/config/controller/PhabricatorConfigIssueListController.php +++ b/src/applications/config/controller/PhabricatorConfigIssueListController.php @@ -76,7 +76,6 @@ final class PhabricatorConfigIssueListController private function buildIssueList(array $issues, $group) { assert_instances_of($issues, 'PhabricatorSetupIssue'); $list = new PHUIObjectItemListView(); - $list->setStackable(true); $ignored_items = array(); $items = 0; diff --git a/src/applications/config/controller/PhabricatorConfigListController.php b/src/applications/config/controller/PhabricatorConfigListController.php index 4044fa8db3..ea79ec84c4 100644 --- a/src/applications/config/controller/PhabricatorConfigListController.php +++ b/src/applications/config/controller/PhabricatorConfigListController.php @@ -22,7 +22,7 @@ final class PhabricatorConfigListController $apps = id(new PHUIObjectBoxView()) ->setHeaderText(pht('Applications Configuration')) - ->appendChild($apps_list); + ->setObjectList($apps_list); $nav->appendChild( array( @@ -47,7 +47,6 @@ final class PhabricatorConfigListController assert_instances_of($groups, 'PhabricatorApplicationConfigOptions'); $list = new PHUIObjectItemListView(); - $list->setStackable(true); $groups = msort($groups, 'getName'); foreach ($groups as $group) { if ($group->getGroup() == $type) { diff --git a/src/applications/differential/view/DifferentialRevisionListView.php b/src/applications/differential/view/DifferentialRevisionListView.php index 121792585d..fad49ba68a 100644 --- a/src/applications/differential/view/DifferentialRevisionListView.php +++ b/src/applications/differential/view/DifferentialRevisionListView.php @@ -165,19 +165,24 @@ final class DifferentialRevisionListView extends AphrontView { switch ($status) { case ArcanistDifferentialRevisionStatus::NEEDS_REVIEW: + $item->setStatusIcon('fa-square-o black', pht('Needs Review')); break; case ArcanistDifferentialRevisionStatus::NEEDS_REVISION: + $item->setStatusIcon('fa-refresh red', pht('Needs Revision')); + break; case ArcanistDifferentialRevisionStatus::CHANGES_PLANNED: - $item->setBarColor('red'); + $item->setStatusIcon('fa-headphones red', pht('Changes Planned')); break; case ArcanistDifferentialRevisionStatus::ACCEPTED: - $item->setBarColor('green'); + $item->setStatusIcon('fa-check green', pht('Accepted')); break; case ArcanistDifferentialRevisionStatus::CLOSED: $item->setDisabled(true); + $item->setStatusIcon('fa-check-square-o black', pht('Closed')); break; case ArcanistDifferentialRevisionStatus::ABANDONED: - $item->setBarColor('black'); + $item->setDisabled(true); + $item->setStatusIcon('fa-plane black', pht('Abandoned')); break; } diff --git a/src/applications/home/controller/PhabricatorHomeMainController.php b/src/applications/home/controller/PhabricatorHomeMainController.php index 9f62d1b56d..7d794a1136 100644 --- a/src/applications/home/controller/PhabricatorHomeMainController.php +++ b/src/applications/home/controller/PhabricatorHomeMainController.php @@ -152,7 +152,7 @@ final class PhabricatorHomeMainController extends PhabricatorHomeController { $title = pht('Unbreak Now!'); $panel = new PHUIObjectBoxView(); $panel->setHeader($this->renderSectionHeader($title, $href)); - $panel->appendChild($this->buildTaskListView($tasks)); + $panel->setObjectList($this->buildTaskListView($tasks)); return $panel; } @@ -202,7 +202,7 @@ final class PhabricatorHomeMainController extends PhabricatorHomeController { $user->getPHID()); $panel = new PHUIObjectBoxView(); $panel->setHeader($this->renderSectionHeader($title, $href)); - $panel->appendChild($this->buildTaskListView($tasks)); + $panel->setObjectList($this->buildTaskListView($tasks)); return $panel; } @@ -248,9 +248,8 @@ final class PhabricatorHomeMainController extends PhabricatorHomeController { $revision_view->setHandles($handles); $list_view = $revision_view->render(); - $list_view->setFlush(true); - $panel->appendChild($list_view); + $panel->setObjectList($list_view); return $panel; } @@ -290,7 +289,7 @@ final class PhabricatorHomeMainController extends PhabricatorHomeController { $href = '/maniphest/query/assigned/'; $panel = new PHUIObjectBoxView(); $panel->setHeader($this->renderSectionHeader($title, $href)); - $panel->appendChild($this->buildTaskListView($tasks)); + $panel->setObjectList($this->buildTaskListView($tasks)); return $panel; } @@ -375,7 +374,7 @@ final class PhabricatorHomeMainController extends PhabricatorHomeController { $href = '/audit/'; $panel = new PHUIObjectBoxView(); $panel->setHeader($this->renderSectionHeader($title, $href)); - $panel->appendChild($view); + $panel->setObjectList($view); return $panel; } @@ -414,7 +413,7 @@ final class PhabricatorHomeMainController extends PhabricatorHomeController { $href = '/audit/'; $panel = new PHUIObjectBoxView(); $panel->setHeader($this->renderSectionHeader($title, $href)); - $panel->appendChild($view); + $panel->setObjectList($view); return $panel; } diff --git a/src/applications/maniphest/view/ManiphestTaskListView.php b/src/applications/maniphest/view/ManiphestTaskListView.php index 0dca204391..efab4c42f7 100644 --- a/src/applications/maniphest/view/ManiphestTaskListView.php +++ b/src/applications/maniphest/view/ManiphestTaskListView.php @@ -41,7 +41,6 @@ final class ManiphestTaskListView extends ManiphestView { require_celerity_resource('maniphest-task-summary-css'); $list = new PHUIObjectItemListView(); - $list->setFlush(true); if ($this->noDataString) { $list->setNoDataString($this->noDataString); @@ -68,11 +67,14 @@ final class ManiphestTaskListView extends ManiphestView { } $status = $task->getStatus(); + // TODO: redesign-2015 move icon map to maniphest.statuses + $icon = 'fa-exclamation-circle '; + $icon .= idx($color_map, $task->getPriority(), 'grey'); if ($task->isClosed()) { $item->setDisabled(true); + $icon = 'fa-check-square-o grey'; } - - $item->setBarColor(idx($color_map, $task->getPriority(), 'grey')); + $item->setStatusIcon($icon, idx($status_map, $task->getStatus())); $item->addIcon( 'none', diff --git a/src/applications/maniphest/view/ManiphestTaskResultListView.php b/src/applications/maniphest/view/ManiphestTaskResultListView.php index 0d9a6c86a3..fc3756645b 100644 --- a/src/applications/maniphest/view/ManiphestTaskResultListView.php +++ b/src/applications/maniphest/view/ManiphestTaskResultListView.php @@ -79,26 +79,16 @@ final class ManiphestTaskResultListView extends ManiphestView { $task_list->setTasks($list); $task_list->setHandles($handles); - $header = javelin_tag( - 'h1', - array( - 'class' => 'maniphest-task-group-header', - 'sigil' => 'task-group', - 'meta' => array( - 'priority' => head($list)->getPriority(), - ), - ), - pht('%s (%s)', $group, new PhutilNumber(count($list)))); + $header = id(new PHUIHeaderView()) + ->addClass('maniphest-task-group-header') + ->addSigil('task-group') + ->setMetadata(array('priority' => head($list)->getPriority())) + ->setHeader(pht('%s (%s)', $group, new PhutilNumber(count($list)))); + + $lists[] = id(new PHUIObjectBoxView()) + ->setHeader($header) + ->appendChild($task_list); - $lists[] = phutil_tag( - 'div', - array( - 'class' => 'maniphest-task-group', - ), - array( - $header, - $task_list, - )); } if ($can_drag) { @@ -109,15 +99,10 @@ final class ManiphestTaskResultListView extends ManiphestView { )); } - return phutil_tag( - 'div', - array( - 'class' => 'maniphest-list-container', - ), - array( - $lists, - $this->showBatchControls ? $this->renderBatchEditor($query) : null, - )); + return array( + $lists, + $this->showBatchControls ? $this->renderBatchEditor($query) : null, + ); } @@ -251,8 +236,6 @@ final class ManiphestTaskResultListView extends ManiphestView { ''); $editor = hsprintf( - '
'. - '
%s
'. ''. ''. ''. @@ -260,9 +243,7 @@ final class ManiphestTaskResultListView extends ManiphestView { ''. ''. ''. - '
%s%s%s%s%s
'. - '
', - pht('Batch Task Editor'), + '', $select_all, $select_none, $export, @@ -279,6 +260,10 @@ final class ManiphestTaskResultListView extends ManiphestView { ), $editor); - return $editor; + $box = id(new PHUIObjectBoxView()) + ->setHeaderText(pht('Batch Task Editor')) + ->appendChild($editor); + + return $box; } } diff --git a/src/applications/phortune/controller/PhortuneAccountListController.php b/src/applications/phortune/controller/PhortuneAccountListController.php index 8d0d880661..8613cbda4d 100644 --- a/src/applications/phortune/controller/PhortuneAccountListController.php +++ b/src/applications/phortune/controller/PhortuneAccountListController.php @@ -27,7 +27,6 @@ final class PhortuneAccountListController extends PhortuneController { $crumbs->addTextCrumb(pht('Accounts')); $payment_list = id(new PHUIObjectItemListView()) - ->setStackable(true) ->setUser($viewer) ->setNoDataString( pht( @@ -57,10 +56,9 @@ final class PhortuneAccountListController extends PhortuneController { $payment_box = id(new PHUIObjectBoxView()) ->setHeader($payment_header) - ->appendChild($payment_list); + ->setObjectList($payment_list); $merchant_list = id(new PHUIObjectItemListView()) - ->setStackable(true) ->setUser($viewer) ->setNoDataString( pht( @@ -90,7 +88,7 @@ final class PhortuneAccountListController extends PhortuneController { $merchant_box = id(new PHUIObjectBoxView()) ->setHeader($merchant_header) - ->appendChild($merchant_list); + ->setObjectList($merchant_list); return $this->buildApplicationPage( array( diff --git a/src/applications/project/controller/PhabricatorProjectBoardReorderController.php b/src/applications/project/controller/PhabricatorProjectBoardReorderController.php index 9b33999a77..3bd1233909 100644 --- a/src/applications/project/controller/PhabricatorProjectBoardReorderController.php +++ b/src/applications/project/controller/PhabricatorProjectBoardReorderController.php @@ -102,8 +102,7 @@ final class PhabricatorProjectBoardReorderController $list = id(new PHUIObjectItemListView()) ->setUser($viewer) ->setID($list_id) - ->setFlush(true) - ->setStackable(true); + ->setFlush(true); foreach ($columns as $column) { $item = id(new PHUIObjectItemView()) @@ -132,10 +131,14 @@ final class PhabricatorProjectBoardReorderController 'reorderURI' => $reorder_uri, )); + $note = id(new PHUIInfoView()) + ->appendChild(pht('Drag and drop columns to reorder them.')) + ->setSeverity(PHUIInfoView::SEVERITY_NOTICE); + return $this->newDialog() ->setTitle(pht('Reorder Columns')) ->setWidth(AphrontDialogView::WIDTH_FORM) - ->appendParagraph(pht('Drag and drop columns to reorder them.')) + ->appendChild($note) ->appendChild($list) ->addSubmitButton(pht('Done')); } diff --git a/src/applications/project/controller/PhabricatorProjectMembersEditController.php b/src/applications/project/controller/PhabricatorProjectMembersEditController.php index 750df2b77d..d033a87394 100644 --- a/src/applications/project/controller/PhabricatorProjectMembersEditController.php +++ b/src/applications/project/controller/PhabricatorProjectMembersEditController.php @@ -129,8 +129,7 @@ final class PhabricatorProjectMembersEditController PhabricatorPolicyCapability::CAN_EDIT); $list = id(new PHUIObjectItemListView()) - ->setNoDataString(pht('This project does not have any members.')) - ->setStackable(true); + ->setNoDataString(pht('This project does not have any members.')); foreach ($handles as $handle) { $remove_uri = $this->getApplicationURI( @@ -155,7 +154,7 @@ final class PhabricatorProjectMembersEditController $box = id(new PHUIObjectBoxView()) ->setHeaderText(pht('Members')) - ->appendChild($list); + ->setObjectList($list); return $box; } diff --git a/src/applications/settings/panel/PhabricatorHomePreferencesSettingsPanel.php b/src/applications/settings/panel/PhabricatorHomePreferencesSettingsPanel.php index 58614bcedb..29acce2b15 100644 --- a/src/applications/settings/panel/PhabricatorHomePreferencesSettingsPanel.php +++ b/src/applications/settings/panel/PhabricatorHomePreferencesSettingsPanel.php @@ -126,8 +126,7 @@ final class PhabricatorHomePreferencesSettingsPanel $list = id(new PHUIObjectItemListView()) ->setUser($user) - ->setID($list_id) - ->setStackable(true); + ->setID($list_id); Javelin::initBehavior( 'reorder-applications', diff --git a/src/applications/subscriptions/view/SubscriptionListDialogBuilder.php b/src/applications/subscriptions/view/SubscriptionListDialogBuilder.php index 839651134e..67e013d9c2 100644 --- a/src/applications/subscriptions/view/SubscriptionListDialogBuilder.php +++ b/src/applications/subscriptions/view/SubscriptionListDialogBuilder.php @@ -53,7 +53,6 @@ final class SubscriptionListDialogBuilder { return id(new AphrontDialogView()) ->setUser($this->getViewer()) ->setWidth(AphrontDialogView::WIDTH_FORM) - ->setFlush(true) ->setTitle($this->getTitle()) ->appendChild($this->buildBody($this->getViewer(), $handles)) ->addCancelButton($object_handle->getURI(), pht('Close')); @@ -63,7 +62,7 @@ final class SubscriptionListDialogBuilder { $list = id(new PHUIObjectItemListView()) ->setUser($viewer) - ->setStackable(true); + ->setFlush(true); foreach ($handles as $handle) { $item = id(new PHUIObjectItemView()) ->setHeader($handle->getFullName()) diff --git a/src/applications/tokens/controller/PhabricatorTokenGivenController.php b/src/applications/tokens/controller/PhabricatorTokenGivenController.php index 3544a345e1..56913d15cd 100644 --- a/src/applications/tokens/controller/PhabricatorTokenGivenController.php +++ b/src/applications/tokens/controller/PhabricatorTokenGivenController.php @@ -39,7 +39,6 @@ final class PhabricatorTokenGivenController extends PhabricatorTokenController { } $list = new PHUIObjectItemListView(); - $list->setStackable(true); foreach ($tokens_given as $token_given) { $handle = $handles[$token_given->getObjectPHID()]; $token = idx($tokens, $token_given->getTokenPHID()); @@ -62,7 +61,7 @@ final class PhabricatorTokenGivenController extends PhabricatorTokenController { $box = id(new PHUIObjectBoxView()) ->setHeaderText($title) - ->appendChild($list); + ->setObjectList($list); $nav = $this->buildSideNav(); $nav->setCrumbs( diff --git a/src/applications/tokens/controller/PhabricatorTokenLeaderController.php b/src/applications/tokens/controller/PhabricatorTokenLeaderController.php index 459f7c9ba4..52575c247a 100644 --- a/src/applications/tokens/controller/PhabricatorTokenLeaderController.php +++ b/src/applications/tokens/controller/PhabricatorTokenLeaderController.php @@ -30,7 +30,6 @@ final class PhabricatorTokenLeaderController } $list = new PHUIObjectItemListView(); - $list->setStackable(true); foreach ($phids as $object) { $count = idx($counts, $object, 0); $item = id(new PHUIObjectItemView()); @@ -46,7 +45,7 @@ final class PhabricatorTokenLeaderController $box = id(new PHUIObjectBoxView()) ->setHeaderText($title) - ->appendChild($list); + ->setObjectList($list); $nav = $this->buildSideNav(); $nav->setCrumbs( diff --git a/src/applications/uiexample/examples/PHUIObjectItemListExample.php b/src/applications/uiexample/examples/PHUIObjectItemListExample.php index 370276eaa6..6ca2b92e32 100644 --- a/src/applications/uiexample/examples/PHUIObjectItemListExample.php +++ b/src/applications/uiexample/examples/PHUIObjectItemListExample.php @@ -22,14 +22,12 @@ final class PHUIObjectItemListExample extends PhabricatorUIExample { $out = array(); - $head = id(new PHUIHeaderView()) - ->setHeader(pht('Basic List')); - $list = new PHUIObjectItemListView(); $list->addItem( id(new PHUIObjectItemView()) ->setObjectName('FRUIT1') + ->setStatusIcon('fa-apple') ->setHeader(pht('Apple')) ->setHref('#')); @@ -45,22 +43,22 @@ final class PHUIObjectItemListExample extends PhabricatorUIExample { ->setHeader(pht('Cherry')) ->setHref('#')); - $out[] = array($head, $list); + $box = id(new PHUIObjectBoxView()) + ->setHeaderText('Basic List') + ->setObjectList($list); + $out[] = $box; - $head = id(new PHUIHeaderView()) - ->setHeader(pht('Empty List')); $list = new PHUIObjectItemListView(); - $list->setNoDataString(pht('This list is empty.')); - $out[] = array($head, $list); + $box = id(new PHUIObjectBoxView()) + ->setHeaderText('Empty List') + ->setObjectList($list); + $out[] = $box; - $head = id(new PHUIHeaderView()) - ->setHeader(pht('Stacked List')); $list = new PHUIObjectItemListView(); - $list->setStackable(true); $list->addItem( id(new PHUIObjectItemView()) @@ -79,56 +77,29 @@ final class PHUIObjectItemListExample extends PhabricatorUIExample { ->setHeader(pht('Thursday')) ->setHref('#')); - $out[] = array($head, $list); + $box = id(new PHUIObjectBoxView()) + ->setHeaderText('Stacked List') + ->setObjectList($list); - $head = id(new PHUIHeaderView()) - ->setHeader(pht('Plain List')); - $list = new PHUIObjectItemListView(); - $list->setPlain(true); + $out[] = $box; - $list->addItem( - id(new PHUIObjectItemView()) - ->setHeader(pht('Monday')) - ->setSubHead('I love cats') - ->setHref('#')); - $list->addItem( - id(new PHUIObjectItemView()) - ->setHeader(pht('Tuesday')) - ->setSubHead('Cat, cats, cats') - ->setHref('#')); - $list->addItem( - id(new PHUIObjectItemView()) - ->setHeader(pht('Wednesday')) - ->setSubHead('Meow, meow, meow') - ->setHref('#')); - $list->addItem( - id(new PHUIObjectItemView()) - ->setHeader(pht('Thursday')) - ->setSubHead('Every single day') - ->setHref('#')); - - $out[] = array($head, $list); - - - $head = id(new PHUIHeaderView()) - ->setHeader(pht('Card List')); $list = new PHUIObjectItemListView(); $list->addItem( id(new PHUIObjectItemView()) ->setHeader(pht('Business Card')) - ->setBarColor('red')); + ->setStatusIcon('fa-warning red')); $list->addItem( id(new PHUIObjectItemView()) ->setHeader(pht('Playing Card')) - ->setBarColor('orange') + ->setStatusIcon('fa-warning orange') ->addIcon('fa-comment', pht('Royal Flush!'))); $owner = phutil_tag('a', array('href' => '#'), pht('jackofclubs')); $list->addItem( id(new PHUIObjectItemView()) ->setHeader(pht('House of Cards')) - ->setBarColor('yellow') + ->setStatusIcon('fa-warning yellow') ->setDisabled(true) ->addByline(pht('Owner: %s', $owner))); @@ -136,67 +107,65 @@ final class PHUIObjectItemListExample extends PhabricatorUIExample { $list->addItem( id(new PHUIObjectItemView()) ->setHeader(pht('Cardigan')) - ->setBarColor('green') + ->setStatusIcon('fa-check green') ->addIcon('fa-star', pht('Warm!')) ->addByline(pht('Author: %s', $author))); $list->addItem( id(new PHUIObjectItemView()) ->setHeader(pht('Cardamom')) - ->addFootIcon('fa-shield white', 'Spice') - ->setBarColor('blue')); + ->setStatusIcon('fa-check blue')); $list->addItem( id(new PHUIObjectItemView()) ->setHeader(pht( 'The human cardiovascular system includes the heart, lungs, and '. 'some other parts; most of these parts are pretty squishy')) - ->addFootIcon('fa-search white', pht('Respiration!')) ->addHandleIcon($handle, pht('You have a cardiovascular system!')) - ->setBarColor('indigo')); + ->setStatusIcon('fa-check indigo')); - $out[] = array($head, $list); + $box = id(new PHUIObjectBoxView()) + ->setHeaderText('Card List') + ->setObjectList($list); + $out[] = $box; - $head = id(new PHUIHeaderView()) - ->setHeader(pht('Grippable List')); $list = new PHUIObjectItemListView(); $list->addItem( id(new PHUIObjectItemView()) ->setHeader(pht('Grab ahold!')) ->setHref('#') - ->setGrippable(true) - ->setBarColor('red')); + ->setGrippable(true)); $list->addItem( id(new PHUIObjectItemView()) ->setHeader(pht('Hold on tight!')) ->setHref('#') - ->setGrippable(true) - ->setBarColor('yellow')); + ->setGrippable(true)); $list->addItem( id(new PHUIObjectItemView()) ->setHeader(pht("Don't let go!")) ->setHref('#') ->setGrippable(true) - ->setBarColor('green') ->addAction( id(new PHUIListItemView()) ->setHref('#') ->setIcon('fa-times'))); - $out[] = array($head, $list); + $box = id(new PHUIObjectBoxView()) + ->setHeaderText('Grippable List') + ->setObjectList($list); + + $out[] = $box; - $head = id(new PHUIHeaderView()) - ->setHeader(pht('List With Actions')); $list = new PHUIObjectItemListView(); $list->addItem( id(new PHUIObjectItemView()) ->setHeader(pht('You Have The Power')) ->setHref('#') - ->setBarColor('blue') + ->setStatusIcon('fa-circle-o blue') ->addAction( id(new PHUIListItemView()) ->setHref('#') @@ -207,7 +176,7 @@ final class PHUIObjectItemListExample extends PhabricatorUIExample { id(new PHUIObjectItemView()) ->setHeader(pht('Believe In Yourself')) ->setHref('#') - ->setBarColor('violet') + ->setStatusIcon('fa-circle-o violet') ->addAction( id(new PHUIListItemView()) ->setHref('#') @@ -219,8 +188,9 @@ final class PHUIObjectItemListExample extends PhabricatorUIExample { ->setName(pht('Oink')) ->setIcon('fa-times'))); - $out[] = array($head, $list); - + $box = id(new PHUIObjectBoxView()) + ->setHeaderText('Action Link List') + ->setObjectList($list); $head = id(new PHUIHeaderView()) ->setHeader(pht('Extras')); @@ -237,8 +207,6 @@ final class PHUIObjectItemListExample extends PhabricatorUIExample { ->addAttribute(pht('Rank: Ace')) ->addIcon('fa-heart', pht('Ace')) ->addIcon('fa-heart red', pht('Hearts')) - ->addFootIcon('fa-heart white', pht('Ace')) - ->addFootIcon('fa-heart white', pht('Heart')) ->addHandleIcon($handle, pht('You hold all the cards.')) ->addHandleIcon($handle, pht('You make all the rules.'))); @@ -264,11 +232,11 @@ final class PHUIObjectItemListExample extends PhabricatorUIExample { ->addIcon('fa-circle green', pht('Stuff')) ->addHandleIcon($handle, pht('More Stuff'))); - $out[] = array($head, $list); + $box = id(new PHUIObjectBoxView()) + ->setHeaderText('Action List') + ->setObjectList($list); - - $head = id(new PHUIHeaderView()) - ->setHeader(pht('Effects')); + $out[] = $box; $list = new PHUIObjectItemListView(); @@ -299,11 +267,11 @@ final class PHUIObjectItemListExample extends PhabricatorUIExample { ->setDisabled(true) ->setHref('#')); - $out[] = array($head, $list); + $box = id(new PHUIObjectBoxView()) + ->setHeaderText('Extra Things and Stuff') + ->setObjectList($list); - - $head = id(new PHUIHeaderView()) - ->setHeader(pht('Colors')); + $out[] = $box; $list = new PHUIObjectItemListView(); @@ -325,16 +293,17 @@ final class PHUIObjectItemListExample extends PhabricatorUIExample { $list->addItem( id(new PHUIObjectItemView()) ->setHeader($bar_label) - ->setBarColor($bar_color)); + ->setStatusIcon('fa-bell '.$bar_color)); } - $out[] = array($head, $list); + $box = id(new PHUIObjectBoxView()) + ->setHeaderText('Color Icons') + ->setObjectList($list); - - $head = id(new PHUIHeaderView()) - ->setHeader(pht('Images')); + $out[] = $box; $list = new PHUIObjectItemListView(); + $list->setFlush(true); $default_profile = PhabricatorFile::loadBuiltin($user, 'profile.png'); $default_project = PhabricatorFile::loadBuiltin($user, 'project.png'); @@ -343,11 +312,18 @@ final class PHUIObjectItemListExample extends PhabricatorUIExample { id(new PHUIObjectItemView()) ->setImageURI($default_profile->getViewURI()) ->setHeader(pht('Default User Profile Image')) - ->setBarColor('violet') ->addAction( id(new PHUIListItemView()) ->setHref('#') - ->setIcon('fa-plus-square'))); + ->setIcon('fa-pencil-square')) + ->addAction( + id(new PHUIListItemView()) + ->setHref('#') + ->setIcon('fa-plus-square')) + ->addAction( + id(new PHUIListItemView()) + ->setHref('#') + ->setIcon('fa-minus-square'))); $list->addItem( id(new PHUIObjectItemView()) @@ -356,10 +332,11 @@ final class PHUIObjectItemListExample extends PhabricatorUIExample { ->setGrippable(true) ->addAttribute(pht('This is the default project profile image.'))); - $out[] = array($head, $list); + $box = id(new PHUIObjectBoxView()) + ->setHeaderText('Profile Images') + ->setObjectList($list); - $head = id(new PHUIHeaderView()) - ->setHeader(pht('States')); + $out[] = $box; $list = id(new PHUIObjectItemListView()) ->setStates(true); @@ -405,10 +382,10 @@ final class PHUIObjectItemListExample extends PhabricatorUIExample { ->setState(PHUIObjectItemView::STATE_BUILD)); $box = id(new PHUIObjectBoxView()) - ->setHeaderText('Test Things') - ->appendChild($list); + ->setHeaderText('State Icons') + ->setObjectList($list); - $out[] = array($head, $box); + $out[] = array($box); return $out; } diff --git a/src/view/phui/PHUIObjectBoxView.php b/src/view/phui/PHUIObjectBoxView.php index 9344035b75..cbee65783c 100644 --- a/src/view/phui/PHUIObjectBoxView.php +++ b/src/view/phui/PHUIObjectBoxView.php @@ -15,6 +15,7 @@ final class PHUIObjectBoxView extends AphrontView { private $sigils = array(); private $metadata; private $actionListID; + private $objectList; private $tabs = array(); private $propertyLists = array(); @@ -138,6 +139,11 @@ final class PHUIObjectBoxView extends AphrontView { return $this; } + public function setObjectList($list) { + $this->objectList = $list; + return $this; + } + public function setValidationException( PhabricatorApplicationTransactionValidationException $ex = null) { $this->validationException = $ex; @@ -313,6 +319,10 @@ final class PHUIObjectBoxView extends AphrontView { $content->setMetadata($this->metadata); } + if ($this->objectList) { + $content->appendChild($this->objectList); + } + return $content; } } diff --git a/src/view/phui/PHUIObjectItemListView.php b/src/view/phui/PHUIObjectItemListView.php index 108a2d6500..7c3bd4aeaf 100644 --- a/src/view/phui/PHUIObjectItemListView.php +++ b/src/view/phui/PHUIObjectItemListView.php @@ -5,14 +5,11 @@ final class PHUIObjectItemListView extends AphrontTagView { private $header; private $items; private $pager; - private $stackable; private $noDataString; private $flush; - private $plain; private $allowEmptyList; private $states; - public function setAllowEmptyList($allow_empty_list) { $this->allowEmptyList = $allow_empty_list; return $this; @@ -27,11 +24,6 @@ final class PHUIObjectItemListView extends AphrontTagView { return $this; } - public function setPlain($plain) { - $this->plain = $plain; - return $this; - } - public function setHeader($header) { $this->header = $header; return $this; @@ -52,11 +44,6 @@ final class PHUIObjectItemListView extends AphrontTagView { return $this; } - public function setStackable($stackable) { - $this->stackable = $stackable; - return $this; - } - public function setStates($states) { $this->states = $states; return $this; @@ -70,19 +57,12 @@ final class PHUIObjectItemListView extends AphrontTagView { $classes = array(); $classes[] = 'phui-object-item-list-view'; - if ($this->stackable) { - $classes[] = 'phui-object-list-stackable'; - } if ($this->states) { $classes[] = 'phui-object-list-states'; - $classes[] = 'phui-object-list-stackable'; } if ($this->flush) { $classes[] = 'phui-object-list-flush'; } - if ($this->plain) { - $classes[] = 'phui-object-list-plain'; - } return array( 'class' => $classes, diff --git a/src/view/phui/PHUIObjectItemView.php b/src/view/phui/PHUIObjectItemView.php index cc2753e26c..5d6dc5cae4 100644 --- a/src/view/phui/PHUIObjectItemView.php +++ b/src/view/phui/PHUIObjectItemView.php @@ -11,7 +11,7 @@ final class PHUIObjectItemView extends AphrontTagView { private $barColor; private $object; private $effect; - private $footIcons = array(); + private $statusIcon; private $handleIcons = array(); private $bylines = array(); private $grippable; @@ -212,8 +212,8 @@ final class PHUIObjectItemView extends AphrontTagView { return $this; } - public function addFootIcon($icon, $label = null) { - $this->footIcons[] = array( + public function setStatusIcon($icon, $label = null) { + $this->statusIcon = array( 'icon' => $icon, 'label' => $label, ); @@ -270,10 +270,6 @@ final class PHUIObjectItemView extends AphrontTagView { $item_classes[] = 'phui-object-item-bar-color-'.$this->barColor; } - if ($this->footIcons) { - $item_classes[] = 'phui-object-item-with-foot-icons'; - } - if ($this->actions) { $n = count($this->actions); $item_classes[] = 'phui-object-item-with-actions'; @@ -426,8 +422,9 @@ final class PHUIObjectItemView extends AphrontTagView { if ($this->handleIcons) { $handle_bar = array(); - foreach ($this->handleIcons as $icon) { - $handle_bar[] = $this->renderHandleIcon($icon['icon'], $icon['label']); + foreach ($this->handleIcon as $handleicon) { + $handle_bar[] = + $this->renderHandleIcon($handleicon['icon'], $handleicon['label']); } $icons[] = phutil_tag( 'div', @@ -505,18 +502,10 @@ final class PHUIObjectItemView extends AphrontTagView { $attrs); } - $foot = null; - if ($this->footIcons) { - $foot_bar = array(); - foreach ($this->footIcons as $icon) { - $foot_bar[] = $this->renderFootIcon($icon['icon'], $icon['label']); - } - $foot = phutil_tag( - 'div', - array( - 'class' => 'phui-object-item-foot-icons', - ), - $foot_bar); + $status = null; + if ($this->statusIcon) { + $icon = $this->statusIcon; + $status = $this->renderStatusIcon($icon['icon'], $icon['label']); } $grippable = null; @@ -538,7 +527,6 @@ final class PHUIObjectItemView extends AphrontTagView { $subhead, $attrs, $this->renderChildren(), - $foot, )); $image = null; @@ -579,6 +567,16 @@ final class PHUIObjectItemView extends AphrontTagView { } /* Build a fake table */ + $column0 = null; + if ($status) { + $column0 = phutil_tag( + 'div', + array( + 'class' => 'phui-object-item-col0', + ), + $status); + } + $column1 = phutil_tag( 'div', array( @@ -607,7 +605,13 @@ final class PHUIObjectItemView extends AphrontTagView { array( 'class' => 'phui-object-item-table', ), - phutil_tag_div('phui-object-item-table-row', array($column1, $column2))); + phutil_tag_div( + 'phui-object-item-table-row', + array( + $column0, + $column1, + $column2, + ))); $box = phutil_tag( 'div', @@ -647,23 +651,22 @@ final class PHUIObjectItemView extends AphrontTagView { )); } - private function renderFootIcon($icon, $label) { + private function renderStatusIcon($icon, $label) { + Javelin::initBehavior('phabricator-tooltips'); $icon = id(new PHUIIconView()) ->setIconFont($icon); - $label = phutil_tag( - 'span', - array( - ), - $label); + $options = array( + 'class' => 'phui-object-item-status-icon', + ); - return phutil_tag( - 'span', - array( - 'class' => 'phui-object-item-foot-icon', - ), - array($icon, $label)); + if (strlen($label)) { + $options['sigil'] = 'has-tooltip'; + $options['meta'] = array('tip' => $label); + } + + return javelin_tag('div', $options, $icon); } @@ -680,10 +683,7 @@ final class PHUIObjectItemView extends AphrontTagView { $options['meta'] = array('tip' => $label); } - return javelin_tag( - 'span', - $options, - ''); + return javelin_tag('span', $options, ''); } diff --git a/webroot/rsrc/css/application/maniphest/batch-editor.css b/webroot/rsrc/css/application/maniphest/batch-editor.css index f761cf1aa0..a6a06eb3c2 100644 --- a/webroot/rsrc/css/application/maniphest/batch-editor.css +++ b/webroot/rsrc/css/application/maniphest/batch-editor.css @@ -4,7 +4,7 @@ .maniphest-batch-actions-table { width: 100%; - margin: 1em 0; + margin: 12px 0; } .maniphest-batch-actions-table td { diff --git a/webroot/rsrc/css/application/maniphest/task-summary.css b/webroot/rsrc/css/application/maniphest/task-summary.css index 96f4aa92d1..cf57dd23d6 100644 --- a/webroot/rsrc/css/application/maniphest/task-summary.css +++ b/webroot/rsrc/css/application/maniphest/task-summary.css @@ -2,14 +2,6 @@ * @provides maniphest-task-summary-css */ -.maniphest-task-group + .maniphest-task-group { - padding-top: 24px; -} - -.maniphest-batch-selected td { - background: #fff; -} - .device-phone .maniphest-task-batch, .device-phone .maniphest-task-updated { display: none; @@ -17,8 +9,8 @@ .maniphest-task-group-header { font-size: 16px; - font-weight: bold; - color: {$darkgreytext}; + font-weight: normal; + color: {$darkbluetext}; padding: 0 0 8px 0; } @@ -33,31 +25,12 @@ padding-right: 5px; } -.batch-editor-header { - font-size: 16px; - color: {$darkgreytext}; - padding: 8px 0px; - font-weight: bold; -} - -/* TODO: Implement */ -.device-phone .maniphest-batch-editor { - display: none; -} - -.maniphest-batch-editor { - padding-top: 24px; -} - .maniphest-batch-editor-layout { width: 100%; - border: 1px solid #e7e7e7; - border-bottom: 1px solid {$greyborder}; - background: #fff; } .maniphest-batch-editor-layout td { - padding: 10px 8px; + padding: 12px 4px 8px; white-space: nowrap; } @@ -78,14 +51,6 @@ width: 100%; } -.maniphest-list-container { - padding: 16px; -} - -.device-phone .maniphest-list-container { - padding: 20px 8px; -} - .maniphest-board-link { color: {$bluetext}; } diff --git a/webroot/rsrc/css/phui/phui-header-view.css b/webroot/rsrc/css/phui/phui-header-view.css index a270536711..6eff333476 100644 --- a/webroot/rsrc/css/phui/phui-header-view.css +++ b/webroot/rsrc/css/phui/phui-header-view.css @@ -46,6 +46,12 @@ body .phui-header-shell.phui-bleed-header position: relative; } +.phui-object-box .phui-header-tall h1.phui-header-view, +.phui-document-view .phui-header-tall h1.phui-header-view { + font-size: 18px; + font-weight: 500; +} + .phui-header-view a, .phui-header-view a.simple { color: {$darkbluetext}; diff --git a/webroot/rsrc/css/phui/phui-object-item-list-view.css b/webroot/rsrc/css/phui/phui-object-item-list-view.css index a6251754ef..4cda32a343 100644 --- a/webroot/rsrc/css/phui/phui-object-item-list-view.css +++ b/webroot/rsrc/css/phui/phui-object-item-list-view.css @@ -17,9 +17,10 @@ ul.phui-object-item-list-view { .phui-object-item-list-view.phui-object-list-flush { padding: 0; + margin: 0; } -.phui-object-box .phui-object-list-flush .phui-object-item, +.phui-object-box .phui-object-item-list-view .phui-object-item, .homepage-panel .phui-object-list-flush .phui-object-item { margin: 0; } @@ -62,6 +63,12 @@ ul.phui-object-item-list-view { margin: 0; } +.phui-object-item-status-icon { + font-weight: bold; + padding: 0 8px; + font-size: 16px; +} + .phui-object-item-name { font-weight: bold; padding: 8px 8px 0; @@ -134,6 +141,12 @@ ul.phui-object-item-list-view { display: table-row; } +.phui-object-item-col0 { + width: 24px; + display: table-cell; + vertical-align: middle; +} + .phui-object-item-col1 { display: table-cell; vertical-align: top; @@ -159,12 +172,11 @@ ul.phui-object-item-list-view { .phui-object-item-actions { position: absolute; - right: 0; - top: 0; - bottom: 0; + right: 4px; + top: 4px; + bottom: 4px; vertical-align: middle; text-align: right; - border-left: 1px solid {$lightgreyborder}; } .phui-object-item-actions .phui-list-item-view { @@ -175,11 +187,6 @@ ul.phui-object-item-list-view { position: relative; } -.phui-object-item-actions .phui-list-item-view + -.phui-list-item-view { - border-right: 1px solid #d6d6e9; -} - .phui-object-item-actions .phui-list-item-href { display: inline-block; position: relative; @@ -189,6 +196,7 @@ ul.phui-object-item-list-view { .device-desktop .phui-object-item-actions .phui-list-item-href:hover { background: {$hoverblue}; + border-radius: 3px; } .phui-object-item-actions .phui-list-item-icon { @@ -221,27 +229,21 @@ ul.phui-object-item-list-view { } -/* - Stackable List ------------------------------------------------------------ +/* - Object Box List ----------------------------------------------------------- - Tighter, stacking list. + Tighter, stacking list when inside an Object Box */ -.phui-object-item-list-view.phui-object-list-stackable - .phui-object-item { - margin: -1px 0 0 0; - background: #fff; -} - -.phui-object-box .phui-object-list-stackable { +.phui-object-box .phui-object-item-list-view { padding: 0; } -.phui-object-box .phui-object-list-stackable .phui-object-item { +.phui-object-box .phui-object-item-list-view { border: none; } -.phui-object-box .phui-object-list-stackable .phui-object-item-frame { +.phui-object-box .phui-object-item-frame { border-right: none; } @@ -346,15 +348,66 @@ 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-workboard-view .phui-object-item { + border-left-width: 4px; +} + +.phui-object-item { + border-left-width: 0; +} + +.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. */ -.phui-object-item-disabled { - border-left-color: #d7d7d7; -} .phui-object-item-disabled .phui-object-item-link, .phui-object-item-disabled .phui-object-item-link a { @@ -378,19 +431,19 @@ ul.phui-object-item-icons { */ .phui-object-item.phui-object-item-highlighted { - background: {$lightyellow}; + background: {$sh-yellowbackground}; } .phui-object-item-highlighted .phui-object-item-frame { - border-color: {$yellow}; + border-color: {$sh-yellowborder}; } .phui-object-item-selected { - background: {$lightblue}; + background: {$sh-bluebackground}; } .phui-object-item-selected .phui-object-item-frame { - border-color: {$blue}; + border-color: {$sh-blueborder}; } @@ -495,26 +548,14 @@ ul.phui-object-item-icons { .drag-ghost { position: relative; - border: 1px dashed #fff; - background: rgba(255,255,255,.5); + background: {$lightgreybackground}; margin-bottom: 4px; } -.phui-object-list-stackable .drag-ghost { - background: {$hoverblue}; - margin: 0; - border: none; - border-top: 1px solid {$lightgreyborder} -} - .drag-dragging { position: relative; - opacity: 0.85; -} - -.phui-object-box .phui-object-list-stackable .drag-dragging - .phui-object-item-frame { - border-bottom: 1px solid {$lightgreyborder}; + background: {$sh-bluebackground}; + opacity: 0.9; } .drag-sending { @@ -598,14 +639,14 @@ ul.phui-object-item-icons { } .dashboard-panel .phui-object-item-list-view .phui-object-item, -.phui-object-box .phui-object-item-list-view.phui-object-list-flush { +.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-list-flush .phui-object-item-frame { +.phui-object-box .phui-object-item-list-view .phui-object-item-frame { border: none; border-bottom: 1px solid {$thinblueborder}; }