diff --git a/resources/celerity/map.php b/resources/celerity/map.php index 9e81d207ff..a6524f59a8 100644 --- a/resources/celerity/map.php +++ b/resources/celerity/map.php @@ -7,7 +7,7 @@ return array( 'names' => array( - 'core.pkg.css' => '71e0a12a', + 'core.pkg.css' => '00031c1d', 'core.pkg.js' => 'c7854cc5', 'darkconsole.pkg.js' => 'ca8671ce', 'differential.pkg.css' => '5a65a762', @@ -116,7 +116,7 @@ return array( 'rsrc/css/core/core.css' => 'da26ddb2', 'rsrc/css/core/remarkup.css' => 'ca7f2265', 'rsrc/css/core/syntax.css' => '3c18c1cb', - 'rsrc/css/core/z-index.css' => '1bbbd4f1', + 'rsrc/css/core/z-index.css' => '0fd29d49', 'rsrc/css/diviner/diviner-shared.css' => 'be90f718', 'rsrc/css/layout/phabricator-action-header-view.css' => 'cc654b91', 'rsrc/css/layout/phabricator-action-list-view.css' => '81383e25', @@ -125,7 +125,6 @@ return array( 'rsrc/css/layout/phabricator-hovercard-view.css' => '67c12b16', 'rsrc/css/layout/phabricator-side-menu-view.css' => '503699d0', 'rsrc/css/layout/phabricator-source-code-view.css' => '62a99814', - 'rsrc/css/layout/phabricator-timeline-view.css' => 'f4f846c4', 'rsrc/css/phui/phui-box.css' => '6c21bd6a', 'rsrc/css/phui/phui-button.css' => '8784a966', 'rsrc/css/phui/phui-document.css' => '143b2ac8', @@ -145,6 +144,7 @@ return array( 'rsrc/css/phui/phui-status.css' => '2f562399', 'rsrc/css/phui/phui-tag-view.css' => '295d81c4', 'rsrc/css/phui/phui-text.css' => '23e9b4b7', + 'rsrc/css/phui/phui-timeline-view.css' => '84766e6b', 'rsrc/css/phui/phui-workboard-view.css' => 'bf70dd2e', 'rsrc/css/phui/phui-workpanel-view.css' => '6f8527f6', 'rsrc/css/sprite-actions.css' => '4557baf8', @@ -155,7 +155,7 @@ return array( 'rsrc/css/sprite-conpherence.css' => '084b1f13', 'rsrc/css/sprite-docs.css' => '7ea4927e', 'rsrc/css/sprite-gradient.css' => 'a10def53', - 'rsrc/css/sprite-icons.css' => 'ce73ef3e', + 'rsrc/css/sprite-icons.css' => 'a92a018c', 'rsrc/css/sprite-login.css' => 'fa00ebdc', 'rsrc/css/sprite-main-header.css' => 'ba949d0d', 'rsrc/css/sprite-menu.css' => '9db4da0b', @@ -313,8 +313,8 @@ return array( 'rsrc/image/sprite-docs-X2.png' => '520858fa', 'rsrc/image/sprite-docs.png' => '4636297f', 'rsrc/image/sprite-gradient.png' => '4ece0b62', - 'rsrc/image/sprite-icons-X2.png' => '2e9bb665', - 'rsrc/image/sprite-icons.png' => 'edbe6b0d', + 'rsrc/image/sprite-icons-X2.png' => '4072ceaf', + 'rsrc/image/sprite-icons.png' => '19d9974a', 'rsrc/image/sprite-login-X2.png' => 'd2132242', 'rsrc/image/sprite-login.png' => '7f878f1d', 'rsrc/image/sprite-main-header.png' => 'bca643fc', @@ -714,7 +714,6 @@ return array( 'phabricator-source-code-view-css' => '62a99814', 'phabricator-standard-page-view' => '517cdfb1', 'phabricator-textareautils' => 'b3ec3cfc', - 'phabricator-timeline-view-css' => 'f4f846c4', 'phabricator-tooltip' => '0a81ea29', 'phabricator-transaction-view-css' => 'ce491938', 'phabricator-ui-example-css' => '4741b891', @@ -728,7 +727,7 @@ return array( 'phabricator-uiexample-reactor-select' => '189e4fe3', 'phabricator-uiexample-reactor-sendclass' => 'bf97561d', 'phabricator-uiexample-reactor-sendproperties' => '551add57', - 'phabricator-zindex-css' => '1bbbd4f1', + 'phabricator-zindex-css' => '0fd29d49', 'phame-css' => '450826e1', 'pholio-css' => 'd23ace50', 'pholio-edit-css' => 'b9e59b6d', @@ -756,6 +755,7 @@ return array( 'phui-status-list-view-css' => '2f562399', 'phui-tag-view-css' => '295d81c4', 'phui-text-css' => '23e9b4b7', + 'phui-timeline-view-css' => '84766e6b', 'phui-workboard-view-css' => 'bf70dd2e', 'phui-workpanel-view-css' => '6f8527f6', 'policy-css' => '957ea14c', @@ -785,7 +785,7 @@ return array( 'sprite-conpherence-css' => '084b1f13', 'sprite-docs-css' => '7ea4927e', 'sprite-gradient-css' => 'a10def53', - 'sprite-icons-css' => 'ce73ef3e', + 'sprite-icons-css' => 'a92a018c', 'sprite-login-css' => 'fa00ebdc', 'sprite-main-header-css' => 'ba949d0d', 'sprite-menu-css' => '9db4da0b', diff --git a/resources/sprite/icons_2x/check.png b/resources/sprite/icons_2x/check.png index 9d8752f444..bcab5f2a1b 100644 Binary files a/resources/sprite/icons_2x/check.png and b/resources/sprite/icons_2x/check.png differ diff --git a/resources/sprite/icons_2x/create.png b/resources/sprite/icons_2x/create.png index d25b869234..6ffc3fa6ef 100644 Binary files a/resources/sprite/icons_2x/create.png and b/resources/sprite/icons_2x/create.png differ diff --git a/resources/sprite/icons_grey_2x/check.png b/resources/sprite/icons_grey_2x/check.png index 61ecca4662..0488b86d1d 100644 Binary files a/resources/sprite/icons_grey_2x/check.png and b/resources/sprite/icons_grey_2x/check.png differ diff --git a/resources/sprite/icons_grey_2x/create.png b/resources/sprite/icons_grey_2x/create.png index e14c6007aa..9f52b70f59 100644 Binary files a/resources/sprite/icons_grey_2x/create.png and b/resources/sprite/icons_grey_2x/create.png differ diff --git a/resources/sprite/icons_white_2x/check.png b/resources/sprite/icons_white_2x/check.png index 1c43c79867..bf1347785f 100644 Binary files a/resources/sprite/icons_white_2x/check.png and b/resources/sprite/icons_white_2x/check.png differ diff --git a/resources/sprite/icons_white_2x/create.png b/resources/sprite/icons_white_2x/create.png index 414d093b54..82db2e1cd2 100644 Binary files a/resources/sprite/icons_white_2x/create.png and b/resources/sprite/icons_white_2x/create.png differ diff --git a/resources/sprite/manifest/icons.json b/resources/sprite/manifest/icons.json index c405eec7aa..c42915b350 100644 --- a/resources/sprite/manifest/icons.json +++ b/resources/sprite/manifest/icons.json @@ -109,17 +109,17 @@ "icons-check" : { "name" : "icons-check", "rule" : ".icons-check", - "hash" : "b03d6fa96c04b167c63caee7044458c1" + "hash" : "7701c38eecdd9773b84323a617d33575" }, "icons-check-grey" : { "name" : "icons-check-grey", "rule" : ".icons-check-grey", - "hash" : "78c47d2a98af61cd3cf7cad4135a7a65" + "hash" : "f2c970a7f729f56277eadb1ab3f140da" }, "icons-check-white" : { "name" : "icons-check-white", "rule" : ".icons-check-white, .device-desktop .phabricator-action-view:hover .icons-check, .device-desktop .phui-list-sidenav .phui-list-item-href:hover .icons-check", - "hash" : "1f8c0e0638b6366a5b35244768098749" + "hash" : "ed946142aa107d1a21d72519172f6cad" }, "icons-comment" : { "name" : "icons-comment", @@ -154,17 +154,17 @@ "icons-create" : { "name" : "icons-create", "rule" : ".icons-create", - "hash" : "d5263d054d6a0b4e1507dcb4722744ad" + "hash" : "6ba3bec5c18c5de1f1795ff63ac880f6" }, "icons-create-grey" : { "name" : "icons-create-grey", "rule" : ".icons-create-grey", - "hash" : "701c5f704f426728a6e9a21d93ec480c" + "hash" : "f81118913df8d426c8a2889d909d0168" }, "icons-create-white" : { "name" : "icons-create-white", "rule" : ".icons-create-white, .device-desktop .phabricator-action-view:hover .icons-create, .device-desktop .phui-list-sidenav .phui-list-item-href:hover .icons-create", - "hash" : "3b2d0928b2c867a65b95d12177ad8705" + "hash" : "fbb29390e3f8bd5a6e0d809463aeeb40" }, "icons-data" : { "name" : "icons-data", diff --git a/src/__phutil_library_map__.php b/src/__phutil_library_map__.php index 7be30d9b9d..8239644aa4 100644 --- a/src/__phutil_library_map__.php +++ b/src/__phutil_library_map__.php @@ -1020,6 +1020,9 @@ phutil_register_library_map(array( 'PHUITagView' => 'view/phui/PHUITagView.php', 'PHUITextExample' => 'applications/uiexample/examples/PHUITextExample.php', 'PHUITextView' => 'view/phui/PHUITextView.php', + 'PHUITimelineEventView' => 'view/phui/PHUITimelineEventView.php', + 'PHUITimelineExample' => 'applications/uiexample/examples/PHUITimelineExample.php', + 'PHUITimelineView' => 'view/phui/PHUITimelineView.php', 'PHUIWorkboardExample' => 'applications/uiexample/examples/PHUIWorkboardExample.php', 'PHUIWorkboardView' => 'view/phui/PHUIWorkboardView.php', 'PHUIWorkpanelView' => 'view/phui/PHUIWorkpanelView.php', @@ -2092,9 +2095,6 @@ phutil_register_library_map(array( 'PhabricatorTime' => 'infrastructure/time/PhabricatorTime.php', 'PhabricatorTimeGuard' => 'infrastructure/time/PhabricatorTimeGuard.php', 'PhabricatorTimeTestCase' => 'infrastructure/time/__tests__/PhabricatorTimeTestCase.php', - 'PhabricatorTimelineEventView' => 'view/layout/PhabricatorTimelineEventView.php', - 'PhabricatorTimelineExample' => 'applications/uiexample/examples/PhabricatorTimelineExample.php', - 'PhabricatorTimelineView' => 'view/layout/PhabricatorTimelineView.php', 'PhabricatorToken' => 'applications/tokens/storage/PhabricatorToken.php', 'PhabricatorTokenController' => 'applications/tokens/controller/PhabricatorTokenController.php', 'PhabricatorTokenCount' => 'applications/tokens/storage/PhabricatorTokenCount.php', @@ -3649,6 +3649,9 @@ phutil_register_library_map(array( 'PHUITagView' => 'AphrontView', 'PHUITextExample' => 'PhabricatorUIExample', 'PHUITextView' => 'AphrontTagView', + 'PHUITimelineEventView' => 'AphrontView', + 'PHUITimelineExample' => 'PhabricatorUIExample', + 'PHUITimelineView' => 'AphrontView', 'PHUIWorkboardExample' => 'PhabricatorUIExample', 'PHUIWorkboardView' => 'AphrontTagView', 'PHUIWorkpanelView' => 'AphrontTagView', @@ -4867,9 +4870,6 @@ phutil_register_library_map(array( 'PhabricatorTestStorageEngine' => 'PhabricatorFileStorageEngine', 'PhabricatorTestWorker' => 'PhabricatorWorker', 'PhabricatorTimeTestCase' => 'PhabricatorTestCase', - 'PhabricatorTimelineEventView' => 'AphrontView', - 'PhabricatorTimelineExample' => 'PhabricatorUIExample', - 'PhabricatorTimelineView' => 'AphrontView', 'PhabricatorToken' => array( 0 => 'PhabricatorTokenDAO', diff --git a/src/applications/transactions/response/PhabricatorApplicationTransactionResponse.php b/src/applications/transactions/response/PhabricatorApplicationTransactionResponse.php index 08edaf4425..b8c28d7c0c 100644 --- a/src/applications/transactions/response/PhabricatorApplicationTransactionResponse.php +++ b/src/applications/transactions/response/PhabricatorApplicationTransactionResponse.php @@ -78,7 +78,7 @@ final class PhabricatorApplicationTransactionResponse $content = array( 'xactions' => $xactions, - 'spacer' => PhabricatorTimelineView::renderSpacer(), + 'spacer' => PHUITimelineView::renderSpacer(), ); return $this->getProxy()->setContent($content); diff --git a/src/applications/transactions/view/PhabricatorApplicationTransactionCommentView.php b/src/applications/transactions/view/PhabricatorApplicationTransactionCommentView.php index 463347d215..3c35d017b3 100644 --- a/src/applications/transactions/view/PhabricatorApplicationTransactionCommentView.php +++ b/src/applications/transactions/view/PhabricatorApplicationTransactionCommentView.php @@ -181,7 +181,7 @@ class PhabricatorApplicationTransactionCommentView extends AphrontView { private function renderPreviewPanel() { - $preview = id(new PhabricatorTimelineView()) + $preview = id(new PHUITimelineView()) ->setID($this->getPreviewTimelineID()); return phutil_tag( diff --git a/src/applications/transactions/view/PhabricatorApplicationTransactionView.php b/src/applications/transactions/view/PhabricatorApplicationTransactionView.php index aa1d856c12..01f60ef4aa 100644 --- a/src/applications/transactions/view/PhabricatorApplicationTransactionView.php +++ b/src/applications/transactions/view/PhabricatorApplicationTransactionView.php @@ -91,7 +91,7 @@ class PhabricatorApplicationTransactionView extends AphrontView { throw new Exception("Call setObjectPHID() before render()!"); } - $view = new PhabricatorTimelineView(); + $view = new PHUITimelineView(); $events = $this->buildEvents(); foreach ($events as $event) { $view->addEvent($event); @@ -176,7 +176,7 @@ class PhabricatorApplicationTransactionView extends AphrontView { 'div', array( 'id' => $content_id, - 'class' => 'phabricator-timeline-change-details', + 'class' => 'phui-timeline-change-details', ), $xaction->renderChangeDetails($this->getUser())); @@ -293,7 +293,7 @@ class PhabricatorApplicationTransactionView extends AphrontView { $anchor) { $viewer = $this->getUser(); - $event = id(new PhabricatorTimelineEventView()) + $event = id(new PHUITimelineEventView()) ->setUser($viewer) ->setTransactionPHID($xaction->getPHID()) ->setUserHandle($xaction->getHandle($xaction->getAuthorPHID())) diff --git a/src/applications/uiexample/examples/PhabricatorTimelineExample.php b/src/applications/uiexample/examples/PHUITimelineExample.php similarity index 76% rename from src/applications/uiexample/examples/PhabricatorTimelineExample.php rename to src/applications/uiexample/examples/PHUITimelineExample.php index a3bca00de7..d5969eaeaf 100644 --- a/src/applications/uiexample/examples/PhabricatorTimelineExample.php +++ b/src/applications/uiexample/examples/PHUITimelineExample.php @@ -1,6 +1,6 @@ PhabricatorTimelineView to comments and transactions.'); + 'Use PHUITimelineView to comments and transactions.'); } public function renderExample() { @@ -22,64 +22,64 @@ final class PhabricatorTimelineExample extends PhabricatorUIExample { $events = array(); - $events[] = id(new PhabricatorTimelineEventView()) + $events[] = id(new PHUITimelineEventView()) ->setUserHandle($handle) ->setTitle('A major event.') ->appendChild('This is a major timeline event.'); - $events[] = id(new PhabricatorTimelineEventView()) + $events[] = id(new PHUITimelineEventView()) ->setUserHandle($handle) ->setTitle('A minor event.'); - $events[] = id(new PhabricatorTimelineEventView()) + $events[] = id(new PHUITimelineEventView()) ->setUserHandle($handle) ->appendChild('A major event with no title.'); - $events[] = id(new PhabricatorTimelineEventView()) + $events[] = id(new PHUITimelineEventView()) ->setUserHandle($handle) ->setTitle('Another minor event.'); - $events[] = id(new PhabricatorTimelineEventView()) + $events[] = id(new PHUITimelineEventView()) ->setUserHandle($handle); - $events[] = id(new PhabricatorTimelineEventView()) + $events[] = id(new PHUITimelineEventView()) ->setUserHandle($handle) ->setTitle('Major Red Event') ->setIcon('love') ->appendChild('This event is red!') ->setColor(PhabricatorTransactions::COLOR_RED); - $events[] = id(new PhabricatorTimelineEventView()) + $events[] = id(new PHUITimelineEventView()) ->setUserHandle($handle) ->setTitle('Minor Red Event') ->setColor(PhabricatorTransactions::COLOR_RED); - $events[] = id(new PhabricatorTimelineEventView()) + $events[] = id(new PHUITimelineEventView()) ->setUserHandle($handle) ->setTitle('Minor Not-Red Event'); - $events[] = id(new PhabricatorTimelineEventView()) + $events[] = id(new PHUITimelineEventView()) ->setUserHandle($handle) ->setTitle('Minor Red Event') ->setColor(PhabricatorTransactions::COLOR_RED); - $events[] = id(new PhabricatorTimelineEventView()) + $events[] = id(new PHUITimelineEventView()) ->setUserHandle($handle) ->setTitle('Minor Not-Red Event'); - $events[] = id(new PhabricatorTimelineEventView()) + $events[] = id(new PHUITimelineEventView()) ->setUserHandle($handle) ->setTitle('Major Green Event') ->appendChild('This event is green!') ->setColor(PhabricatorTransactions::COLOR_GREEN); - $events[] = id(new PhabricatorTimelineEventView()) + $events[] = id(new PHUITimelineEventView()) ->setUserHandle($handle) ->setTitle(str_repeat('Long Text Title ', 64)) ->appendChild(str_repeat('Long Text Body ', 64)) ->setColor(PhabricatorTransactions::COLOR_ORANGE); - $events[] = id(new PhabricatorTimelineEventView()) + $events[] = id(new PHUITimelineEventView()) ->setUserHandle($handle) ->setTitle(str_repeat('LongTextEventNoSpaces', 1024)) ->appendChild(str_repeat('LongTextNoSpaces', 1024)) @@ -98,13 +98,13 @@ final class PhabricatorTimelineExample extends PhabricatorUIExample { PhabricatorTransactions::COLOR_BLACK, ); - $events[] = id(new PhabricatorTimelineEventView()) + $events[] = id(new PHUITimelineEventView()) ->setUserHandle($handle) ->setTitle("Colorless") ->setIcon('lock'); foreach ($colors as $color) { - $events[] = id(new PhabricatorTimelineEventView()) + $events[] = id(new PHUITimelineEventView()) ->setUserHandle($handle) ->setTitle("Color '{$color}'") ->setIcon('lock') @@ -113,45 +113,45 @@ final class PhabricatorTimelineExample extends PhabricatorUIExample { $vhandle = $handle->renderLink(); - $group_event = id(new PhabricatorTimelineEventView()) + $group_event = id(new PHUITimelineEventView()) ->setUserHandle($handle) ->setTitle(pht('%s went to the store.', $vhandle)); $group_event->addEventToGroup( - id(new PhabricatorTimelineEventView()) + id(new PHUITimelineEventView()) ->setUserHandle($handle) ->setTitle(pht('%s bought an apple.', $vhandle)) ->setColor('green') ->setIcon('check')); $group_event->addEventToGroup( - id(new PhabricatorTimelineEventView()) + id(new PHUITimelineEventView()) ->setUserHandle($handle) ->setTitle(pht('%s bought a banana.', $vhandle)) ->setColor('yellow') ->setIcon('check')); $group_event->addEventToGroup( - id(new PhabricatorTimelineEventView()) + id(new PHUITimelineEventView()) ->setUserHandle($handle) ->setTitle(pht('%s bought a cherry.', $vhandle)) ->setColor('red') ->setIcon('check')); $group_event->addEventToGroup( - id(new PhabricatorTimelineEventView()) + id(new PHUITimelineEventView()) ->setUserHandle($handle) ->setTitle(pht('%s paid for his goods.', $vhandle))); $group_event->addEventToGroup( - id(new PhabricatorTimelineEventView()) + id(new PHUITimelineEventView()) ->setUserHandle($handle) ->setTitle(pht('%s returned home.', $vhandle)) ->setIcon('home') ->setColor('blue')); $group_event->addEventToGroup( - id(new PhabricatorTimelineEventView()) + id(new PHUITimelineEventView()) ->setUserHandle($handle) ->setTitle(pht('%s related on his adventures.', $vhandle)) ->appendChild( @@ -171,7 +171,7 @@ final class PhabricatorTimelineExample extends PhabricatorUIExample { } } - $timeline = id(new PhabricatorTimelineView()); + $timeline = id(new PHUITimelineView()); foreach ($events as $event) { $timeline->addEvent($event); } diff --git a/src/view/layout/PhabricatorTimelineEventView.php b/src/view/phui/PHUITimelineEventView.php similarity index 87% rename from src/view/layout/PhabricatorTimelineEventView.php rename to src/view/phui/PHUITimelineEventView.php index 54f226dbbb..5e86d5f9d4 100644 --- a/src/view/layout/PhabricatorTimelineEventView.php +++ b/src/view/phui/PHUITimelineEventView.php @@ -1,6 +1,6 @@ eventGroup); } - public function addEventToGroup(PhabricatorTimelineEventView $event) { + public function addEventToGroup(PHUITimelineEventView $event) { $this->eventGroup[] = $event; return $this; } @@ -127,7 +127,7 @@ final class PhabricatorTimelineEventView extends AphrontView { $extra = phutil_tag( 'span', array( - 'class' => 'phabricator-timeline-extra', + 'class' => 'phui-timeline-extra', ), phutil_implode_html(" \xC2\xB7 ", $extra)); } else { @@ -136,18 +136,18 @@ final class PhabricatorTimelineEventView extends AphrontView { if ($title !== null || $extra) { $title_classes = array(); - $title_classes[] = 'phabricator-timeline-title'; + $title_classes[] = 'phui-timeline-title'; $icon = null; if ($this->icon || $force_icon) { - $title_classes[] = 'phabricator-timeline-title-with-icon'; + $title_classes[] = 'phui-timeline-title-with-icon'; } if ($this->icon) { $fill_classes = array(); - $fill_classes[] = 'phabricator-timeline-icon-fill'; + $fill_classes[] = 'phui-timeline-icon-fill'; if ($this->color) { - $fill_classes[] = 'phabricator-timeline-icon-fill-'.$this->color; + $fill_classes[] = 'phui-timeline-icon-fill-'.$this->color; } $icon = phutil_tag( @@ -158,7 +158,7 @@ final class PhabricatorTimelineEventView extends AphrontView { phutil_tag( 'span', array( - 'class' => 'phabricator-timeline-icon sprite-icons '. + 'class' => 'phui-timeline-icon sprite-icons '. 'icons-'.$this->icon.'-white', ), '')); @@ -203,7 +203,7 @@ final class PhabricatorTimelineEventView extends AphrontView { $wedge = phutil_tag( 'div', array( - 'class' => 'phabricator-timeline-wedge phabricator-timeline-border', + 'class' => 'phui-timeline-wedge phui-timeline-border', ), ''); @@ -212,40 +212,40 @@ final class PhabricatorTimelineEventView extends AphrontView { 'div', array( 'style' => 'background-image: url('.$image_uri.')', - 'class' => 'phabricator-timeline-image', + 'class' => 'phui-timeline-image', ), ''); $content_classes = array(); - $content_classes[] = 'phabricator-timeline-content'; + $content_classes[] = 'phui-timeline-content'; $classes = array(); - $classes[] = 'phabricator-timeline-event-view'; + $classes[] = 'phui-timeline-event-view'; if ($group_children) { - $classes[] = 'phabricator-timeline-major-event'; + $classes[] = 'phui-timeline-major-event'; $content = phutil_tag( 'div', array( - 'class' => 'phabricator-timeline-inner-content', + 'class' => 'phui-timeline-inner-content', ), array( $group_titles, phutil_tag( 'div', array( - 'class' => 'phabricator-timeline-core-content', + 'class' => 'phui-timeline-core-content', ), $group_children), )); } else { - $classes[] = 'phabricator-timeline-minor-event'; + $classes[] = 'phui-timeline-minor-event'; $content = $group_titles; } $content = phutil_tag( 'div', array( - 'class' => 'phabricator-timeline-group phabricator-timeline-border', + 'class' => 'phui-timeline-group phui-timeline-border', ), $content); @@ -257,7 +257,7 @@ final class PhabricatorTimelineEventView extends AphrontView { array($image, $wedge, $content)); $outer_classes = $this->classes; - $outer_classes[] = 'phabricator-timeline-shell'; + $outer_classes[] = 'phui-timeline-shell'; $color = null; foreach ($this->getEventGroup() as $event) { if ($event->color) { @@ -267,7 +267,7 @@ final class PhabricatorTimelineEventView extends AphrontView { } if ($color) { - $outer_classes[] = 'phabricator-timeline-'.$color; + $outer_classes[] = 'phui-timeline-'.$color; } $sigil = null; diff --git a/src/view/layout/PhabricatorTimelineView.php b/src/view/phui/PHUITimelineView.php similarity index 64% rename from src/view/layout/PhabricatorTimelineView.php rename to src/view/phui/PHUITimelineView.php index cdd93134b2..b690a19ae6 100644 --- a/src/view/layout/PhabricatorTimelineView.php +++ b/src/view/phui/PHUITimelineView.php @@ -1,6 +1,6 @@ events[] = $event; return $this; } public function render() { - require_celerity_resource('phabricator-timeline-view-css'); + require_celerity_resource('phui-timeline-view-css'); $spacer = self::renderSpacer(); @@ -30,7 +30,7 @@ final class PhabricatorTimelineView extends AphrontView { return phutil_tag( 'div', array( - 'class' => 'phabricator-timeline-view', + 'class' => 'phui-timeline-view', 'id' => $this->id, ), $events); @@ -40,8 +40,8 @@ final class PhabricatorTimelineView extends AphrontView { return phutil_tag( 'div', array( - 'class' => 'phabricator-timeline-event-view '. - 'phabricator-timeline-spacer', + 'class' => 'phui-timeline-event-view '. + 'phui-timeline-spacer', ), ''); } diff --git a/webroot/rsrc/css/core/z-index.css b/webroot/rsrc/css/core/z-index.css index 4b7ddd8cb1..a67ffd30f4 100644 --- a/webroot/rsrc/css/core/z-index.css +++ b/webroot/rsrc/css/core/z-index.css @@ -6,7 +6,7 @@ z-index: 1; } -.device-desktop .phabricator-timeline-minor-event .phabricator-timeline-image { +.device-desktop .phui-timeline-minor-event .phui-timeline-image { z-index: 2; } @@ -30,7 +30,7 @@ z-index: 3; } -.phabricator-timeline-icon-fill { +.phui-timeline-icon-fill { z-index: 3; } diff --git a/webroot/rsrc/css/layout/phabricator-timeline-view.css b/webroot/rsrc/css/layout/phabricator-timeline-view.css deleted file mode 100644 index d2e831737b..0000000000 --- a/webroot/rsrc/css/layout/phabricator-timeline-view.css +++ /dev/null @@ -1,259 +0,0 @@ -/** - * @provides phabricator-timeline-view-css - */ - -.phabricator-timeline-view { - padding: 0 16px; -} - -.device-phone .phabricator-timeline-view { - padding: 0; -} - -.phabricator-timeline-group { - border-width: 0 3px; - border-style: solid; - border-color: #c0c5d1; -} - -.device-desktop .phabricator-timeline-event-view { - margin-left: 70px; - position: relative; -} - -.device-desktop .phabricator-timeline-spacer { - min-height: 20px; - border-width: 0 0 0 3px; - border-style: solid; - border-color: #c0c5d1; -} - -.device-desktop .phabricator-timeline-major-event, -.device-desktop .phabricator-timeline-minor-event { - border-right-width: 3px; -} - -.device-desktop .phabricator-timeline-wedge { - border-bottom: 3px solid #c0c5d1; - position: absolute; - width: 20px; -} - -.phabricator-timeline-content { - background: #ffffff; - border-style: solid; - border-color: #c0c5d1; - border-width: 1px 0; -} - -.phabricator-timeline-title { - line-height: 18px; - min-height: 18px; - position: relative; -} - -.phabricator-timeline-title a { - font-weight: bold; -} - -.device-desktop .phabricator-timeline-wedge { - left: -20px; -} -.device-desktop .phabricator-timeline-major-event .phabricator-timeline-wedge { - top: 24px; -} - -.device-desktop .phabricator-timeline-minor-event .phabricator-timeline-wedge { - top: 12px; -} - -.phabricator-timeline-image { - background-repeat: no-repeat; - position: absolute; -} - -.device-desktop .phabricator-timeline-major-event .phabricator-timeline-image { - width: 50px; - height: 50px; - top: 0px; - left: -70px; -} - -.device-desktop .phabricator-timeline-minor-event .phabricator-timeline-image { - width: 30px; - height: 30px; - background-size: 30px auto; - left: -45px; -} - -.phabricator-timeline-major-event .phabricator-timeline-title { - background: {$lightgreybackground}; - min-height: 18px; -} - -.phabricator-timeline-title { - padding: 5px; - overflow-x: auto; - overflow-y: hidden; -} - -.phabricator-timeline-title-with-icon { - padding-left: 33px; -} - -.phabricator-timeline-major-event .phabricator-timeline-content - .phabricator-timeline-core-content { - padding: 12px; -} - -.phabricator-timeline-core-content { - overflow-x: auto; -} - -.device .phabricator-timeline-event-view { - min-height: 23px; - position: relative; - margin-left: 3px; - margin-right: 3px; -} - -.device .phabricator-timeline-image { - display: none; -} - -.device .phabricator-timeline-spacer { - min-height: 8px; - border-width: 0; -} - -.phabricator-timeline-icon-fill { - position: absolute; - width: 30px; - height: 30px; - background-color: #c0c5d1; - top: -1px; - left: -3px; -} - -.phabricator-timeline-icon { - position: absolute; - left: 9px; - top: 8px; - height: 14px; - width: 14px; -} - -.phabricator-timeline-extra, .phabricator-timeline-extra a { - font-size: 11px; - font-weight: normal; - color: {$lightgreytext}; -} - -.device-desktop .phabricator-timeline-extra { - float: right; -} - -.device .phabricator-timeline-extra { - display: inline-block; - line-height: 16px; - margin-left: 8px; -} - -.phabricator-timeline-red .phabricator-timeline-border { - border-color: {$red}; -} - -.phabricator-timeline-orange .phabricator-timeline-border { - border-color: {$orange}; -} - -.phabricator-timeline-yellow .phabricator-timeline-border { - border-color: {$yellow}; -} - -.phabricator-timeline-green .phabricator-timeline-border { - border-color: {$green}; -} - -.phabricator-timeline-sky .phabricator-timeline-border { - border-color: {$sky}; -} - -.phabricator-timeline-blue .phabricator-timeline-border { - border-color: {$blue}; -} - -.phabricator-timeline-indigo .phabricator-timeline-border { - border-color: {$indigo}; -} - -.phabricator-timeline-violet .phabricator-timeline-border { - border-color: {$violet}; -} - -.phabricator-timeline-grey .phabricator-timeline-border { - border-color: #888; -} - -.phabricator-timeline-black .phabricator-timeline-border { - border-color: #333; -} - -.phabricator-timeline-icon-fill-red { - background-color: {$red}; -} - -.phabricator-timeline-icon-fill-orange { - background-color: {$orange}; -} - -.phabricator-timeline-icon-fill-yellow { - background-color: {$yellow}; -} - -.phabricator-timeline-icon-fill-green { - background-color: {$green}; -} - -.phabricator-timeline-icon-fill-sky { - background-color: {$sky}; -} - -.phabricator-timeline-icon-fill-blue { - background-color: {$blue}; -} - -.phabricator-timeline-icon-fill-indigo { - background-color: {$indigo}; -} - -.phabricator-timeline-icon-fill-violet { - background-color: {$violet}; -} - -.phabricator-timeline-icon-fill-grey { - background-color: #888; -} - -.phabricator-timeline-icon-fill-black { - background-color: #333; -} - -.phabricator-timeline-shell.anchor-target { - background: rgba(255, 255, 0, 0.50); - box-shadow: 0 0 3px 6px rgba(255, 255, 0, 0.50); -} - -.phabricator-timeline-preview-header { - background: #e0e3ec; - color: {$darkgreytext}; - padding: 4px 1.25%; - border: solid #c0c5d1 1px 0; -} - -.phabricator-timeline-change-details { - padding: 10px 0; - border-style: solid; - border-color: #efefef; - border-width: 1px 0; -} diff --git a/webroot/rsrc/css/phui/phui-timeline-view.css b/webroot/rsrc/css/phui/phui-timeline-view.css new file mode 100644 index 0000000000..44193121ec --- /dev/null +++ b/webroot/rsrc/css/phui/phui-timeline-view.css @@ -0,0 +1,243 @@ +/** + * @provides phui-timeline-view-css + */ + +.phui-timeline-view { + padding: 0 16px; +} + +.phui-timeline-major-event .phui-timeline-group { + border-left: 1px solid {$lightblueborder}; + border-right: 1px solid {$lightblueborder}; +} + +.device-desktop .phui-timeline-event-view { + margin-left: 62px; + position: relative; +} + +.device-desktop .phui-timeline-event-view.phui-timeline-minor-event { + margin-left: 65px; +} + +.device-desktop .phui-timeline-spacer { + min-height: 16px; + border-width: 0 0 0 1px; + border-style: solid; + border-color: {$lightblueborder}; + margin-left: 78px; +} + +.device-desktop .phui-timeline-wedge { + border-bottom: 1px solid {$lightblueborder}; + position: absolute; + width: 12px; +} + +.phui-timeline-major-event .phui-timeline-content { + border-top: 1px solid {$lightblueborder}; + border-bottom: 1px solid {$lightblueborder}; +} + +.phui-timeline-title { + line-height: 18px; + min-height: 18px; + position: relative; + color: {$darkbluetext}; +} + +.phui-timeline-minor-event .phui-timeline-title { + padding: 4px 8px 4px 33px; + color: {$bluetext}; +} + +.phui-timeline-title a { + font-weight: bold; +} + +.phui-timeline-title a.phui-link-person { + color: {$darkbluetext}; +} + +.device-desktop .phui-timeline-wedge { + left: -12px; +} + +.device-desktop .phui-timeline-major-event .phui-timeline-wedge { + top: 24px; +} + +.device-desktop .phui-timeline-minor-event .phui-timeline-wedge { + top: 12px; + left: -18px; + width: 20px; +} + +.phui-timeline-image { + background-repeat: no-repeat; + position: absolute; + border-radius: 3px; +} + +.device-desktop .phui-timeline-major-event .phui-timeline-image { + width: 50px; + height: 50px; + top: 0px; + left: -62px; +} + +.device-desktop .phui-timeline-minor-event .phui-timeline-image { + width: 26px; + height: 26px; + background-size: 26px auto; + left: -41px; +} + +.phui-timeline-major-event .phui-timeline-title { + background: {$lightgreybackground}; + min-height: 18px; +} + +.phui-timeline-title { + padding: 5px 8px; + overflow-x: auto; + overflow-y: hidden; +} + +.phui-timeline-title-with-icon { + padding-left: 38px; +} + +.phui-timeline-major-event .phui-timeline-content + .phui-timeline-core-content { + padding: 16px 12px; + line-height: 18px; + background: #fff; +} + +.phui-timeline-core-content { + overflow-x: auto; +} + +.device .phui-timeline-event-view { + min-height: 23px; + position: relative; + margin-left: 3px; + margin-right: 3px; +} + +.device .phui-timeline-image { + display: none; +} + +.device .phui-timeline-spacer { + min-height: 8px; + border-width: 0; +} + +.phui-timeline-icon-fill { + position: absolute; + width: 30px; + height: 30px; + background-color: {$lightblueborder}; + top: 0; + left: 0; +} + +.phui-timeline-icon { + position: absolute; + left: 8px; + top: 8px; + height: 14px; + width: 14px; +} + +.phui-timeline-minor-event .phui-timeline-icon-fill { + height: 26px; + width: 26px; + border-radius: 3px; +} + +.phui-timeline-minor-event .phui-timeline-icon { + top: 6px; + left: 6px; +} + +.phui-timeline-extra, .phui-timeline-extra a { + font-size: 11px; + font-weight: normal; +} + +.device-desktop .phui-timeline-extra { + float: right; +} + +.device .phui-timeline-extra { + display: inline-block; + line-height: 16px; + margin-left: 8px; +} + +.phui-timeline-icon-fill-red { + background-color: {$red}; +} + +.phui-timeline-icon-fill-orange { + background-color: {$orange}; +} + +.phui-timeline-icon-fill-yellow { + background-color: {$yellow}; +} + +.phui-timeline-icon-fill-green { + background-color: {$green}; +} + +.phui-timeline-icon-fill-sky { + background-color: {$sky}; +} + +.phui-timeline-icon-fill-blue { + background-color: {$blue}; +} + +.phui-timeline-icon-fill-indigo { + background-color: {$indigo}; +} + +.phui-timeline-icon-fill-violet { + background-color: {$violet}; +} + +.phui-timeline-icon-fill-grey { + background-color: #888; +} + +.phui-timeline-icon-fill-black { + background-color: #333; +} + +.phui-timeline-shell.anchor-target { + background: rgba(255, 255, 0, 0.50); + box-shadow: 0 0 3px 6px rgba(255, 255, 0, 0.50); +} + +.phui-timeline-preview-header { + background: #e0e3ec; + color: {$darkgreytext}; + padding: 4px 1.25%; + border: solid {$blueborder} 1px 0; +} + +.phui-timeline-change-details { + padding: 10px 0; + border-style: solid; + border-color: #efefef; + border-width: 1px 0; +} + +.phui-timeline-extra .phabricator-content-source-view, +.phui-timeline-extra a { + color: {$lightbluetext}; +} diff --git a/webroot/rsrc/image/sprite-icons-X2.png b/webroot/rsrc/image/sprite-icons-X2.png index 91be5be190..1574ec9f68 100644 Binary files a/webroot/rsrc/image/sprite-icons-X2.png and b/webroot/rsrc/image/sprite-icons-X2.png differ diff --git a/webroot/rsrc/image/sprite-icons.png b/webroot/rsrc/image/sprite-icons.png index fde10a28b2..7bb53400b0 100644 Binary files a/webroot/rsrc/image/sprite-icons.png and b/webroot/rsrc/image/sprite-icons.png differ