From 85424e747268fd1f667e2afeb1ed644cf1c5e7a8 Mon Sep 17 00:00:00 2001 From: Chad Little Date: Fri, 13 Sep 2013 10:48:02 -0700 Subject: [PATCH] Small button dropdowns Summary: Adds the small caret to differential. Cleans up dropdown frame. Test Plan: Test caret in differential. Reviewers: epriestley, btrahan Reviewed By: epriestley CC: Korvin, aran Differential Revision: https://secure.phabricator.com/D6983 --- src/__celerity_resource_map__.php | 88 +++++++++---------- .../view/DifferentialChangesetListView.php | 5 +- webroot/rsrc/css/phui/phui-button.css | 10 ++- 3 files changed, 54 insertions(+), 49 deletions(-) diff --git a/src/__celerity_resource_map__.php b/src/__celerity_resource_map__.php index 6f45fd6ea2..cb9b7f4b92 100644 --- a/src/__celerity_resource_map__.php +++ b/src/__celerity_resource_map__.php @@ -3738,7 +3738,7 @@ celerity_register_resource_map(array( ), 'phui-button-css' => array( - 'uri' => '/res/bed5fc2c/rsrc/css/phui/phui-button.css', + 'uri' => '/res/3718b375/rsrc/css/phui/phui-button.css', 'type' => 'css', 'requires' => array( @@ -4171,7 +4171,7 @@ celerity_register_resource_map(array( ), array( 'packages' => array( - '1911a285' => + '1200d176' => array( 'name' => 'core.pkg.css', 'symbols' => @@ -4218,7 +4218,7 @@ celerity_register_resource_map(array( 39 => 'phabricator-property-list-view-css', 40 => 'phabricator-tag-view-css', ), - 'uri' => '/res/pkg/1911a285/core.pkg.css', + 'uri' => '/res/pkg/1200d176/core.pkg.css', 'type' => 'css', ), '8977e356' => @@ -4409,15 +4409,15 @@ celerity_register_resource_map(array( ), 'reverse' => array( - 'aphront-dialog-view-css' => '1911a285', - 'aphront-error-view-css' => '1911a285', - 'aphront-list-filter-view-css' => '1911a285', - 'aphront-pager-view-css' => '1911a285', - 'aphront-panel-view-css' => '1911a285', - 'aphront-table-view-css' => '1911a285', - 'aphront-tokenizer-control-css' => '1911a285', - 'aphront-tooltip-css' => '1911a285', - 'aphront-typeahead-control-css' => '1911a285', + 'aphront-dialog-view-css' => '1200d176', + 'aphront-error-view-css' => '1200d176', + 'aphront-list-filter-view-css' => '1200d176', + 'aphront-pager-view-css' => '1200d176', + 'aphront-panel-view-css' => '1200d176', + 'aphront-table-view-css' => '1200d176', + 'aphront-tokenizer-control-css' => '1200d176', + 'aphront-tooltip-css' => '1200d176', + 'aphront-typeahead-control-css' => '1200d176', 'differential-changeset-view-css' => '44bfe40c', 'differential-core-view-css' => '44bfe40c', 'differential-inline-comment-editor' => '5e9e5c4e', @@ -4431,7 +4431,7 @@ celerity_register_resource_map(array( 'differential-table-of-contents-css' => '44bfe40c', 'diffusion-commit-view-css' => 'c8ce2d88', 'diffusion-icons-css' => 'c8ce2d88', - 'global-drag-and-drop-css' => '1911a285', + 'global-drag-and-drop-css' => '1200d176', 'inline-comment-summary-css' => '44bfe40c', 'javelin-aphlict' => '8977e356', 'javelin-behavior' => 'f32597c9', @@ -4504,55 +4504,55 @@ celerity_register_resource_map(array( 'javelin-util' => 'f32597c9', 'javelin-vector' => 'f32597c9', 'javelin-workflow' => 'f32597c9', - 'lightbox-attachment-css' => '1911a285', + 'lightbox-attachment-css' => '1200d176', 'maniphest-task-summary-css' => '0a9e494f', 'maniphest-transaction-detail-css' => '0a9e494f', - 'phabricator-action-list-view-css' => '1911a285', - 'phabricator-application-launch-view-css' => '1911a285', + 'phabricator-action-list-view-css' => '1200d176', + 'phabricator-application-launch-view-css' => '1200d176', 'phabricator-busy' => '8977e356', 'phabricator-content-source-view-css' => '44bfe40c', - 'phabricator-core-css' => '1911a285', - 'phabricator-crumbs-view-css' => '1911a285', + 'phabricator-core-css' => '1200d176', + 'phabricator-crumbs-view-css' => '1200d176', 'phabricator-drag-and-drop-file-upload' => '5e9e5c4e', 'phabricator-dropdown-menu' => '8977e356', 'phabricator-file-upload' => '8977e356', - 'phabricator-filetree-view-css' => '1911a285', - 'phabricator-flag-css' => '1911a285', - 'phabricator-header-view-css' => '1911a285', + 'phabricator-filetree-view-css' => '1200d176', + 'phabricator-flag-css' => '1200d176', + 'phabricator-header-view-css' => '1200d176', 'phabricator-hovercard' => '8977e356', - 'phabricator-jump-nav' => '1911a285', + 'phabricator-jump-nav' => '1200d176', 'phabricator-keyboard-shortcut' => '8977e356', 'phabricator-keyboard-shortcut-manager' => '8977e356', - 'phabricator-main-menu-view' => '1911a285', + 'phabricator-main-menu-view' => '1200d176', 'phabricator-menu-item' => '8977e356', - 'phabricator-nav-view-css' => '1911a285', + 'phabricator-nav-view-css' => '1200d176', 'phabricator-notification' => '8977e356', - 'phabricator-notification-css' => '1911a285', - 'phabricator-notification-menu-css' => '1911a285', + 'phabricator-notification-css' => '1200d176', + 'phabricator-notification-menu-css' => '1200d176', 'phabricator-object-selector-css' => '44bfe40c', 'phabricator-phtize' => '8977e356', 'phabricator-prefab' => '8977e356', 'phabricator-project-tag-css' => '0a9e494f', - 'phabricator-property-list-view-css' => '1911a285', - 'phabricator-remarkup-css' => '1911a285', + 'phabricator-property-list-view-css' => '1200d176', + 'phabricator-remarkup-css' => '1200d176', 'phabricator-shaped-request' => '5e9e5c4e', - 'phabricator-side-menu-view-css' => '1911a285', - 'phabricator-standard-page-view' => '1911a285', - 'phabricator-tag-view-css' => '1911a285', + 'phabricator-side-menu-view-css' => '1200d176', + 'phabricator-standard-page-view' => '1200d176', + 'phabricator-tag-view-css' => '1200d176', 'phabricator-textareautils' => '8977e356', 'phabricator-tooltip' => '8977e356', - 'phabricator-transaction-view-css' => '1911a285', - 'phabricator-zindex-css' => '1911a285', - 'phui-button-css' => '1911a285', - 'phui-form-css' => '1911a285', - 'phui-form-view-css' => '1911a285', - 'phui-icon-view-css' => '1911a285', - 'phui-object-item-list-view-css' => '1911a285', - 'phui-spacing-css' => '1911a285', - 'sprite-apps-large-css' => '1911a285', - 'sprite-gradient-css' => '1911a285', - 'sprite-icons-css' => '1911a285', - 'sprite-menu-css' => '1911a285', - 'syntax-highlighting-css' => '1911a285', + 'phabricator-transaction-view-css' => '1200d176', + 'phabricator-zindex-css' => '1200d176', + 'phui-button-css' => '1200d176', + 'phui-form-css' => '1200d176', + 'phui-form-view-css' => '1200d176', + 'phui-icon-view-css' => '1200d176', + 'phui-object-item-list-view-css' => '1200d176', + 'phui-spacing-css' => '1200d176', + 'sprite-apps-large-css' => '1200d176', + 'sprite-gradient-css' => '1200d176', + 'sprite-icons-css' => '1200d176', + 'sprite-menu-css' => '1200d176', + 'syntax-highlighting-css' => '1200d176', ), )); diff --git a/src/applications/differential/view/DifferentialChangesetListView.php b/src/applications/differential/view/DifferentialChangesetListView.php index 8c038e2fca..53ead78627 100644 --- a/src/applications/differential/view/DifferentialChangesetListView.php +++ b/src/applications/differential/view/DifferentialChangesetListView.php @@ -311,17 +311,18 @@ final class DifferentialChangesetListView extends AphrontView { } $meta['containerID'] = $detail->getID(); + $caret = phutil_tag('span', array('class' => 'caret'), ''); return javelin_tag( 'a', array( - 'class' => 'button small grey', + 'class' => 'button grey small dropdown', 'meta' => $meta, 'href' => idx($meta, 'detailURI', '#'), 'target' => '_blank', 'sigil' => 'differential-view-options', ), - pht('View Options') . " \xE2\x96\xBC"); + array(pht('View Options'), $caret)); } } diff --git a/webroot/rsrc/css/phui/phui-button.css b/webroot/rsrc/css/phui/phui-button.css index 0ffb9dfcae..89eb7c2cea 100644 --- a/webroot/rsrc/css/phui/phui-button.css +++ b/webroot/rsrc/css/phui/phui-button.css @@ -152,8 +152,8 @@ button.link:hover { margin-top: -1px; padding: 5px 0; box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.3); - border: 1px solid #d7d7d7; - border-radius: 3px; + border: 1px solid {$lightgreyborder}; + border-bottom-color: {$greyborder}; } .dropdown-menu-frame a, @@ -224,7 +224,7 @@ a.toggle-fixed { width: 0; height: 0; vertical-align: middle; - border-left: 7px solid #74777D; + border-left: 7px solid {$greytext}; border-top: 5px solid transparent; border-bottom: 5px solid transparent; content: ""; @@ -248,6 +248,10 @@ a.toggle-fixed { margin-left: 4px; } +.small.dropdown .caret { + margin-top: 6px; +} + .grey.dropdown .caret { border-top-color: #000; }